「プロトタイピング」は従来、ソフトウェア開発などの現場で採用されてきた手法の1つです。さらに昨今では、デザイン思考を学ぶ上で欠かせないスキルの1つとしても注目されています。本記事ではプロトタイピングとは何かやプロトタイピングで使うツール、プロトタイピングを体験する手順まで解説いたします。

プロトタイピングとは

プロトタイピングとは、製品などの開発を始める前の段階で簡易的な試作品（prototype）を製作し、ユーザーからフィードバックを得る手法です。プロトタイピングは従来、ソフトウェアやアプリの開発、Web制作の現場でよく採用されていました。
 
さらに昨今では、新しいサービスや製品を開発する際の手法としても有効性が認められ、採用される例も増えている状況です。またデザイン思考のプロセスに含まれるスキルの1つとしても、プロトタイピングが注目されています。

プロトタイピングを行うメリット

プロトタイピングがアプリ開発からサービス・製品開発に至るまで、様々なシーンで活用できる点をみてきました。それでは、プロトタイプによってどのようなメリットが期待されるのでしょうか。

アイデアをブラッシュアップさせることができる

プロトタイピングは、アイデアを具現化してユーザーに試してもらうのが目的です。その結果のフィードバックを受けることによって、アイデアをブラッシュアップすることができます。

メンバー間での認識を揃えられる

要件定義書をまとめた段階では、製品やサービスに対するメンバーの認識が必ずしも一致しているとは限りません。しかしプロトタイピングを行うことで、メンバー間における細かい認識の違いを顕在化させ、互いに修正をはかることができます。それによってメンバーの一体感を醸成し、開発を円滑に進められるようになるのです。

早期に改善点や不具合を見つけることができる

プロトタイピングによって、ユーザーがサービスや製品の完成形をイメージしやすくなります。その結果、ユーザーの要求とサービス・製品とのズレや不具合について、いち早く気づけるようになるのです。こういったズレや不具合を開発の初期段階で修正できれば、開発が進んだ段階での手戻りを防ぐことができます。

プロトタイピングを行う上での注意点

プロトタイプを作るには、それだけコストと時間が必要です。できるだけ完成形に近いプロトタイプの方が、ユーザーのフィードバックを得やすいのは間違いありません。しかし完成形と同品質のプロトタイプを作ろうとすれば、本来の開発にかけるのとほぼ同程度のコスト・時間が消費されることになります。
 
プロトタイプにそこまでコストや時間をかけるのは、生産性が高いとは言えず現実的ではありません。そこで、あらかじめユーザーニーズを慎重に調査・特定し、プロトタイピングを行う目的を明確化して要件を絞る必要があります。それに本来の目的とずれたプロトタイプを作ってしまっても、期待されるような効果を出す こともできません。
 
ユーザーの意見を聞き過ぎてしまい、結果として製品・サービスの品質を落としてしまうことは避けるべきです。ユーザーの意見には、そのユーザーの好みにすぎないものや、製品・サービスに対する本来的な要求とはかけ離れたものも含まれています。その意見が本当に製品・サービスに対する要求を実現するのに必要か、製品・サービスの品質を高めるものかの見極めが求められるのです。

おすすめのプロトタイピングツール3選

プロトタイピングには決まった方法はありません。紙に書く方法（ペーパープロトタイピング）や、Power Point、PhotoshopやIllustratorを使う方法もありますが、プロトタイピングツールを使えばより効率的に進めることができます。プロトタイピングツールには様々な種類があるので、作る目的に合った、使いやすいものを選びましょう。ここではおすすめのプロトタイピングツールを3つご紹介します。

1．POP（marvel）

POPは手書きのアプリ画面を撮影して、簡易的なプロトタイプを作成できるスマートフォンアプリです。POPに手書きのアプリ画面を読み込むことで、実際の画面遷移を再現したプロトタイプを簡単に作成できます。POPは効率的にUI設計を進め たいときに便利です。
 
公式サイト：https://marvelapp.com/pop/

2．Adobe XD

Adobe XDはAdobe社が開発・提供するデザイン・プロトタイプ作成ツールです。Adobe XDは簡単な操作で、アニメーションを含むプロトタイプを作成できます。またAdobe社のツールということもあって、Adobeの他ツールとスムーズに連携する機能が提供されている点も魅力です。Adobe Illustratorで描いたイラストにAdobe After Effectsで動きをつけ、Adobe XDでのプロトタイプ作りに活用するといったこともできます。
 
公式サイト：https://www.adobe.com/jp/products/xd.html

3．Prott

Prottは日本製のプロトタイピングツールで、作業画面はもとよりサポートまで日本語に対応しています。Prottでは「画面を取り込む」「つなぎ合わせる」「アニメーションを指定する」という3つの手順だけで、簡単にプロトタイプを作成可能です。
 
Prottには無料版の他、有料版が存在します。個人で利用する分には無料版で十分ですが、有料版にすれば複数ユーザーでの共同編集や画面遷移図といった機能も利用可能です。
 
公式サイト：https://prottapp.com/

プロトタイピングに挑戦してみよう

前項でご紹介したプロトタイピングツール「POP」を利用し、プロトタイピングに挑戦してみましょう。ここで紹介した手順を実行することで、インサイトをスピーディーにプロトタイプへ変えられることを体験できます。また、この項で紹介する手順は、プロトタイピングの考え方をチーム内で共有するためのワークショップにも活用可能です。

ニーズの特定

まずは、ユーザーニーズの特定を行います。新しく開発するデジタルサービスで、ユーザーのどのようなニーズを解決できるかを明確化しましょう。あわせて、ユーザーニーズと既存サービスが提供する価値とのギャップに関しても洗い出します。

アイディエーション

前項でまとめたユーザーニーズや価値のギャップに基づき、デジタルサービスのコンセプトをまとめます。アプリによって、必ずしもユーザーニーズを全て満たす必要はありません。しかし、アプリはサービスの構成要素として成立する必要があります。

スケッチ

まとめたコンセプトに基づき、アプリのプロトタイプを作成する段階です。まずはアプリの画面遷移を手書きのスケッチにまとめます。開発予定のアプリに関する主要機能や利用の流れを、プロトタイプに盛り込むようにしましょう。

制作

前項で作成したスケッチをPOPにアップロードし、プロトタイプを完成させます。各要素をクリックできるようにして、画面遷移の流れを作りましょう。

プレゼンテーション

この項までにまとめた内容やプロトタイプをもとに、プレゼンテーションを行います。発表すべき必要最低限の内容は以下の通りです。
 
・ニーズ・価値観のギャップ
・新しく開発するサービスについての、おおまかなコンセプト
・アプリを利用する際の流れ

リフレクション

プレゼンテーションまで終わったら、全体のまとめに入ります。以下の内容を振り返りましょう。
 
・全体的にどうだったか
・何が難しかったか・何に助けられたか
・今回の経験で得られたインサイトは何か
 
Hyper Island TOOLBOXではプロトタイピング用のワークショップを実践する手順について、より詳細に紹介しています。興味があれば、あわせてご参照ください。
 
90分プロトタイプ – Hyper Island TOOLBOX
https://hij-toolbox.tds-g.biz/tool/90-minute-prototypes/

まとめ

プロトタイピングとは、製品・サービス開発の初期段階でプロトタイプ（試作品）を製作し、ユーザーからフィードバックをもらう手法です。プロトタイピングを行うことによって、アイデアをブラッシュアップさせたり、メンバー間の認識を合わせたり、早期に改善点や不具合を見つけることができます。
 
一方、プロトタイプ作りにも費用とコストがかかることから、ユーザーニーズを把握した上でプロトタイプの要件を絞ることが必要です。プロトタイプ作りに時間とコストをかけ過ぎても、生産性が高いとは言えません。完璧なものを作るのではなく、いち早く手に取れる形にするか、またそこから得られたフィードバックをもとに素早く改善し、顧客や市場にフィットさせていくということがプロトタイピングの目的です。