첨부한 이미지를 「마지막 화면」으로 삼아, 전부 타일로 만든 30초 광고 영상(소리 포함・mp4)을 만들어 주세요.

프롬프트

添付の画像を「最後の画面」にして、全部タイルでできた30秒の広告動画（音つき・mp4）を作ってください。
ブラウザ（Three.js）で組み、Chromeで全コマを書き出し、ffmpegでmp4にします。

# ゴール
- 見る人は25秒、タイルの制作動画だと思って見る。最後の数秒で、添付画像（広告）だったと気づく
- 最後の画面は添付画像とほぼ同じ。文字が読める。画面いっぱいがタイル（床は見せない）

# 仕様
- 1920×1080、30fps、30秒。HTML1ファイル（Three.js。npmで入れてesbuildで1ファイルに固める）
- 時刻 t を渡すと、同じ t なら必ず同じ絵になる作りにする（seek(t)）
- タイルは1枚ずつ別のインスタンス。16:9の格子で約19万枚（576×324）
- 位置・向き・厚み・面取り・色を1枚ずつ変える。目地（隙間）は空き。線は引かない
- 添付画像は、タイルの色を取るためだけに使う（テクスチャとして貼らない）
- 素材は約12種（釉薬セラミック、スレート、真珠貝、白磁、テラコッタ、ガラスなど）。色の明るさと彩度で割り当てる
- 光は、左上の硬い太陽1つ。床は漆喰。奥に赤い大工のチョーク線がピンぼけで入る
- 被写界深度（円形ボケ）を後処理で自作する。しぼりは最初大きく、最後は小さく

# 流れ（秒）
0〜3　 床に暗いタイルが1枚。カメラは床すれすれ
3〜10　[組み始める場所]から、タイルが渦を巻いて落ちる。最初の1枚→周りの順に増える
10〜21 一気に外へ広がる。カメラが引いて[見せたい絵]が見えてくる
21〜24 全体が見える。文字になる場所は、周りと同じ淡い色のまま
24〜26 文字・ロゴ・ボタンのタイルが、左から順にパタパタ裏返って現れる
26〜30 真上からの構図で止まる。カーソルが[ボタンの文言]をクリックし、ボタンのタイルが少し沈む

# ハマりどころ（必ず守る）
- 文字になるタイルは、最初は周りの背景色で組む。背景色は、外側から内側へ塗り広げて決める。文字のふち（白ぶち）も一緒に裏返す。守らないと、途中で文字の形が見えてしまう
- 真上のカメラは、位置を真上ぴったりにしない（向きが90°回る）。止める所は、動きの勢いをゼロにする（補間のはみ出しで反転する）
- 最後の画面は、元画像と並べて色を比べ、露出・彩度・色味を合わせる
- 文字が小さくて読めないときは、タイル数を増やす
- 下地の暗い面は、タイルが着地したマスだけに出す

# 音
- ElevenLabsの効果音で、タイルを置く音・裏返す音・マウスのクリックを作る（各0.5秒）。作る前に、クレジットの消費を知らせる
- タイルの着地・裏返しの時刻に合わせて並べて重ねる。カメラが遠いほど小さく、数が増えたら雨のようにまとめる
- 24〜26秒のパタパタを、いちばん目立たせる。音量は -16 LUFS

# 進め方
1. 先に脚本（秒ごとの情景）を日本語で出し、OKをもらってから作る
2. 途中のコマ（最初のタイル／組み始め／引き／全景／文字が出る瞬間／最後）を自分で見て直す
3. 書き出しは Chrome（puppeteer-core）で seek(t) を30fpsぶん呼び、png を ffmpeg に流す
4. 納品は mp4（高画質と共有用）と、確認した画像

# 入力
- エンドフレーム: [添付]
- 組み始める場所: [例：人物の目]
- 引いたときに見せたい絵: [例：笑顔の女性]
- ボタンの文言: [例：無料体験はこちら]

한국어 번역

첨부한 이미지를 「마지막 화면」으로 삼아, 전부 타일로 이루어진 30초 광고 영상(소리 있음・mp4)을 만들어 주세요.
브라우저(Three.js)에서 구성하고, Chrome에서 모든 프레임을 내보낸 뒤, ffmpeg로 mp4로 만듭니다.

# 목표
- 보는 사람은 25초 동안 타일 제작 영상이라고 생각하며 본다. 마지막 몇 초에 첨부 이미지(광고)였다는 것을 깨닫는다
- 마지막 화면은 첨부 이미지와 거의 같다. 글자가 읽힌다. 화면 전체가 타일(바닥은 보이지 않는다)

# 사양
- 1920×1080, 30fps, 30초. HTML 1개 파일(Three.js. npm으로 설치해 esbuild로 1개 파일로 묶는다)
- 시각 t를 넘기면 같은 t라면 반드시 같은 그림이 되도록 만든다(seek(t))
- 타일은 한 장씩 별도 인스턴스. 16:9 격자로 약 19만 장(576×324)
- 위치・방향・두께・모따기・색을 한 장씩 바꾼다. 줄눈(틈)은 비워 둔다. 선은 긋지 않는다
- 첨부 이미지는 타일의 색을 뽑기 위해서만 쓴다(텍스처로 붙이지 않는다)
- 재질은 약 12종(유약 세라믹, 슬레이트, 진주조개, 백자, 테라코타, 유리 등). 색의 밝기와 채도로 배정한다
- 빛은 왼쪽 위의 단단한 태양 하나. 바닥은 회반죽. 안쪽에는 빨간 목공 분필선이 초점이 나가 흐릿하게 들어간다
- 피사계 심도(원형 보케)를 후처리로 직접 만든다. 조리개는 처음에 크게, 마지막에 작게

# 흐름(초)
0〜3　 바닥에 어두운 타일 한 장. 카메라는 바닥에 거의 붙어 있다
3〜10　[조립을 시작하는 지점]에서 타일이 소용돌이를 그리며 떨어진다. 첫 한 장→주변 순서로 늘어난다
10〜21 단번에 바깥으로 퍼진다. 카메라가 물러나 [보여주고 싶은 그림]이 드러난다
21〜24 전체가 보인다. 글자가 되는 지점은 주변과 같은 옅은 색 그대로
24〜26 글자・로고・버튼 타일이 왼쪽부터 차례로 파닥파닥 뒤집히며 나타난다
26〜30 바로 위에서 내려다보는 구도로 멈춘다. 커서가 [버튼의 문구]를 클릭하고, 버튼 타일이 조금 가라앉는다

# 함정(반드시 지킬 것)
- 글자가 되는 타일은 처음에는 주변 배경색으로 조립한다. 배경색은 바깥에서 안쪽으로 채워 나가며 정한다. 글자 테두리(흰 테두리)도 함께 뒤집는다. 지키지 않으면 도중에 글자 형태가 보인다
- 바로 위에 놓인 카메라는 위치를 정확히 바로 위로 하지 않는다(방향이 90° 돌아간다). 멈추는 지점에서는 움직임의 관성을 0으로 만든다(보간의 오버슈트로 반전된다)
- 마지막 화면은 원본 이미지와 나란히 놓고 색을 비교해 노출・채도・색조를 맞춘다
- 글자가 작아 읽을 수 없을 때는 타일 수를 늘린다
- 바탕의 어두운 면은 타일이 착지한 칸에만 나타나게 한다

# 소리
- ElevenLabs 효과음으로 타일을 놓는 소리・뒤집는 소리・마우스 클릭을 만든다(각 0.5초). 만들기 전에 크레딧 소모를 알린다
- 타일의 착지・뒤집힘 시각에 맞춰 배치하고 겹친다. 카메라가 멀수록 작게, 수가 늘면 비처럼 묶는다
- 24〜26초의 파닥파닥을 가장 눈에 띄게 한다. 음량은 -16 LUFS

# 진행 방법
1. 먼저 대본(초 단위 장면)을 일본어로 내고, OK를 받은 뒤 만든다
2. 중간 프레임(첫 타일／조립 시작／풀백／전경／글자가 나오는 순간／마지막)을 직접 보고 고친다
3. 내보내기는 Chrome(puppeteer-core)에서 seek(t)를 30fps만큼 호출하고, png를 ffmpeg에 흘려보낸다
4. 납품은 mp4(고화질판과 공유용)와 확인한 이미지

# 입력
- 엔드 프레임: [첨부]
- 조립을 시작하는 지점: [예: 인물의 눈]
- 물러났을 때 보여주고 싶은 그림: [예: 웃는 여성]
- 버튼의 문구: [예: 무료 체험은 이쪽]

출처

원작자

tanabe_fragm

게시일

2026-10-07（由推文 ID 反解）

원문 출처

원문 보기 ↗

수록 출처

yihui-dev/awesome-opus5-5-videos · tanabe-fragm-322001 · MIT