Motion Skills
← Skills
Premiumローンチ

デバイスキャンバス・ローンチ

光るキャンバスに浮かぶデスクトップとスマートフォンを、カメラが巡ります。

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/device-canvas-launch/install.md を読んで手順どおりに「device-canvas-launch」スキルをインストールし、それを使って最初の動画を作ってください。

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

プロンプト例
Use the device-canvas-launch skill for Tally with assets/web.png and assets/app.png: hook "Expenses, handled anywhere.", three features, CTA "Start free".
スタイルプロンプト(Claude Motion または Opus 5.5)
Make a 20-second 16:9 launch video for [who will watch, e.g. ops and finance leads], playing [where, e.g. the homepage hero]. Use only the lines and screenshots I give; don't change a word. Deep navy background with soft violet and teal glows.

Scene 1: the hook rises word by word and fades. Scene 2: a browser window with the desktop screenshot and a phone with the mobile screenshot rise onto the canvas. Scene 3: the camera glides in to the browser while a glass caption shows the first feature, then to the phone with the second, then pulls back to show both with the third. End frame: the devices blur and sink as the product name, the hook and a violet call-to-action button appear.

Hook: [e.g. "Your metrics, everywhere you work."]
Three captions: [e.g. "Live dashboards — Every number, updated in real time", "Pocket alerts", "Always in sync"]
Product and call to action: [e.g. Pulse, "Get Pulse free"]
Attach: [a desktop screenshot and a phone screenshot]

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

この Skill で作った作品