ProtoPieで広範囲におよぶデジタル製品のプロトタイプを作成することができます。ProtoPieはmacOSとWindowsの両方で利用できます。

ProtoPieは基本的なことだけでなく、高度に条件付けられたインタラクションでの腕試しもできます。ProtoPieでは、次のようなことができます。

• 複数デバイスにまたがるインタラクションの作成
• ハードウェア統合の構築
• ジャイロスコープ、コンパス、マイク、近接センサーなどのデバイス特有のセンサーの使用

統合するとFigmaデザインを正確にProtoPieにインポートでき、デザインを実物のようなプロトタイプにすることができます。

FigmaとProtoPieの接続

デザインをFigmaからProtoPieにインポートすることができます。

最初に、Figmaにあるファイルへのアクセス許可をProtoPieに与える必要があります。

2つのアプリを接続する必要があるのは一度だけです。一度ProtoPieに許可を与えると、再度行う必要はありません。

1. ProtoPieを開いて、左上隅にあるインポートアイコンをクリックします。
2. オプションで[Figma]を選択します。
3. ProtoPieからFigmaファイルへのアクセス許可を求められます。[ブラウザへ進む]をクリックして、新しいブラウザウィンドウでFigmaを開きます。
4. ログインしていない場合は、Figmaアカウントにログインする必要があります。
5. ログイン後[アクセスを許可]ボタンをクリックして、ProtoPieにファイルへのアクセス権限を与えます。
6. 許可を付えたら、ブラウザのウィンドウを閉じるか、[ProtoPieに移動]ボタンをクリックしてProtoPieアプリを開きます。

Figmaからのデザインのインポート

FigmaデザインをProtoPieにインポートできるようになりました。ProtoPieのインポートオプションの詳細についてはインポートドキュメンテーション(外部リンク)をご覧ください。

過去12時間以内に開くか編集したすべてのファイルのフレームをインポートできます。

新しいデザインのインポート

1. ProtoPieを開く
2. 左上隅にある[インポート]ボタンをクリックします。
3. [フレーム]ドロップダウンで、インポートするフレームを選択します。
   
4. 必要に応じて[インポートサイズ]を選択します。
5. [すべてのレイヤー構造]または[エクスポートとマークされたレイヤーのみ]のインポートを選択します。すべてのレイヤーをインポートするには[すべてのレイヤー構造]を選択します。
   
6. [インポート]をクリックしてプロセスを開始します。
7. 描画されたレイヤーをProtoPieの現在のファイルにダウンロードします。Figmaでのレイヤーの順序が維持されます。
   

デザインの再インポート

フレームの再インポートにも、このインポートプロセスを使用できます。Figmaでオリジナルのファイルに加えた変更を取り込むことができます。

インポートプロセスを実行すると、[再インポートオプション]という見出しが表示されます。ここで、ProtoPieにどのようにフレームを再インポートするかを決めることができます。

再インポートの際に、次の動作の有無を選択できます。

• レイヤーの位置[への変更]を上書きする
• レイヤーのサイズ[への変更]を上書きする
• レイヤーの順序およびグループ構造を更新する
• Figmaで削除または不可視化されたレイヤーを削除する
  
  

Figmaアカウントの接続解除

ProtoPieのアカウントと結びついているFigmaのアカウントを変更したり、両者の接続を完全に解除するには、FigmaアカウントとProtoPieの接続を解除します。

この操作はFigmaのアカウント設定で行うことができます。

1. Figmaアカウントにログインして、ファイルブラウザを開きます
2. 左上隅にある自分の名前をクリックして、[設定]タブを選択します。
3. [接続しているアプリ]セクションまで下にスクロールします。
4. ProtoPieとの統合の横にある[アクセスを取り消す]クリックします。