name: long-poster-making-video

description: 1:4 비율의 4페이지 세로형 롱스크롤 포스터를 생성하고(3:4 스타일 앵커 및 image_references 사용) 35~42개의 동시 커서가 화면의 활성화된 경계 상자 핸들이나 타이핑 캐럿에 엄격히 고정되어 목적 없는 이동 없이 작업하는 초고해상도 1080p 42커서 Figma 와이어프레임-라이브 제작 과정 영상을 만듭니다. 사용자가 Gemini, Grok, Claude 또는 ChatGPT에서 여러 페이지로 구성된 롱 포스터, 고밀도 멀티 커서 와이어프레임-라이브 디자인 프로세스 영상, 또는 포스터 제작 과정 영상을 요청할 때 사용하세요. allowed-tools: image_gen default_api google

롱 포스터 및 42커서 스웜 제작 과정 영상 스킬 (독립형)

요약

이것은 다중 디자이너/다중 AI 에이전트 협업 구축(와이어프레임에서 라이브로) 과정을 시뮬레이션하는 1080p 제작 과정 애니메이션 스킬 패키지입니다 (실제 디자인 소프트웨어 조작 녹화가 아님). 본 스킬은 100% 완전히 실행 가능한 두 가지 경로를 제공합니다:

경로 A (AI 비디오 모델 직접 출력): 고밀도 42커서용 중/영문 이중 언어 프롬프트와 게으름 방지 네거티브 프롬프트를 제공하여 Grok Video / Sora / Kling / Runway / Veo에 직접 투입합니다.
경로 B (100% 완전 실행 가능 Python 렌더링 엔진): 아래 Part 3에 프레임 단위로 렌더링하여 MP4로 합성하는 전체 소스 코드가 완전히 내장되어 있습니다 (외부 숨김 스크립트 불필요, 복사 저장 후 바로 실행 가능). 1:4, 9:16, 3:4, 1:1, 16:9 등 모든 종횡비의 이미지와 커서 수(N_CURSORS = 42) 및 핸들 잠금 지점을 정밀하게 제어, 확인, 검증할 수 있습니다.

필수 실행 규칙 (5가지 핵심 강제 철칙)

강제 동시 화면 42개 커서 작동 (N_CURSORS = 42): 매 프레임마다 35~42개의 커서가 동시에 표시되며, 흰색 화살표(ARROW), 십자선(CROSS +), I빔 타자 커서(IBEAM I)를 포함하고, 시작/종료 프레임에는 노란색 클릭 파동 링(#ffd750)이 표시됩니다.
강제 이중 핸들 우선순위 할당 (primary_points + secondary_points): 첫 번째 우선순위로 화면 좌우 각 활성 선택 상자의 오른쪽 아래 메인 핸들 □ 또는 타자 수직선 |에 먼저 1개의 커서를 할당하고(무주체 상자 제거), 두 번째 우선순위로 나머지 커서를 각 상자의 왼쪽 위, 오른쪽 위, 위쪽 중앙, 오른쪽 중앙 핸들에 할당하여 다중 커서 협력 상자 생성을 구현합니다.
강제 잔상 없는 직접 잠금(제로 공중 지연): 사인파 유목, 상자 간 느린 비행 표류를 엄격히 금지합니다. 커서는 현재 활성 핸들의 실시간 좌표 tx, ty를 직접 잠그며, 100% 프레임에서 각 커서의 끝이 흰색 핸들 사각형 □ 또는 타자 수직선 |에 맞물려 있어야 합니다.
강제 고동시성 중첩 타임라인 (파동당 14~16개 모듈 동시 작업): 전체 23.5초를 4개의 파동으로 나누고, 각 모듈의 시작 시간은 0.11초만 차이 나게 하여 화면에 항상 15개 이상의 선택 상자가 동시에 진화하도록 보장합니다(와이어프레임 생성 -> 회색 블록 배치 -> 청사진 선화 -> 풀컬러 정렬 및 스냅).
강제 순수 1080p 캔버스 (모니터 베젤 없음): 순수 1920x1080(30fps) 진한 숯검정 그리드 캔버스(#101218)에 픽셀 눈금자, 빨강/파랑 기준선을 포함하며, 실제 디스플레이 베젤이나 사람 손은 엄격히 금지합니다.

Part 1: 2단계 1:4 4페이지 세로형 롱 이미지 포스터 생성 템플릿

1단계(3:4 시각적 앵커): '[핵심 주제]'를 주제로 한 활기찬 손그림 파스텔 일러스트레이션 스타일의 광고 포스터. 화면 중앙에는 [주요 캐릭터 라인업 및 동작]이 있고, 주변에는 [핵심 소품]이 배치됩니다. 상단에는 굵은 손글씨 타이틀 '[메인 타이틀]', 아래에는 컬러 리본 부제목 '[서브 타이틀]'이 있습니다.
2단계(1:4 참조 이미지 장착 확장): 1단계 이미지를 참조 이미지로 전달하고, 첫 페이지(커버 영역), 두 번째 페이지(첫 번째 단계), 세 번째 페이지(두 번째 단계), 네 번째 페이지(세 번째 단계 및 하단 행동 슬로건) 및 가로 구분선을 명시적으로 분할하여 설명합니다.

Part 2: 경로 A — Grok Video / Sora / Kling / Runway 전용 프롬프트

한국어 프롬프트: 순수 1080p 데스크탑 UI 디자인 소프트웨어 전체 화면 애니메이션, 물리적 디스플레이 외곽선 없음. 진한 숯검정 그리드 캔버스(#101218)에 픽셀 눈금자와 빨간색/파란색 기준선이 있습니다. 화면에 동시에 35~42개의 흰색 화살표 커서, 십자선(+), I빔 타자 커서(I)가 좌우에서 고속으로 협력하며 작동하며, 각 커서는 파란색 와이어프레임의 흰색 제어 핸들(□) 또는 타자 수직선(|)에 완전히 고정되고 노란색 클릭 파동을 동반하며, 빈 공간을 헤매지 않습니다. 왼쪽 열은 제목과 규격 카드를 한 글자씩 입력합니다. 오른쪽 도화지는 파란색 와이어프레임(빨간색 타겟 중심과 픽셀 라벨 포함), 연한 회색 자리 표시 블록, 진한 파란색 잉크 선화(스케치 레이어), 풀컬러 확대/축소 스냅(빨간색 스마트 정렬선 동반), 배너 한 글자씩 입력 및 강조 잠금 순서로 구축됩니다.
English Prompt: Pure 1080p full-screen dark-mode Figma UI animation, NO monitor bezels, NO human hands. Dark pixel-grid canvas (#101218) with rulers and red/cyan guides. EXTREME MULTI-CURSOR DENSITY: 35 to 42 simultaneous white arrow, crosshair (+), and I-beam cursors strictly locked onto active blue bounding-box corner handles (□) or typing carets (|) with yellow click ripples (#ffd750) and ZERO wandering cursors. Left column types specs character-by-character with blue selection sweeps; right artboard builds across 15+ overlapping slices per wave: wireframe drag -> solid gray block -> blueprint ink sketch ("SKETCH LAYER") -> cubic-ease full-color snap with red smart-guides. Smooth 30fps.
Negative Prompt: single cursor, few cursors, idle floating cursors, wandering mouse, monitor bezel, human hands, blurry text, instant fade-in without wireframe.

Part 3: 경로 B — 100% 완전 실행 가능 Python 렌더링 엔진 (복사 후 실행)

다음 코드를 render_making_video.py로 저장하고 python3 render_making_video.py --poster your_image.png --output out.mp4를 실행하면 1080p MP4를 직접 출력할 수 있습니다 (스킬 패키지 scripts/render_making_video.py에도 동일하게 내장됨):

#!/usr/bin/env python3
"""
완전 독립형 42커서 우선순위 기반 Figma 와이어프레임-라이브 비디오 엔진
모든 이미지 종횡비(1:4, 9:16, 3:4, 1:1, 16:9)에서 바로 작동합니다.
사용법:
  python3 render_making_video.py --poster input.png --output out.mp4 [--title "MY POSTER"] [--handle "@creator"] [--bgm music.mp4] [--preview-dir ./previews]
"""
import argparse, os, subprocess
import cv2
import numpy as np
from PIL import Image, ImageDraw, ImageFilter, ImageFont

W, H, FPS = 1920, 1080, 30
DURATION, TOTAL_FRAMES, N_CURSORS = 23.5, int(23.5 * 30), 42


def load_font(size):
    for p in [
        "/usr/share/fonts/opentype/noto/NotoSansCJK-Bold.ttc",
        "/usr/share/fonts/truetype/noto/NotoSansCJK-Bold.ttc",
        "/System/Library/Fonts/PingFang.ttc",
        "C:/Windows/Fonts/msyhbd.ttc",
        "/usr/share/fonts/truetype/droid/DroidSansFallbackFull.ttf",
    ]:
        if os.path.exists(p):
            try:
                return ImageFont.truetype(p, size)
            except Exception:
                pass
    return ImageFont.load_default()


F_TINY, F_SM, F_MD = load_font(12), load_font(15), load_font(20)
F_LG, F_XL, F_XXL = load_font(28), load_font(42), load_font(52)


def ease_out_cubic(x):
    x = float(np.clip(x, 0.0, 1.0))
    return 1.0 - (1.0 - x) ** 3


def ease_in_out_cubic(x):
    x = float(np.clip(x, 0.0, 1.0))
    return 4 * x * x * x if x < 0.5 else 1 - ((-2 * x + 2) ** 3) / 2


def draw_selection_handles(draw, x1, y1, x2, y2, color=(55, 145, 255, 255), eight_handles=True):
    draw.rectangle([x1, y1, x2, y2], outline=color, width=2)
    s = 4
    pts = [(x1, y1), (x2, y1), (x1, y2), (x2, y2)]
    if eight_handles and (x2 - x1) > 40 and (y2 - y1) > 36:
        mx, my = (x1 + x2) // 2, (y1 + y2) // 2
        pts += [(mx, y1), (mx, y2), (x1, my), (x2, my)]
    for px, py in pts:
        draw.rectangle([px - s, py - s, px + s, py + s], fill=(255, 255, 255, 255), outline=color, width=2)


def draw_cursor_icon(draw, x, y, mode="ARROW"):
    ix, iy = int(x), int(y)
    if mode == "CROSS":
        r = 8
        draw.line([ix - r - 1, iy, ix + r + 1, iy], fill=(0, 0, 0, 235), width=4)
        draw.line([ix, iy - r - 1, ix, iy + r + 1], fill=(0, 0, 0, 235), width=4)
        draw.line([ix - r, iy, ix + r, iy], fill=(255, 255, 255, 255), width=2)
        draw.line([ix, iy - r, ix, iy + r], fill=(255, 255, 255, 255), width=2)
    elif mode == "IBEAM":
        h = 11
        draw.line([ix, iy - h, ix, iy + h], fill=(0, 0, 0, 235), width=4)
        draw.line([ix - 5, iy - h, ix + 5, iy - h], fill=(0, 0, 0, 235), width=4)
        draw.line([ix - 5, iy + h, ix + 5, iy + h], fill=(0, 0, 0, 235), width=4)
        draw.line([ix, iy - h, ix, iy + h], fill=(255, 255, 255, 255), width=2)
        draw.line([ix - 4, iy - h, ix + 4, iy - h], fill=(255, 255, 255, 255), width=2)
        draw.line([ix - 4, iy + h, ix + 4, iy + h], fill=(255, 255, 255, 255), width=2)
    else:
        poly = [(ix, iy), (ix, iy + 21), (ix + 5, iy + 16), (ix + 9, iy + 24),
                (ix + 13, iy + 22), (ix + 8, iy + 14), (ix + 15, iy + 14)]
        draw.polygon(poly, fill=(255, 255, 255, 255), outline=(10, 12, 16, 255))
        draw.line(poly + [poly[0]], fill=(10, 12, 16, 255), width=2)


def build_auto_slices(poster_x, poster_y, poster_w, poster_h):
    """모든 종횡비에 대해 4개의 파동으로 60개의 중첩 시각적 모듈을 생성합니다."""
    modules = []
    max_scroll = max(0, poster_h + 95 - H)
    zone_ranges = [
        (0.22, 0, min(poster_h, H - 80)),
        (5.40, int(max_scroll * 0.33), min(poster_h, int(max_scroll * 0.33) + H - 80)),
        (11.00, int(max_scroll * 0.67), min(poster_h, int(max_scroll * 0.67) + H - 80)),
        (16.40, max_scroll, poster_h),
    ]
    for w_idx, (t_base, zy1, zy2) in enumerate(zone_ranges):
        if zy2 - zy1 < 120:
            zy1, zy2 = 0, poster_h
        modules.append(((poster_x, poster_y + zy1, poster_x + poster_w, poster_y + zy2),
                        t_base, t_base + 0.25, t_base + 0.55, t_base + 0.85, t_base + 1.05, "ARTBOARD"))
        cols, rows = 4, 3
        cw, ch = poster_w // cols, (zy2 - zy1) // rows
        idx = 0
        for r in range(rows):
            for c in range(cols):
                pad_x, pad_y = int(cw * 0.14), int(ch * 0.14)
                x1 = poster_x + max(0, c * cw - (pad_x if c > 0 else 0))
                y1 = poster_y + zy1 + max(0, r * ch - (pad_y if r > 0 else 0))
                x2 = poster_x + min(poster_w, (c + 1) * cw + (pad_x if c < cols - 1 else 0))
                y2 = poster_y + zy1 + min(zy2 - zy1, (r + 1) * ch + (pad_y if r < rows - 1 else 0))
                tw = t_base + 0.08 + idx * 0.11
                dur = 1.50
                mtype = "HERO_GRAY" if (r + c) % 3 == 0 else ("COIN_SNAP" if (r + c) % 3 == 1 else "NORMAL")
                modules.append(((x1, y1, x2, y2), tw, tw + dur * 0.27, tw + dur * 0.54, tw + dur * 0.80, tw + dur, mtype))
                idx += 1
        # 파동당 2개의 히어로 중첩 중앙 포커스 상자 추가
        for k, (fx1, fy1, fx2, fy2) in enumerate([(0.15, 0.12, 0.58, 0.72), (0.42, 0.24, 0.88, 0.86)]):
            bx1 = poster_x + int(poster_w * fx1)
            by1 = poster_y + zy1 + int((zy2 - zy1) * fy1)
            bx2 = poster_x + int(poster_w * fx2)
            by2 = poster_y + zy1 + int((zy2 - zy1) * fy2)
            tw = t_base + 0.35 + k * 0.45
            modules.append(((bx1, by1, bx2, by2), tw, tw + 0.40, tw + 0.80, tw + 1.20, tw + 1.50, "HERO_GRAY"))
        t_seal = t_base + 3.15
        modules.append(((poster_x, poster_y + zy1, poster_x + poster_w, poster_y + zy2),
                        t_seal, t_seal + 0.01, t_seal + 0.02, t_seal + 0.03, t_seal + 0.05, "SEAMLESS"))
    return modules


def run_engine(poster_path, output_path, title="DESIGN STUDIO 4K", handle="@Creator", bgm_path=None, preview_dir=None):
    orig_im = Image.open(poster_path).convert("RGB")
    W0, H0 = orig_im.size
    POSTER_X, POSTER_Y, POSTER_W = 880, 52, 980
    POSTER_H = int(round(POSTER_W * (H0 / float(W0))))
    if POSTER_H < 980:
        POSTER_Y = max(52, (H - POSTER_H) // 2)

    poster_full = orig_im.resize((POSTER_W, POSTER_H), Image.Resampling.LANCZOS)
    np_full = np.array(poster_full)
    gray_p = cv2.GaussianBlur(cv2.cvtColor(np_full, cv2.COLOR_RGB2GRAY), (3, 3), 0)
    edges_a = cv2.adaptiveThreshold(gray_p, 255, cv2.ADAPTIVE_THRESH_GAUSSIAN_C, cv2.THRESH_BINARY, 13, 4)
    edges_c = cv2.Canny(gray_p, 35, 110)
    is_ink = (edges_a < 128) | (edges_c > 0)
    sketch_rgb = np.stack([np.where(is_ink, 28, 244), np.where(is_ink, 43, 240), np.where(is_ink, 69, 230)], axis=-1).astype(np.uint8)
    poster_sketch = Image.fromarray(sketch_rgb)

    artboard_underlay = Image.blend(
        poster_full.filter(ImageFilter.GaussianBlur(radius=16)),
        Image.new("RGB", (POSTER_W, POSTER_H), (20, 24, 32)),
        0.42,
    )

    poster_modules = build_auto_slices(POSTER_X, POSTER_Y, POSTER_W, POSTER_H)
    max_scroll = float(max(0, POSTER_H + 95 - H))

    def get_scroll_y(t):
        if max_scroll <= 0:
            return 0.0
        s1, s2, s3 = max_scroll * 0.33, max_scroll * 0.67, max_scroll
        if t < 4.8:
            return 0.0
        elif t < 5.6:
            return s1 * ease_in_out_cubic((t - 4.8) / 0.8)
        elif t < 10.4:
            return s1
        elif t < 11.2:
            return s1 + (s2 - s1) * ease_in_out_cubic((t - 10.4) / 0.8)
        elif t < 15.8:
            return s2
        elif t < 16.6:
            return s2 + (s3 - s2) * ease_in_out_cubic((t - 15.8) / 0.8)
        return s3

    left_ui_cards = []
    left_typing_modules = []
    wave_meta = [
        (0.00, 5.25, "01 / 와이어프레임 아키텍처", title, handle, "42커서 병렬 슬라이스 초기화"),
        (5.30, 10.85, "02 / 겐가 스케치 & 메시", "와이어프레임에서", "라이브 아트로", "청사진 잉크 추출 및 그레이스케일 블로킹"),
        (10.90, 16.25, "03 / 컬러 및 스마트 가이드", "큐빅 이지 스냅", "및 정렬", "고해상도 풀컬러 합성"),
        (16.30, 23.60, "04 / 마스터 아트보드 잠금", "42 커서 동기화", "100% 확인", f"출력: {W0}x{H0} | 30.0 FPS 퓨어 캔버스"),
    ]
    for t0, t_exp, k0, k1, k2, k3 in wave_meta:
        left_typing_modules.extend([
            ((42, 58, 560, 88), k0, F_SM, (110, 180, 255), (110, 180, 255), None, t0 + 0.25, t0 + 1.15, t0 + 1.60, t_exp),
            ((42, 98, 750, 156), k1, F_XXL, (255, 255, 255), (255, 255, 255), None, t0 + 0.40, t0 + 1.45, t0 + 1.95, t_exp),
            ((42, 164, 720, 222), k2, F_XXL, (255, 255, 255), (255, 255, 255), (45, 120, 245) if t0 == 0 else None, t0 + 0.60, t0 + 1.70, t0 + 2.20, t_exp),
            ((42, 232, 760, 270), k3, F_MD, (255, 215, 90), (200, 215, 235), None, t0 + 0.80, t0 + 1.95, t0 + 2.40, t_exp),
        ])
        left_ui_cards.extend([
            (42, 295, 275, 490, "THUMB_COLOR", t0 + 0.45, t0 + 1.55, t0 + 2.50, t_exp),
            (295, 295, 530, 490, "THUMB_SKETCH", t0 + 0.60, t0 + 1.70, t0 + 2.65, t_exp),
            (550, 295, 785, 490, "SPEC_CARD", t0 + 0.75, t0 + 1.85, t0 + 2.80, t_exp),
            (42, 520, 785, 750, "PIPELINE_CARD", t0 + 0.90, t0 + 2.15, t0 + 3.25, t_exp),
            (42, 780, 740, 945, "PROGRESS_BAR", t0 + 1.05, t0 + 2.35, t0 + 3.50, t_exp),
        ])

롱포스터 제작 영상