# Button Press: ボタンクリックアニメーション

カーソルでボタンを押すと、スピナーとチェックマークが開始されます。 動画テンプレート。Claude用コードをコピーするか、Subclipで編集できます。

Canonical URL: https://www.subclip.app/ja/motion-graphics-templates/remotion/button-press

Preview video: https://subclipweb.subclip.app/motion-graphics-templates/v1/previews/motion-template-remotion-snapcn-button-press.mp4?v=01f7476931

カーソルは青い分割アクション ボタンをクリックし、ホバーすると暗くなり、押し込み、保留状態を経て、描画されたチェックマークで終了します。

- フレームワーク: Remotion
- カテゴリ: クリック
- 再生時間: 4秒
- アスペクト比: 16:9 横向き
- コード: コードを取得（無料ログイン）：https://www.subclip.app/ja/motion-graphics-templates/remotion/button-press

シーンは、中央に 1 つの青い分割ボタン (ラベル、薄い仕切り、小さな山形) を備えたライト フレームで開きます。カーソルがその上に移動し、ホバーするとボタンが暗くなり、押すとわずかに暗くなります。ラベルは、描かれたチェックマークと完了ラベルに到達する前に、小さなスピナーで「展開中...」などの保留状態に切り替わります。実行時間は 4 秒強です。

アイドル状態、保留中、完了状態の 3 つのラベル (デプロイ、公開、送信など) を記述し、長い単語が収まるようにボタンの幅を設定できます。ライトモードとダークモードを切り替え、ペースに合わせて再生速度を変更します。明確な行動喚起が必要な、ローンチビデオ、チュートリアルステップ、または製品デモのデプロイ、公開、送信の瞬間をカバーします。

## 活用例

- モーメントの展開と公開
- デモのビートを送信または送信する
- チュートリアルでの行動喚起

## 変更できる項目

- `speed`: 再生速度 (数値)
- `label`: ボタンラベル (テキスト)
- `pending`: 保留中のラベル (テキスト)
- `done`: 完了ラベル (テキスト)
- `width`: ボタンの幅 (数値)
- `mode`: ライトモードまたはダークモード (テキスト)
- `stageBackground`: 現場の背景 (テキスト)

## このテンプレートの使用方法

1. Mac または Windows 用の Subclip をダウンロードします。このページのすべてのテンプレートはプリインストールされています。
2. [テンプレート]パネルを開き、[Button Press]を選択してタイムラインにドロップします。
3. レイヤー設定のテキスト、色、タイミングを変更するか、AI エージェントに編集を依頼します。
4. ビデオをエクスポートするか、コードをダウンロードして独自のプロジェクトでテンプレートを使用します。

snapcnのButton Pressをベースに作成: https://snapcn.dev