캐릭터 · 8초

캐릭터가 쿵 착지하고 말풍선으로 인사

동글동글한 캐릭터가 위에서 떨어져 무대에 쿵 착지해요. 찌그러졌다 출렁이며 제 모양으로 돌아오고, 발밑에 먼지가 퍼지고 화면도 살짝 흔들립니다. 이어 말풍선이 톡 나와 문장을 한 글자씩 타이핑하고, 다 쓰면 캐릭터가 한 번 콩 뛰어요.

이럴 때 쓰세요

수업 영상 첫 인사 장면
원데이 클래스 오프닝에서 마스코트 소개
공지 영상에서 «오늘 배울 것» 한 줄 안내

「여기만 고치세요」 칸

캐릭터그림: — 내 캐릭터 PNG 경로(배경 투명 권장). 비워 두면 파일 안에서 그린 동글이
몸색: — 동글이 몸 색 (그림을 넣으면 안 씀)
말풍선문장: — 한 글자씩 타이핑될 문장. 두 줄 안쪽이 보기 좋아요
착지높이: — 얼마나 높은 곳에서 떨어질지(px). 클수록 더 높이서 떨어짐
글자속도: — 한 글자에 걸리는 초. 작을수록 빨라요

파일을 건네며 AI에게 이렇게 말해 보세요

첨부한 HTML은 하이퍼프레임즈 영상 레시피야. 맨 아래 「여기만 고치세요」 칸만 바꿔 줘. 말풍선문장: "반가워요! 오늘은 카카오톡 사진 보내기를 배워요." 몸색: "#FFB86B" 착지높이: 1100 글자속도: 0.06 바꾼 다음 npx hyperframes render 로 mp4까지 뽑아 줘.

Claude Code·Codex·안티그래비티처럼 파일을 고치고 명령을 실행할 수 있는 AI에게 건네세요.

알아 두면 좋은 점

내 캐릭터 PNG는 발이 그림 맨 아래에 닿게 잘라야 착지가 자연스러워요.
말풍선 문장이 길면 글자속도를 0.05쯤으로 줄여 8초 안에 끝나게 하세요.

원본 HTML

로그인하면 이 영상을 만든 HTML 파일을 그대로 받을 수 있어요.
회원가입은 무료예요.

로그인하고 원본 받기

내 컴퓨터에서 직접 돌려 보기

AI에게 맡기지 않고 직접 해 보려면 터미널에서 아래 순서대로 하세요. 하이퍼프레임즈(HyperFrames)는 HTML을 영상으로 바꿔 주는 무료 도구예요.

# 1) 처음 한 번만: Node.js 설치 (nodejs.org 에서 LTS)
#    + FFmpeg 설치 (맥: brew install ffmpeg / 윈도우: winget install Gyan.FFmpeg)
#    준비됐는지 확인: npx hyperframes doctor  → FFmpeg·Chrome 줄이 ✓ 면 OK
# 2) 영상 폴더 만들기
npx hyperframes init 내영상
cd 내영상
# 3) 받은 레시피 파일을 이 폴더의 index.html 자리에 덮어쓰기
# 4) 미리 보기 → 영상 뽑기
npx hyperframes preview
npx hyperframes render -o 결과.mp4