아이패드로 간단한 모션 만들기

Procreate → Figma → GIF로 결과물 완성하기

 

준비물 Procreate (유료 앱): 손그림, 스토리보드, 간단한 프레임 애니메이션 Figma (무료 웹 앱): UI 컴포넌트 제작, 화면 구성, 프로토타입 구성 GIF 변환 앱 (예: CapCut): 화면 녹화나 이미지 → GIF로 변환 가능 👉 모두 아이패드에서 사용 가능하며, 터치 기반이라 작업 흐름이 매우 자연스러워요.

 

Step 1. Procreate로 아이디어 드로잉

1. Procreate에서 새 캔버스를 만들고, 간단한 디자인 요소(버튼, 아이콘 등)를 그립니다.
2. 애니메이션 기능(Action > Animation Assist)을 활용해 간단한 프레임 애니메이션을 만들 수 있어요.
3. 움직임을 프레임별로 나눠서 '손바닥이 점점 나타나게', '벚꽃잎이 위에서 아래로 내려오는 효과' 등을 연출해보세요.

🖍️ 예시: 화면 실행 → 벚꽃 잎이 손 위로  떨어지는 애니메이션

STEP 2. Figma에서 프로토타입 구성

1. Figma 웹사이트에서 새 파일을 열고, 화면 사이즈를 설정해요.
2. 두 개의 프레임(예: 전/후 상태)을 만들어 요소들을 배치합니다.
3. Prototype 탭으로 이동해 전환 플로우를 연결합니다:

• 화면 터치 → 다음 화면으로 전환
• Smart Animate로 부드러운 전환 설정 가능

아이패드에서는 Figma 웹에서 Share 옆 ↓ 아이콘 > Preview로 미리보기 가능해요!

 

STEP 3. 모션 결과물 저장 & 정리하기

Figma에서 만든 인터랙션 흐름을 직접 GIF로 추출하긴 어렵지만, 아이패드에서는 다음과 같이 정리할 수 있어요:

📱 화면 녹화 → GIF 만들기 (현실적인 아이패드 방식)

1. 아이패드 ‘제어 센터’에서 화면 녹화 시작
2. Figma의 Preview 모드에서 인터랙션을 직접 터치하며 실행
3. 저장된 영상을 사진 앱에서 간단히 자르기
4. ImgPlay, GIF Maker, CapCut 같은 앱에서 GIF로 변환

마무리하며

아이패드 하나만으로도 충분히 디자인 → 애니메이션 → 결과물 제작까지 전 과정을 마칠 수 있어요.
복잡한 툴 없이, 손끝에서 바로바로 표현되는 흐름은 오히려 더 창의적일 수 있어요.

작은 인터랙션이라도 사용자의 감정을 사로잡을 수 있다면, 그 디자인은 성공입니다 :)
오늘 아이디어가 떠올랐다면, 바로 표현해보세요!

 

 

도움이 되셨다면 하트💗 꾹 눌러주시고, 궁금한 점은 댓글로 남겨주세요!