UIアニメーション
ノーコードの新時代
球体を視覚的な案内役にし、層状のページ、フォーム、フローの空間を進む。UIは単なるスクリーンショットではなく、前後の距離を持つ組み合わせ可能な平面として扱う。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
ノーコードの時代へようこそ
暗い場所から明るい場所への移動を通じて、密なUIとコードの領域を、開放的で探索できる創作の世界へ変える。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Comet｜星雲のウィンドウ
ナビゲーションを上部に固定し、中央のマスクだけを広げる；内部の映像とコンテナのサイズは別々に扱う。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
ガラスのプリズム上のFramer
タイトルを画面の中心軸に固定し、単語ごとに表示する。細長いガラスの帯を左から右へ伸ばし、最も明るい光点が少し遅れてタイトルを横切る。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
新ビジュアル｜ワードマークの公開
拡大した虹色の表面からCを取り出し、空間の形を一文字へ縮め、同じ基準線に沿ってブランド名全体を展開する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Google Drive を Figma agent に接続
外部のフィードバックを読み取ってデザインを修正し、変更理由を記録した文書を出力する；読み書きの循環を作る。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Figma Agent Vectors
新しく生成した素材も選択、色の編集、アニメーションの構成ができる；三段階で編集可能であることを示す。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Linear — 差分内のマージキューの状態
短い動画では一部の hover だけを見せる：主となる状態を維持し、ホバー時に待機済み時間を補足し、ポインターが離れたら非表示にする。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Lovable｜Google コネクター
複数のツールアイコンを先に集約し、その後一つずつプロンプト欄のコネクターラベルに変える
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Notion 外部エージェント（Claude + Cursor 連携）…
同じタスクカードを維持し、状態を Triage→Plan→Build→PR→Ship の順に変える。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
iPhone Duo に対応
展開後は本文の表示面積を広げ、サイドバーと本文には親子のクリッピング関係を持たせる。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Notion as code — TypeScript で作るワークスペース
先に要望を入力してから実行とコードを示し、デプロイを確認した後に実際の作業領域の成果へ切り替える。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
ChatGPT｜Apple Messages
タスクを見つけたらまず提案を表示し、ユーザーが修正して確認した後、送信先のチャットに届いたメッセージを表示する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Cloud Computer：クラウドコンピューターのデプロイと利用
まず永続的な実行環境を説明し、ボット、データ取得、デプロイの3例で裏付ける
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
Claude Haiku 5.5 発表
3列の位置は固定し、内部の質感とL字の向きを段階的に切り替える；素材の切り替えをブロック全体の平行移動に置き換えない。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
Fable 5｜ピクセルキャラクターの帰還
キャラクターが電飾看板に到着してから製品名を1文字ずつ出し、動作と文字の出現に因果関係を持たせる。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
機能更新｜Voice mode
中央の同じ円をボタンから映像ウィンドウへ拡張し、再びボタンへ戻す；空間上の同一性を保つ。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Android Drop — Find Hub、Motion Assist、Gemini
各機能をメインカードとそれに付随する小さなフィードバックで構成する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
グラフィックアニメーション
同一プロジェクトの5秒プレビュー · 5.0秒
点群を人物、場所、物の順に組み直し、カテゴリに合わせて色を変える。
参考動画のみです。編集可能なプロジェクトは含まれていません。
グラフィックアニメーション
Grok Bot × Linear
二つのブランドを揃えて固定し、背景を流し続けながら文字の邪魔をしないようにする。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Grok BotでXの検索、閲覧、モニタリングが可能に。
まず検索対象の複数の情報源を見せ、次にテーマごとの要約へまとめる。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Grok Bot · 会話内でのフォーム入力とログイン
エージェントは認証が必要になった時点でユーザーへ引き継ぎ、入力を受け取った後に処理を再開する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
Grok — 21種類の新しい音声
タイトルの位置とサイズを固定し、主な動きは背景の連続した流れで作る。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Reception · 多業種の電話応対
前半は複数の業界への着信で共通の課題を示し、中盤では一つの光球を解決策として使う
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
ElevenLabs｜Scribe v2
まず評価する観点を紹介し、具体的なテキストの変化で機能を説明する
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Composer · セクションごとの楽曲編集
自由な依頼から、調整できるセクション、テンポ、調性へ進み、最後に波形と作品を示す
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Polymarket · 5分間の方向予測
まず判断する問いを示し、複雑なターミナルから二択の操作へ焦点を絞る
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Cursor Multitask / Subagents — 新しい…での/multitask
同じ会話に複数タスクを追加し、作業パネルに並列実行数を常時表示する
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
design modeにAnnotateを追加
注釈を対象要素に付け、番号とコメントを一対一に対応させる
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Cursor — iPadに対応
同じ成果物を複数端末で見せた後、タブレットでの整理とレビュー機能へ焦点を当てる
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Cursor — ウェブアプリを作ってVercelへデプロイ
まず選択できるリポジトリを表示し、次にゼロからの作成を強調する；入力後にプレビューを表示する
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Computerがインタラクティブなグラフを生成
結果に操作可能なグラフを含め、ポインターを入れるとデータのツールチップを表示する；グラフ全体の拡大縮小だけにしない。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Perplexity — NVIDIA DGX Spark上のPortable Computer
ローカルツールを端末の周囲に輪状に配置し、クラウドモデルを別の層に置く；接続線は必要に応じたクラウド利用を表し、データの既定の外部送信を意味しない。
参考動画のみです。編集可能なプロジェクトは含まれていません。
3Dアニメーション
MCPでFramerへ移行
手前のウィンドウを右上、奥のウィンドウを左下に固定する。両者の透視方向を揃え、奥のウィンドウを畳むときは一度点へ縮め、斜めの軸に沿って再展開する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Framer Skills
冒頭で入力欄にフォントと引用符のルールを続けて入力し、その後に完成ページを見せて、ルールがページ全体へ作用することを伝える。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Framer Agent Templates
3枚のテンプレートを横に並べ、中央は全体を見せ、両側は一部だけ見せて暗くする。切り替える際は列全体を横へ滑らせ、定位置に着いてから中央の明るさを戻す。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
エージェント向けLinkウォレット
まずagentをインストールして接続し、チャットで旅程変更を依頼して料金を表示した後、スマートフォンで確認する。料金と事業者名を画面をまたいで繰り返し、同じ依頼だと分かるようにする。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
Directoryの無料採用データ
中央の見出しの周囲にアバターを順に出す。サイズをほぼ揃えて短い属性ラベルを付ける。見出しは2行に保ち、ブランドの行をオレンジにする。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Grokでスケッチをカートゥーンに
最初の依頼でスケッチをキャラクター設定画にし、次の依頼でその結果をアニメーションにする。チャットを上へスクロールし、新しい結果を下から入れて、前のメッセージとのつながりを保つ。
参考動画のみです。編集可能なプロジェクトは含まれていません。
3Dアニメーション
無料の音声入力
ロゴと文字のキーキャップを落として1列に並べ、両側へ散らして光る黒い音声波形のカプセルを見せる。カプセルは以降のデモで共通の基準位置にする。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
iPhone Duo に対応
縦向きのスマートフォンを中央に出し、回転させて横向きの2列へ展開する。一方に一覧を残し、もう一方に詳細を入れる。両方の画面比率で同じメモの内容を保つ。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Runway Agentの新機能
最終的な製品ページを先に見せてから依頼へ戻り、配色と製品を抽出して場面や各サイズを生成し、最後にモーション機能を示す。同じスピーカーを複数の成果物に繰り返し登場させる。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
状態を示す言葉とHyperFrames
状態を示す単語を暗めの等幅文字で素早く切り替え、暗い二つの三角へ変える。ロゴを下から上へ緑で満たし、白いブランドのワードマークを展開する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
機能更新｜450以上の連携
オレンジのカプセルでconnect、withなどの単語をつなぎ、クリックできるプラス記号へつなげる。クリック後に複数の弧に沿ってアイコンを流入させ、数字を450まで増やす。
参考動画のみです。編集可能なプロジェクトは含まれていません。
実写映像編集
ガラス。
ガラスは固定し、手と容器を背後から通す。細かな格子で輪郭をずれた小片に分ける。全景で枠を示し、近景で模様と歪みの関係を明確に見せる。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
TIDAL｜タイポグラフィのメインビジュアル 60秒版
コピーを主役にし、意味上の強調に合わせて短い単語を拡大し、押し込み、つなげる。菱形で文字の段落を次の配色へ押し進める。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
UIボタンの配列 · 10.7秒
切り欠きのある3つのエフェクトボタンを組み合わせ可能なモジュールのように分解して戻す。下の項目から順に動かし、縦の密な関係を維持する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Creative Cloud｜マゼンタのスライスバリエーション
短い高速カットでロゴを立体のスライスから平面の編集画面、銀白の材質へ変え、マゼンタを各版をつなぐ視覚的な手掛かりにする。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
EliseAI｜公式サイトの製品UI
一つの完全な予約会話でアシスタントの価値を示す。ユーザーが希望時間を伝え、アシスタントが二つの選択肢を出し、ユーザーが一方を確認する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
グラフィックアニメーション
Revolutアプリで初のユーロ連動ステーブルコインEURRを提供開始。
2枚のコインを同じトレーに沿って前後に入れ替え、文字を固定して動きを二つの主体に集中させる。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Wabi 2.0登場：アプリを作り、用事を済ませる新しいメッセンジャー…
チャット内の情報を使えるミニアプリへ育て、それらで個人のホーム画面を構成する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
AIでプレゼンテーションを作成
テーマを編集可能なアウトラインへ変え、そこから一式の完成スライドを作り、2回の生成それぞれに明確な結果を持たせる。
参考動画のみです。編集可能なプロジェクトは含まれていません。