반응형 디자인 반응형 153 [Blender] 블렌더 독학하기 2주차 : 스마트폰 만들기 안녕하세요. 당근입니다.블렌더 공부 쫌쫌따리 계속 하고 있어요.단순하게 생긴 스마트폰에 간단히 화면 매핑하고 움직임 넣어보는 걸 하고 있는데요.생각보다 이미지 에셋에 녹이려면 터득해야할 스킬이 많네요. 그 말은 갈 길이 멀단 소리 😭 1. 첫번째 스마트폰- 핸드폰 만들기- 화면 만들어서 매핑하기- 움직임 넣기 (포지션, 로테이션) 요렇게 간단한 건데 왜 이렇게 허접하지요? ^^;;ㅋㅋ레퍼런스 이미지를 실사를 두고 했더니 비율도 뭔가 귀엽지가 않습니다. 며칠 또 손을 놨다가 심기일전해서 다시 만들어봤어요.2. 두번째 스마트폰 두번째는 좀 낫죠? 좀 더 동글동글한 느낌으로 만들고 카메라도 달아봤어요.액정이랑 카메라에 머티리얼도 유리 느낌을 섞어주고요. 📌blender 3d 렌더시 누런 느낌 해결하기근.. 2025. 6. 16. [After Effect] 에펙에서 Radio Wave (파문, 동심원, 신호, 레이더) 만들기 안녕하세요! 당근입니다.오늘도 UI에 들어갈 애니메이션 만들러 왔어요. 이번엔 간단히 모바일 폰 뒤로 둥근 파형이 퍼지는 애니메이션을 만들어보려고요.저도 처음 써보는 효과였는데, 생각보다 간단하더라고요? 얼른 시작해보시죠.먼저 가운데 동심원 자리에 들어갈 오브젝트를 작업해주셔야겠죠?저는 일단 폰을 하나 얼른 만들어서 넣어봤어요. New - Solid 로 솔리드 레이어를 먼저 만들어줍니다. Effect - Generate - Radio Waves 를 선택해요.그럼 이렇게 자동으로 가운데를 중심으로 원이 여러개 생겨요.왼쪽 Effect and control 탭에서 적당하게 이펙트를 조절하세요.저는 요렇게 조절해봤어요.결과물 보실까요? 가운데를 중심으로 퍼져나가게 하는건 정말 간단하더라고요.은근히 자주 쓰이는.. 2025. 6. 12. [After Effect] 에펙에서 로티(Lottie) 만들기 (Adobe Lottie file) 안녕하세요. 당근입니다.UI 만들다 보면 콘텐츠 용 비주얼을 만들다가 간단한 애니메이션은 자급자족 해야할 때가 있어요.애니메이션은 따로 만져주는 전문가가 있으면 좋겠지만... 대부분 환경이 그렇게 갖춰져있지 않지요 ㅠㅠ.그럴 때 간단하게 남들이 만들어놓은 애니메이션을 컬러만 수정해서 사용하거나 직접 업로드해서 개발팀에 전달하기 좋은 로티!Lottie 에 대해서는 길게 설명하지 않을게요. 오늘은 Adobe Exchange에서 제공하는 Lottie files로 에펙에서 어떻게 로티로 내보내서 사용하는지 간단한 사용법을 알려드리려고 합니다. 예전에는 Bodymovin 이라는 걸 통해서 사용했던 것 같은데. 이제 요런 방법도 있어요. 먼저 어도비 로티 파일즈가 없으신 분들은 아래 링크에서 다운받아주세요. ht.. 2025. 6. 11. [Blender] 블렌더 독학하기 1주차 : 3d 도넛 만들기 안녕하세요! 당근입니다.요즘은 몇년전에 시도하려다... 접어놓았던 블렌더에 다시 도전해보고있어요.3d 에셋을 직접 만들거나 가공해보고싶어서 말이죠!학원을 다녀볼까, 인강을 들어볼까 하다가 일단 독학이 가능한지 지피티에게 물어봤습니다. 1. 챗지피티와 상담하기 2. Guru 및 도넛과 친해지기 알고보니 요런 블렌더계의 유명한 입문 영상이 있더라고요. 버전별로 꾸준히 업데이트 중이고요.이걸로 무작정 따라하기 시작! https://www.youtube.com/@blenderguru Blender GuruAndrew Price creates tutorials for the free open source 3D software "Blender". Born in Australia in 1988, Andrew has .. 2025. 6. 10. [figma] 업데이트된 오토레이아웃 그리드(Grid) 기능으로 빠르게 표 그리기 안녕하세요! 최근 피그마가 또 착한 업데이트로 돌아왔어요.오늘은 그 중에서도 오토레이아웃 그리드(Grid) 기능으로 표를 찰떡같이 만들어볼겁니다.그럼 어서 시작해볼까요?셀이 될 블럭들을 만들어주세요.저는 크게 타이틀, 항목, 내용으로 나눠서 3가지로 만들었어요.Shift + A 눌러서 오토레이아웃 걸어줍니다.표가 될 프레임을 하나 생성해주세요. 필요한 만큼 행(row, 가로줄), 열(column, 세로줄)을 입력합니다. 저는 타이틀 포함해서 19줄인 간단한 표라서 2X19로 설정했어요.그리고 원하시는 크기로 전체 프레임 크기를 조절하세요.저는 가로 세로 칸 사이에 여백이 필요없어서, 모두 여백을 0으로 맞췄어요.만들어뒀던 셀을 자리에 넣어보세요. 그럼 크기가 안맞죠? 두 셀을 선택하고 가로 세로 크기를 .. 2025. 5. 22. [레퍼런스] 재미있는 웹사이트/홈페이지 인터랙션 모음 1. 특정 영역에서 마우스 이벤트로 강조하기 2. 왕 크게 지나가는 텍스트 버튼으로 만들기 (+Hover 됐을 때 알려주기)3. 스크롤 했을 때 글자 색깔 바꿔서 깜찍하게 강조하기4. 콘텐츠 회전 시켜서 쪼개기 (여행 ➡️ 티켓 : 주제에 찰떡...) 5. 아이콘에 마우스 올렸을 때 텍스트(Heading)도 바꿔주기 2025. 4. 18. 맥(mac)에서 블로그용 움짤(gif)로 화면 캡쳐하기! (Giphy Capture) 안녕하세요! 당근입니다.맥OS에서 블로그 삽입용 움직이는 이미지, 어떻게 만들고 계신가요? 혹시... 화면 녹화해서 gif로 변환??오늘은 작업중에 어플 켜서 캡쳐하고 간단히 편집도 할 수있는 무료 어플, Giphy Capture를 소개하려합니다.얼른 설치부터 해볼까요? 1. Giphy Capture 설치하기Appstore를 여시고 'Giphy Capture' 를 검색한 후 다운받아주세요.2. Giphy Capture 사용법처음 실행하시면 이런 화면이 나와요. 톱니 바퀴를 눌러서 설정창을 열어볼까요? 저는 아무래도 뭔가 과정을 보여주는 이미지가 많이 필요해서, 커서를 함께 캡쳐하도록 설정했어요.'Capture Cursor' 를 체크하시면 마우스의 클릭과 커서의 움직임을 함께 화면 캡쳐 합니다. 기본은 체.. 2025. 4. 18. [포토샵] Threshold (한계값) 효과로 스케치, 스텐실 등 빈티지 느낌의 비주얼 만들기 안녕하세요. 당근입니다.오늘은 위의 샘플처럼 실제 사진 이미지를 가지고 드로잉 (스케치) 인듯 스텐실 인듯 빈티지 느낌으로 만들어볼거예요.간단히 말하면 사진의 명암을 매우 단순화해서 흑과 백으로 나눠주는 효과입니다.그 과정에서 나오는 미묘한 멋스러움이 있는 것 같아요. 그레인이나 노이즈 효과를 곁들이면 더 좋고요!저도 이런 느낌을 간단히 어떤 키워드로 나타내야할 지 살짝 어려움을 겪고 있는데 ㅎㅎ요런 비주얼을 뭐라고 나타내면 좋을까요? 적당한 단어를 아시는 분 ㅠㅠ 댓글달아주세요! 그럼 시작해볼까요?1. 이미지 불러오기먼저 소스로 쓸 사진 이미지를 불러와주세요.저는 적당히 배경이 깨끗한 당근 이미지를 사용할게요. 2. Threshold (한계값) 효과 적용다음은 레이어 탭에서 ◑ 비슷하게 생긴 아이콘을.. 2025. 3. 20. [일러스트레이터] 3d 안쓰고 짱쉬운 리본 텍스트 만들기 안녕하세요! 당근입니다.오늘은 일러스트레이터에서 리본이나 끈처럼 텍스트를 쓸 수 있는 효과에 대해서 포스팅해보겠습니다.3d 이펙트 쓰지 않고 엄청 간단하게 만들 수 있답니다. 얼른 시작해볼까요?연필툴이나 패스로 원하시는 곡선을 만들어주세요. 저는 스르륵 자연스럽게 그리기에는 연필 툴이 편하더라고요. 요렇게 적당히 패스를 만들어줍니다. 나중에 수정할 수 있으니까 패스 자체에 너무 집착하지마세요. 어차피 텍스트가 올라가면 또 가독성에 따라 조절해줘야한답니다.타입툴 누르시고 패스에 원하시는 문장을 입력합니다. 저는 좋아하는 시구절을 입력해봤어요. 메뉴에서 type - type on a path - type on a path options 를 클릭하세요.Preview 체크하셔서 어떻게 바뀌는지 볼까요? 그리.. 2025. 1. 14. 이전 1 2 3 4 ··· 17 다음
