틱톡이나 릴스용 앱 홍보 영상을 위한 10초 분량의 세로형 모션 그래픽을 코드로 생성하고 싶을 때
Build a 10-second vertical motion design ad (1080x1920, 30 fps) for my app ${app_name}, which ${what_it_does_in_one_sentence}.
Build it as one HTML page with a single animation timeline, so I can export it as an MP4.
Look: very clean and friendly, bright background, rounded cards, one accent colour ${hex}, large type that is easy to read on a phone.
Scene 1 (0 to 2.4 s): the hook "[HOOK, max 6 words]" builds word by word in the upper third. Each word rises with a soft overshoot.
Scene 2 (2.4 to 5.5 s): a phone screen slides up. It shows the main step of the app: [MAIN STEP, e.g. a receipt is read and split into names].
Scene 3 (5.5 to 8 s): the result pops in as small cards, one after another: ${result}.
Scene 4 (8 to 10 s): app icon, name and "${call_to_action}".
Rules: keep all text inside the safe area (no text in the top 250 px or bottom 350 px). The camera keeps moving gently. One object carries the story from start to end.내 앱 [앱 이름]을 위한 10초 세로형 모션 디자인 광고(1080x1920, 30fps)를 제작해줘. 이 앱은 [앱의 기능을 한 문장으로] 하는 앱이야. MP4로 내보낼 수 있도록 단일 애니메이션 타임라인이 있는 하나의 HTML 페이지로 만들어줘. 디자인: 매우 깔끔하고 친근하게, 밝은 배경, 둥근 카드, 하나의 강조 색상 [색상 코드], 휴대폰에서 읽기 쉬운 큰 글씨. 장면 1 (0-2.4초): 상단 1/3 지점에 '[훅 문구, 최대 6단어]'가 한 단어씩 나타남. 각 단어는 부드럽게 튀어 오르며 상승. 장면 2 (2.4-5.5초): 휴대폰 화면이 위로 슬라이드됨. 앱의 주요 단계인 [주요 단계]를 보여줌. 장면 3 (5.5-8초): 결과가 작은 카드 형태로 하나씩 팝업됨: [결과 값]. 장면 4 (8-10초): 앱 아이콘, 이름, 그리고 '[행동 유도 문구]' 표시. 규칙: 모든 텍스트는 안전 영역 내에 유지(상단 250px, 하단 350px 이내에 텍스트 금지). 카메라는 계속 부드럽게 움직임. 하나의 오브젝트가 시작부터 끝까지 이야기를 이끌어감.
출처 · prompts.chat · Claude prompt: 10-second app ad for Reels and TikTok (9:16) — 원문은 출처에 게시된 그대로이며, 권리는 원작자에게 있습니다.
Gemini로 프롬프트를 실행해 생성한 화면입니다. 화면 안에서 직접 조작하실 수 있습니다.
영수증 사진 한 장으로 복잡한 단체 결제를 멤버별로 자동 분할해 주는 모바일 정산 앱 'TPI 정산'의 10초 세로형 모션 그래픽 광고입니다. 황금빛 스마트 토큰 오브젝트가 텍스트 강조부터 영수증 스캔 광선, 멤버별 카드 분배 및 최종 브랜드 심볼로 자연스럽게 변환되며 1080×1920 세이프존 안에서 매끄럽게 전개됩니다.
Build a 10-second vertical motion design ad (1080x1920, 30 fps) for my app TPI 정산, which 영수증을 촬영하면 알아서 사람별로 나눠주는 스마트 정산 앱. Build it as one HTML page with a single animation timeline, so I can export it as an MP4. Look: very clean and friendly, bright background, rounded cards, one accent colour #4F46E5, large type that is easy to read on a phone. Scene 1 (0 to 2.4 s): the hook "복잡한 모임 정산 한번에 끝내기" builds word by word in the upper third. Each word rises with a soft overshoot. Scene 2 (2.4 to 5.5 s): a phone screen slides up. It shows the main step of the app: 영수증 스캔 한 번으로 메뉴별 분할. Scene 3 (5.5 to 8 s): the result pops in as small cards, one after another: 멤버별 정산 금액과 입금 링크 자동 생성. Scene 4 (8 to 10 s): app icon, name and "지금 바로 무료로 시작하기". Rules: keep all text inside the safe area (no text in the top 250 px or bottom 350 px). The camera keeps moving gently. One object carries the story from start to end.
Gemini로 실행한 결과입니다. 입력 항목에는 국내 환경의 예시값을 적용했습니다(AI 생성 — 사실 확인 필요).
Build a 10-second vertical motion design ad (1080x1920, 30 fps) for my app TPI 정산, which 영수증을 촬영하면 알아서 사람별로 나눠주는 스마트 정산 앱. Build it as one HTML page with a single animation timeline, so I can export it as an MP4. Look: very clean and friendly, bright background, rounded cards, one accent colour #4F46E5, large type that is easy to read on a phone. Scene 1 (0 to 2.4 s): the hook "복잡한 모임 정산 한번에 끝내기" builds word by word in the upper third. Each word rises with a soft overshoot. Scene 2 (2.4 to 5.5 s): a phone screen slides up. It shows the main step of the app: 영수증 스캔 한 번으로 메뉴별 분할. Scene 3 (5.5 to 8 s): the result pops in as small cards, one after another: 멤버별 정산 금액과 입금 링크 자동 생성. Scene 4 (8 to 10 s): app icon, name and "지금 바로 무료로 시작하기". Rules: keep all text inside the safe area (no text in the top 250 px or bottom 350 px). The camera keeps moving gently. One object carries the story from start to end.
영수증 사진 한 장으로 복잡한 단체 결제를 멤버별로 자동 분할해 주는 모바일 정산 앱 'TPI 정산'의 10초 세로형 모션 그래픽 광고입니다. 황금빛 스마트 토큰 오브젝트가 텍스트 강조부터 영수증 스캔 광선, 멤버별 카드 분배 및 최종 브랜드 심볼로 자연스럽게 변환되며 1080×1920 세이프존 안에서 매끄럽게 전개됩니다.
원문과 같은 언어로 보완한 프롬프트입니다. 점수는 명확성 · 구체성 · 출력 형식 · 재사용성 기준의 AI 평가입니다.
Act as an expert Creative Developer and Motion Designer. Create a 10-second vertical ad (1080x1920, 30fps) for '${app_name}', which ${what_it_does_in_one_sentence}. Deliver a single self-contained HTML file using GSAP for a precise animation timeline.
Visual Identity: Clean, friendly, bright background, rounded cards (border-radius: 40px), accent color ${hex}, and large mobile-optimized type.
Constraints: Keep all text within the safe area (exclude top 250px/bottom 350px).
Storyboard:
1. Hook (0-2.4s): '[HOOK]' (max 6 words) builds word-by-word with a soft overshoot (ease: 'back.out').
2. Main Action (2.4-5.5s): A phone UI slides up smoothly showing [MAIN STEP].
3. Proof (5.5-8s): Result cards '${result}' stagger in one by one.
4. Outro (8-10s): App icon, name, and '${call_to_action}' appear.
Technical Requirements: Implement a continuous 'camera' drift (subtle scale/position shift). Use one central element to anchor the transition between scenes for visual flow. Ensure the code is export-ready for MP4 conversion.