YouTube 썸네일은 모바일 피드 크기에서도 선명해야 하며 동시에 클릭을 유도해야 합니다. 이 스킬은 레이아웃, 색상, 텍스트, 얼굴, A/B 테스트에 대한 실용적인 규칙을 제공합니다.

팀은 각 플랫폼에 맞지 않는 잘못된 크기, 길이, 자막 또는 세이프 존으로 동영상 광고를 만드는 경우가 많습니다. 이 스킬은 Claude, Codex, Claude Code가 동영상 광고를 기획하고 CLI에서 바로 사용할 수 있는 크리에이티브 프롬프트를 생성할 수 있도록 플랫폼별 가이드를 제공합니다.

비디오 팀은 제작이 시작되기 전에 명확한 샷 계획이 필요합니다. 이 스킬은 장면 아이디어를 구조화된 스토리보드 패널, 샷 리스트, 시각 생성 프롬프트로 전환합니다.

제품 팀은 전체 스튜디오 촬영 없이도 리스팅, 광고, 카탈로그에 사용할 완성도 높은 이미지가 필요합니다. 이 스킬은 팩샷, 라이프스타일 장면, 조명, 각도, 전체 이미지 세트를 위한 프롬프트 패턴을 제공합니다.

대규모 웹사이트 구축은 페이지와 반복 작업 사이에서 맥락을 잃는 경우가 많습니다. 이 스킬은 Claude, Codex, Claude Code가 Stitch 기반 사이트 작업을 생성, 통합, 계속 진행할 수 있도록 바통 워크플로를 제공합니다.

디자인 프롬프트에는 일관된 프로덕션 품질의 UI 출력을 만드는 데 필요한 세부 정보가 부족한 경우가 많습니다. 이 스킬은 대략적인 요청을 구조화된 Stitch MCP 워크플로, 재사용 가능한 디자인 시스템 노트, 저장된 디자인 에셋으로 전환합니다.

팀은 앱 화면을 보여주는 워크스루 비디오를 빠르게 만들어야 하지만, 수동 편집은 느립니다. 이 스킬은 Stitch 화면을 전환 효과와 오버레이가 포함된 Remotion 컴포지션으로 변환합니다.

모호한 UI 프롬프트는 종종 일관성 없는 Stitch 화면을 만들어냅니다. 이 스킬은 대략적인 아이디어를 디자인 시스템 컨텍스트, UI 어휘, 명확한 페이지 섹션을 갖춘 구조화된 프롬프트로 바꿉니다.

복잡한 프로세스와 시스템은 텍스트만으로 설명하기 어렵습니다. 이 스킬은 명확한 설명을 편집 가능한 Excalidraw 다이어그램과 보조 요약으로 변환합니다.

컴포넌트, 토큰, 레이아웃을 임기응변식으로 만들면 Paperclip UI 작업은 일관성이 흐트러질 수 있습니다. 이 스킬은 Claude, Codex, Claude Code가 일관된 프론트엔드 구현을 위해 공유할 수 있는 디자인 가이드를 제공합니다.

Consistent characters, products, and scenes are difficult to maintain across generated video. This skill builds structured Wan 3.0 Prime requests from numbered references.

Keeping characters, products, and visual style consistent across generated video is difficult. This skill builds and runs reference-guided Seedance 2.5 requests through RunComfy.

Static images cannot show motion, camera movement, or synchronized sound. This skill creates directed 720p clips from one image through Seedance 2.5.

Turning requirements into consistent, interactive prototypes can take significant design and engineering time. This skill converts page requirements into validated GemDesign prototypes with local preview and platform synchronization.

라이브 커머스 팀은 캠페인을 위한 빠르고 일관된 시각 패키지가 필요합니다. 이 스킬은 Claude, Codex, 또는 Claude Code가 브랜드 제품 오버레이를 위한 프롬프트, 합성, 전달용 에셋을 구성하도록 안내합니다.

디자인 핸드오프 과정에서는 간격, 애셋, 컴포넌트 의도가 자주 손실됩니다. 이 스킬은 정확한 UI 구현을 위해 Claude, Codex, Claude Code에 반복 가능한 Figma MCP 워크플로를 제공합니다.

팀은 엔지니어링 작업이 시작되기 전에 플로우를 빠르게 검증해야 합니다. 이 스킬은 UX 명세를 화면, 상태, 기본 상호작용을 갖춘 인터랙티브 HTML 프로토타입으로 변환합니다.

팀은 공유 UI 프리미티브를 변경하지 않고도 일관된 컴포넌트 스타일링이 필요합니다. 이 스킬은 Claude, Codex, Claude Code가 Tailwind 규칙과 명확한 파일 경계를 사용해 컴포넌트 CSS를 만들도록 안내합니다.

인터페이스 모션은 정상적으로 작동하더라도 느리거나 산만하거나 접근하기 어려울 수 있습니다. 이 스킬은 구체적인 완성도, 성능 및 접근성 기준에 따라 애니메이션 코드를 검토합니다.

Choosing a UI direction from one implementation limits useful comparison. This skill builds distinct, working variants in a live picker before integration.