最初のプロトタイプを作成する
コンピューターにProtoPieをインストールして起動したら、いよいよ最初のプロトタイプを作成する旅に出る準備は万端です！
さっそく始めるために、基本的な手順を見ていきましょう：
デザインの取り込み：ProtoPieにデザインをシームレスに取り込む方法を学びましょう。これにより、既存のアセットをプロトタイピング環境に持ち込めます。
インタラクションの作成：ProtoPieの力を活用して、最初のインタラクションを作成する方法を学びましょう。インタラクティブな要素と魅力的なユーザー体験で、創造力を発揮し、プロトタイプに命を吹き込みましょう。
プロトタイプをテストする：ProtoPieのプレビューモードのおかげで、作成しながらプロトタイプの動作を確認できます。
プロトタイプを共有する：完成に満足したら、いよいよプロトタイプを他の人と共有する番です。ProtoPieで利用できるさまざまな共有オプションを確認して、作品を披露し、貴重なフィードバックを集めましょう。
リアルなプロトタイプを作成するには、ProtoPie独自の概念モデルを理解することが重要です。このモデルはProtoPieの基盤であり中核で、インタラクションがどのように作成され、実装されるかを決定します。
まだProtoPieをインストールしていませんか？ ProtoPieを無料で試す！
1. デザインの取り込み
まずは、Figma、Sketch、またはAdobe XDから、それぞれのProtoPieプラグインを使ってProtoPieにデザインを取り込みます。
アートボードや最上位フレームをシーンとして取り込み、Figma、Sketch、Adobe XDと同じレイヤー階層、配置、制約を持つオブジェクトを取り込みます。
詳細を見る デザインの取り込みについて。
2. 最初のインタラクションを作成する
最初にリアルなインタラクションを作成するには、ProtoPie独自の特徴的な概念モデルを理解することが重要です。仕組みを理解したら、あとは適切な要素を組み合わせて、インタラクションに命を吹き込むだけです！
概念モデルを理解する
概念モデルはProtoPieの基盤であり中核です。現実世界でオブジェクトがどのように動くかに基づいています。
プロトタイプを作成するには、インタラクションを作成する必要があります。インタラクションを作成するには、オブジェクト、トリガー、そして1つまたは複数のレスポンスを組み合わせます。
ProtoPieにおけるオブジェクトとは、アクションの影響を受けるレイヤーを指します。これは、トリガーまたはレスポンスのどちらかによって発生します。トリガーは1つ以上のレスポンスを引き起こすアクションとして機能し、レスポンスはトリガーによってもたらされる変化や変更を表します。
これは、元素の周期表から着想を得た、ProtoPieのトリガーとレスポンスの視覚的な表現です。各トリガーとレスポンスには、それぞれ独自の機能とプロパティがあります。
選べるトリガーとレスポンスは多岐にわたります。ProtoPieでのプロトタイピングは、トリガーとレスポンスを組み合わせることに尽きます。思い描くどんなインタラクションでも作成できます！
この例を見てみましょう。緑の長方形をタップすると、右に移動します。これは、緑の長方形レイヤーに割り当てられたTapトリガーとMoveレスポンスで構成されたインタラクションによるものです。
もちろん、より複雑なインタラクションを作成することもできます。可能なのは次のようなことです：
インタラクションに2つ以上のレスポンスを持たせる。
1つのインタラクションで、トリガーとレスポンスに異なるレイヤーを割り当てる。
各レスポンスの継続時間と遅延を制御する。
数式を使ってレイヤーを動的に制御する。
複数の画面やデバイスをまたいでインタラクションを作成する
3. 作成したものをテストする
プレビューウィンドウを使って、インタラクションが形になる様子を確認しましょう。この機能により、他の人と共有する前に、プロトタイプのエラーを見つけて修正できます。
デフォルトでは、レイヤーやインタラクションに変更を加えるたびにプレビューウィンドウが自動更新されます。ProtoPie Studioを起動したときやプロトタイプを切り替えるときに、プレビューウィンドウをデフォルトで非表示にしたい場合は、Preferencesメニューでオフにするだけです。
もう1つの方法は、ProtoPie Studioの無料コンパニオンアプリであるProtoPie Playerを使うことです。iOS、iPadOS、Androidでプロトタイプをシームレスに表示、体験、テストできます。
詳細を見る ProtoPie Player について。
4. 最初のプロトタイプを共有する
プロトタイプをクラウドにアップロードしましょう。関係者とリンクを共有します。プロトタイプによっては、デスクトップブラウザ、モバイルブラウザ、またはProtoPie Playerでプレビューできます。
関係者は、クラウドに保存されたプロトタイプをユーザビリティテストに活用したり、他の関係者と共有したりできます。
機密性の高い作業ですか？ プロトタイプにパスワード保護を有効にしましょう。
詳細を見る プロトタイプの共有について。
さらに学ぶ準備はできましたか？
次のコースでProtoPieの知識を深めましょう。
他の人から学ぶ
コミュニティに参加して、ほかのProtoPieユーザーから学びましょう。思いついたことは何でも、気軽に参加し、質問し、共有してください。他のユーザーが以前に共有したヒント、コツ、解決策も見つかります。
プロトタイプ作成で行き詰まったり、取り上げてほしい特定のトピックがある場合は、こちらからメッセージをお送りください： ProtoPieに質問する。