プロトタイプ作成機能
デザインしながらプロトタイプを作成したり、あるいはその逆も可能です。

アニメーションのプロトタイプで、あなたのアイデア実現。より早く、より頻繁にコンセプトをテストすることができます。開発のためのより良いブループリントを作れます。

実体験に近いプロトタイプの作成

静的なデザインファイルを、コーディング不要でインタラクティブな体験に変換できます。

  • 直感的なビルド: UIエレメントを繋ぎ、インタラクションやアニメーションを選択するだけです。
  • インタラクション: クリック時、ホバー時、ボタン押下時などの微妙なインタラクションを定義することができます。
  • モバイルビューイング: iOSとAndroidで利用可能なFigmaモバイルアプリを使って、あなたのデザインを実際に体験してください。

インタラクションのビジョンを語らずに見せる

思い描くインタラクションを具体的に表現することで、開発から当て推量を取り除くことができます。

  • Smart Animateによる高度なトランジション: 類似したオブジェクトを自動的にアニメーション化し、きめ細かいトランジションを創り出します。
  • ダイナミックなオーバーレイ: インタラクティブなコンテンツを何層にも重ねたオーバーレイを作成できます。
  • アニメーションGIF: モーションデザイン、ビデオ要素、繊細なアニメーションを表現するためにGIFを使用します。
私たちは、本当に速くデザインプロセスを実行しています。常に構築、テスト、反復作業を行っています。Figmaでプロトタイプを非常に迅速かつ簡単に作成できることは、私たちにとって大きな意味を持ちます。
Bulb社のシニアユーザーリサーチャー、Beth Horne氏

1つのツールだけですべてを実現する

もう、ツール間を行き来する必要はありません。デザイン、プロトタイプ、共有、フィードバックの収集のすべてをFigmaで行うことができます。

  • オールインワンプラットフォーム: デザインファイルとライブプロトタイプを切り替えて使用できます。デザイン編集はプロトタイプに即座に反映されます。
  • 共有できるプロトタイプ: プロトタイプのリンクを共有しましょう。インターネットがあれば、どこからでも見ることができます。
  • コメントの埋め込み: プロトタイプにコメントします。デザインファイルに引き継がれるため、失われるものはありません。

Figmaプロトタイプの他の使い方

  • リサーチセッションで被験体を観察する
  • NotionやDropboxにあるライブプロトタイプとやり取りする
  • 作品を売り込むためのプレゼンテーションスライドを作成する
  • サードパーティのプロトタイピングツールと統合する

Figma がデザインの最初から最後までをどのように支援するかをご覧ください