# Toast: トースト通知UI

「Changes saved」と詳細「Your profile has been updated.」を表示する成功トーストです。 動画テンプレート。Claude用コードをコピーするか、Subclipで編集できます。

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

Preview video: https://subclipweb.subclip.app/motion-graphics-templates/v1/previews/motion-template-remotion-remocn-toast.mp4?v=69eb04857a

アイコン、タイトル、詳細の1行を備えた小さな通知カードで、標準または成功のスタイルがあり、アプリのデモ動画に使えます。

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

明るいトーストカードに、成功のアイコン、タイトル「Changes saved」、1行の説明「Your profile has been updated.」が表示されます。テンプレートは表示状態のトーストを4秒間保ちます。コードでは、トーストが下からスライドインし、しばらく表示されてから自動で閉じます。

タイトル、説明、バリエーション（アイコンとその色を決めます）、状態（表示または非表示）に加えて、再生速度と背景も変更できます。製品デモでの操作完了の確認、チュートリアルでの通知の表示、保存や送信の瞬間の演出、UIの操作説明へのフィードバックの追加に使えます。

## 活用例

- デモでの操作完了の確認
- チュートリアルでの通知
- 保存と送信の瞬間
- UIの操作説明

## 変更できる項目

- `speed`: 再生速度 (数値)
- `stageBackground`: 現場の背景 (色)

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

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

remocnのToastをベースに作成: https://remocn.dev