Motion Skills
← Skills
Premiumローンチ

スクエア・モーフ・ローンチ

1 つのアクセントの四角が、点、カード、スマートフォン、ロゴへと変形します。

Claude Code、Codex、Cursor など Skill に対応したエージェントに貼り付けてください。

必要なもの: Node.js 22+、FFmpeg、Chrome。API キー不要。

ほかのテーマと画面比率

スクエア・モーフ・ローンチ · エレクトリック · 9:16
テーマ: エレクトリック · 9:16
スクエア・モーフ・ローンチ · インク · 1:1
テーマ: インク · 1:1

同じテンプレートをテーマと画面比率を変えてレンダリングした最終フレームです。

5つのテーマ

  • インク
    ink
  • ペーパー · デフォルト
    paper
  • エレクトリック
    electric
  • ノワール
    noir
  • サンド
    sand

プロンプトでテーマ名を指定するだけで切り替わります。アクセント色・背景色・文字色を自分で指定することもできます。

インストール用プロンプト
https://claude-motion.com/skills/square-morph-launch/install.md を読んで手順どおりに「square-morph-launch」スキルをインストールし、それを使って最初の動画を作ってください。

Claude Code、Codex、Cursor など Skill に対応したエージェントに貼り付けてください。

プロンプト例
Use the square-morph-launch skill for Grid, a layout tool: hook "Layouts that fix themselves.", three features, CTA "Try Grid". Electric theme, 1:1.
スタイルプロンプト(Claude Motion または Opus 5.5)
Make an 18-second 16:9 minimal launch for [who will watch, e.g. design system teams], playing [where, e.g. the homepage hero]. Use only the name, lines and features below; don't change a word. Off-white background, one orange shape.

Scene 1: a small orange square pops in at the center, rotates as it grows, then stretches into a thin underline as the headline rises above it. Scene 2: the shape morphs into a large orange circle with "1" beside the first feature, then into a wide card with "2", then into a tall phone shape with "3". End frame: it shrinks into a small rotated square logo mark beside the name, with a black call-to-action button and the URL below.

Headline: [e.g. "Design systems, without the meetings."]
Three features: [e.g. "Tokens — One source for every color", "Components", "Handoff"]
Product, call to action and URL: [e.g. Shape, "Start shaping", shape.design]

インストール不要:Claude Motion(Team または Enterprise)に貼り付けるか、Opus 5.5 に渡すと近い雰囲気になります。結果は実行ごとに変わります。Skill なら毎回同じ結果です。

この Skill で作った作品