UIアニメーション
Framer 3.0｜ブランドと製品の発表
冒頭の光からブランチと公開の操作を導き、中盤で具体的な編集結果を見せ、後半はUIの表現をガラスの記号へ抽象化する。青は選択状態を示すと同時に、映像全体の素材感をつなぐ。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
紫の枠の中の5つのコンポーネント
紫の輪郭とコンポーネント名を固定し、5つの短いデモを同じツール群として見せる。切り替え時は内部の対象だけを変え、表示ステージは動かさない。
参考動画のみです。編集可能なプロジェクトは含まれていません。
文字アニメーション
ガラスのプリズム上のFramer
タイトルを画面の中心軸に固定し、単語ごとに表示する。細長いガラスの帯を左から右へ伸ばし、最も明るい光点が少し遅れてタイトルを横切る。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
FramerがCursorと連携
キーボードの近景から暗い入力欄へ移り、入力完了後にCMSの表へ切り替える。行の一覧に沿って青い枠を出し、一つの依頼が複数のデータに作用することを示す。
参考動画のみです。編集可能なプロジェクトは含まれていません。
3Dアニメーション
MCPでFramerへ移行
手前のウィンドウを右上、奥のウィンドウを左下に固定する。両者の透視方向を揃え、奥のウィンドウを畳むときは一度点へ縮め、斜めの軸に沿って再展開する。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Framer Skills
冒頭で入力欄にフォントと引用符のルールを続けて入力し、その後に完成ページを見せて、ルールがページ全体へ作用することを伝える。
参考動画のみです。編集可能なプロジェクトは含まれていません。
UIアニメーション
Framer Agent Templates
3枚のテンプレートを横に並べ、中央は全体を見せ、両側は一部だけ見せて暗くする。切り替える際は列全体を横へ滑らせ、定位置に着いてから中央の明るさを戻す。
参考動画のみです。編集可能なプロジェクトは含まれていません。