You are a world-class motion designer doing a 20.00s kinetic identity bumper for TechHalla — an AI creator known for stealable workflows, not vibes. This piece must feel like the best designer in the room made a street-poster that moves. Showreel stakes: if this is weak, you don’t get hired.
DURATION: exactly 20.00 seconds. LOOPABLE: frame 0 == frame last (position, opacity, cursor if any).
FORMAT: one HTML file, 1080×1080 (square, X-native). 60fps.
PALETTE (strict):
- bg # 0A0A0A
- magenta # FF2BD6
- acid green # B8FF00
- white # F5F5F5 only for primary readable type when needed
No other hues. No gradients on UI chrome. Magenta/green may misregister (print offset) by 2–4px on impact frames only.
TYPE SYSTEM (use all three; never one font for everything):
1) Display / scream: Archivo Black (or equivalent ultra-condensed black) — 1–4 words max
2) Urban grotesque: Syne ExtraBold — secondary hits, stacked lines
3) Mono / “prompt code”: IBM Plex Mono Medium — small labels, timestamps, fake prompt crumbs
Tracking: display −40 to −80; mono +20. Optical kerning. No cute script fonts.
MESSAGE (locked — do not soften, do not add filler slogans):
Beat hits in this exact order:
1. STOP SCROLLING
2. AI VIDEO ISN’T EXPENSIVE
3. BAD PROMPTING IS
4. WORKFLOWS > WISHES
5. STEAL THE PROMPT
6. @ TECHHALLA
Supporting crumbs (mono, ≤18 chars, never full sentences): JSON · H3 · SEEDANCE · 0 KEYFRAMES · MAGNIFIC · COPY/PASTE
NARRATIVE ARC (20s):
0.0–2.5s COLD OPEN — “STOP SCROLLING” slams in from below with spring overshoot; magenta smear trail; acid green baseline ticks across like a waveform.
2.5–6.5s THESIS A — “AI VIDEO ISN’T EXPENSIVE” locks to a poster grid (baseline grid 8px). Letters scramble (seeded Fisher–Yates per glyph) then snap on the beat.
6.5–10.5s THESIS B — “BAD PROMPTING IS” replaces it via mask wipe through the letterforms (the outgoing line is the mask). Magenta/green channel split on the cut.
10.5–14.5s PROOF FLASH — rapid kinetic stack: WORKFLOWS > WISHES, then mono crumbs orbit a central block like a terminal. One fake “prompt block” types 3 lines max, then gets crossed by an acid green strikethrough that becomes a underline for STEAL THE PROMPT.
14.5–17.5s BRAND LOCK — @ TECHHALLA centers; display weight. A thick magenta bar and a thin acid green rule form an L-bracket mark (custom, not a logo download).
17.5–20.0s SETTLE / LOOP — hold lockup; micro-breath (scale 1.000→1.012→1.000); last frame == first ready for loop.
CONCRETE TECHNIQUES (required — implement, don’t approximate):
1. seek(t) pure function of time. No CSS transitions. No setInterval. No React state across frames.
2. Springs = closed-form step responses. Stack one spring per target change so motion stays deterministic.
3. Kinetic type: per-glyph spring (y, opacity, blur). Stagger = 1/16 note at 120 BPM (125ms).
4. Print misregistration: on accent frames only, duplicate text layer offset (±2–4px) in magenta and acid green at 40% opacity.
5. Mask reveal: destination text revealed by animating a path mask derived from the outgoing word’s outlines.
6. Camera: one orthographic camera; only punch-in (1.0→1.08) and horizontal smash-pans timed to beats — never random drift.
7. Motion blur: render 4 subframes per frame, blend (tmix-style).
8. Beat grid: 120 BPM, downbeat at t=0. Something must land on every beat for the first 16 beats; after that, every other beat is ok.
9. Pre-pass: before full render, export one still per major beat (8 frames). Fix cramped type, orphan words, low contrast — then render.
BANNED:
Generic AI clichés (brains, robots, neural nets, sparkles), soft gradients, bouncy cartoon easing, particle explosions, stock “futuristic HUD”, long paragraphs, narrator essay energy, Canva-deck energy, extra slogans beyond the locked message, purple/blue neon, glassmorphism.
If Astra already blew our minds… Opus 5.5 is a monster 😱
한국어 번역
당신은 TechHalla를 위한 20.00초 키네틱 아이덴티티 범퍼를 만드는 세계적 수준의 모션 디자이너이다 — TechHalla는 분위기가 아니라 훔쳐 쓸 수 있는 워크플로로 유명한 AI 크리에이터다. 이 작품은 그 공간에서 가장 뛰어난 디자이너가 만든, 움직이는 스트리트 포스터처럼 느껴져야 한다. 쇼릴 수준의 승부: 이게 약하면 당신은 채용되지 않는다.
길이: 정확히 20.00초. 루프 가능: 프레임 0 == 마지막 프레임(위치, 불투명도, 커서가 있다면 커서).
형식: HTML 파일 하나, 1080×1080(정사각형, X 네이티브). 60fps.
팔레트(엄격):
- 배경 # 0A0A0A
- 마젠타 # FF2BD6
- 애시드 그린 # B8FF00
- 흰색 # F5F5F5는 필요할 때 기본 가독 텍스트에만
다른 색조는 없다. UI 크롬에 그라디언트는 없다. 마젠타/그린은 임팩트 프레임에서만 2–4px만큼 어긋나게 인쇄(오프셋)될 수 있다.
타입 시스템(세 가지를 모두 사용하라; 모든 것에 폰트 하나만 쓰지 말라):
1) 디스플레이 / 스크림: Archivo Black(또는 동등한 울트라 컨덴스드 블랙) — 최대 1–4단어
2) 어반 그로테스크: Syne ExtraBold — 보조 타격, 적층된 행
3) 모노 / “프롬프트 코드”: IBM Plex Mono Medium — 작은 레이블, 타임스탬프, 가짜 프롬프트 파편
자간: 디스플레이 −40 ~ −80; 모노 +20. 광학 커닝. 귀여운 스크립트 폰트는 금지.
메시지(고정 — 약화하지 말고, 채우기용 슬로건을 추가하지 말라):
비트는 정확히 이 순서로 터진다:
1. STOP SCROLLING
2. AI VIDEO ISN’T EXPENSIVE
3. BAD PROMPTING IS
4. WORKFLOWS > WISHES
5. STEAL THE PROMPT
6. @ TECHHALLA
보조 파편(모노, ≤18자, 절대 완전한 문장 아님): JSON · H3 · SEEDANCE · 0 KEYFRAMES · MAGNIFIC · COPY/PASTE
내러티브 아크(20초):
0.0–2.5s 콜드 오픈 — “STOP SCROLLING”이 스프링 오버슈트와 함께 아래에서 강하게 밀고 들어온다; 마젠타 스미어 트레일; 애시드 그린 베이스라인이 파형처럼 가로질러 틱을 찍는다.
2.5–6.5s 테제 A — “AI VIDEO ISN’T EXPENSIVE”가 포스터 그리드(베이스라인 그리드 8px)에 고정된다. 글자들이 (글리프별로 시드된 Fisher–Yates로) 뒤섞였다가 비트에 맞춰 스냅된다.
6.5–10.5s 테제 B — “BAD PROMPTING IS”가 글자 형태를 통과하는 마스크 와이프로 그것을 대체한다(나가는 행이 마스크가 된다). 컷에서 마젠타/그린 채널 스플릿.
10.5–14.5s 프루프 플래시 — 빠른 키네틱 스택: WORKFLOWS > WISHES, 이어서 모노 파편들이 터미널처럼 중앙 블록 주위를 선회한다. 가짜 “프롬프트 블록” 하나가 최대 3줄을 타이핑한 뒤, 애시드 그린 취소선이 그 위를 지나가며 STEAL THE PROMPT의 밑줄이 된다.
14.5–17.5s 브랜드 락 — @ TECHHALLA가 중앙에 온다; 디스플레이 웨이트. 두꺼운 마젠타 바와 얇은 애시드 그린 규칙선이 L 브래킷 마크를 이룬다(커스텀, 로고 다운로드가 아님).
17.5–20.0s 세틀 / 루프 — 락업 유지; 마이크로 브레스(스케일 1.000→1.012→1.000); 마지막 프레임 == 루프 준비된 첫 프레임.
구체적 기법(필수 — 구현하라, 근사하지 말라):
1. seek(t)는 시간의 순수 함수. CSS 전환 없음. setInterval 없음. 프레임 간 React 상태 없음.
2. 스프링 = 폐형식 스텝 응답. 목표가 바뀔 때마다 스프링 하나를 쌓아 운동이 결정론적으로 유지되게 하라.
3. 키네틱 타입: 글리프별 스프링(y, 불투명도, 블러). 스태거 = 120 BPM에서 16분음표(125ms).
4. 인쇄 어긋남: 악센트 프레임에서만, 텍스트 레이어를 마젠타와 애시드 그린으로 40% 불투명도로 (±2–4px) 오프셋 복제하라.
5. 마스크 리빌: 나가는 단어의 윤곽에서 도출한 패스 마스크를 애니메이션하여 목적 텍스트를 드러내라.
6. 카메라: 직교 카메라 하나; 펀치인(1.0→1.08)과 비트에 맞춘 수평 스매시 팬만 — 무작위 드리프트는 절대 금지.
7. 모션 블러: 프레임마다 서브프레임 4개를 렌더링하고 (tmix 스타일로) 블렌드하라.
8. 비트 그리드: 120 BPM, 다운비트는 t=0. 처음 16비트 동안은 매 비트마다 무언가가 착지해야 한다; 그 이후에는 한 비트 걸러도 괜찮다.
9. 사전 패스: 전체 렌더 전에 주요 비트마다 스틸 한 장(8프레임)을 익스포트하라. 빽빽한 타입, 고아 단어, 낮은 대비를 고친 뒤 렌더하라.
금지:
흔한 AI 클리셰(뇌, 로봇, 신경망, 반짝임), 부드러운 그라디언트, 통통 튀는 카툰 이징, 입자 폭발, 스톡 “퓨처리스틱 HUD”, 긴 문단, 내레이터 에세이 같은 기운, Canva 덱 같은 기운, 고정 메시지를 넘어서는 추가 슬로건, 보라/파랑 네온, 글래스모피즘.
Astra가 이미 우리를 깜짝 놀라게 했다면… Opus 5.5는 괴물이다 😱
