サービス開発をスムーズに。プロトタイピングのメリット、方法、ツールまとめ
「サービスやアプリ開発においてチームの認識を統一し、効率的にプロジェクトを進めたい」「体験の価値を高めたい」そんな悩みに効果的なプロトタイピングについてご存知でしょうか。今回はプロトタイピングを初めて実践する方へ向けて、プロトタイピングを始めるメリット・方法・ツールについてご紹介します！
プロトタイピングとは
プロトタイピングとは、最終成果物の試作品を早い段階から作り、改善を繰り返す手法のことを指します。作って壊す過程の試作品をプロトタイプと呼びます。
工業製品はもちろん、サービスやソフトウェアなど、様々なプロダクトの開発現場で、アイディアを検証する方法として使われることが多いプロトタイピングには、どんなメリットがあるのかご紹介します。
プロトタイピングのメリット
チームの共通言語になる
一つのプロダクトを作り上げるプロセスには、開発チームや社内のメンバーだけでなく、社外のユーザーや投資家など、様々なステークホルダーが関わってきます。しかし、立場が異なる人の間で、概念的なアイディアや機能についての話をするのは難しいことです。そこで、プロトタイプを目に見えるチームの共通言語として設けます。プロトタイプが領域を横断して共通言語の役割を果たすことで、コミュニケーションがスムーズになり、効率的に開発を進めることができます。
早い段階で失敗できる
プロトタイピングを用いることで、アイディア出しの段階でユーザーにとって本当に適切なのか確証を持てないことなどを、低コストで検証することができます。また、早い段階からプロトタイプにフィードバックをもらうことで、改善サイクルを早い段階から回すことができます。小さなエラーを早い段階で経験し、軌道修正していくことで、完成間近、またはリリース後になって大きな失敗が起こることを防ぐことができるのです。
プロトタイピングの最大のメリットとは「概念的なアイディアが目に見える形になること」と言えるでしょう。プロトタイピングのメリットについてもっと知りたい方はこちらも合わせてご覧ください。
プロトタイピングの流れ
では、ここからは実際にどうやってプロトタイピングを行うのかを、簡単に掴んでみましょう。
プロトタイピングのプロセスは大きく５つに分けられます。
1.ユーザーストーリーを考える
まずは、どんな条件でプロトタイピングを行うのかを明確にする必要があります。そのために、「どのようなユーザーが、どんな目的のために、何をするのか」を考え、ストーリーを立ててみましょう。
2.ユーザーフロー（流れ）を示す
ユーザーストーリーができたら、次にそのフロー（流れ）を示しましょう。ストーリーの中で優先すべき事項に焦点を当て、どのような動きや選択肢を画面に加えればユーザーにとって使いやすいプロダクトになるのかを１つの流れに沿ってまとめます。
3.スクリーンスケッチ＆ワイヤーフレームを描く
次は、いよいよ画面に表示する内容を決定します。まず、画面に必要な要素（画像やアクションボタンなど）をリストアップし、それらをどこに置くべきかを精査します。その際に、スケッチやワイヤーフレームにその仕様を落としこみを行います。紙ベースのスケッチでも十分ですが、早い段階からデジタルワイヤーフレームツールに落とし込んでおくと、チーム内でイメージを共有する際や仕様の変更にも柔軟に対応することができるでしょう。
4.仕上げをする（モックアップをつくる）
仕上げの段階ではモックアップを作ります。モックアップは、画像や色も含めた最終的なデザインのことで、ワイヤーフレームで構造や内容を把握した後に制作するものです。プロトタイピングにおいて、モックアップはあくまで最後に花を添えるものです。デザインにこだわるあまり、今まで考えてきたユーザーフローやユーザーの体験価値を見失わないように注意しましょう。
5.動かす
さあ、いよいよ最終段階です。ユーザーストーリーを元に制作したもの（スケッチ、モックアップ）をユーザーフローに沿って実際に動かしてみましょう。
以上がプロトタイピングの一連の流れです。より詳しい進め方は下記でご覧ください。
プロトタイピングの注意点
効率的かつ効果的なプロトタイピングを行うためには、検証する内容に優先順位をつけたり、検証すべき目的を明確にしておく必要があります。例えば、ユーザーはどのような人で何を求めているのか。そのユーザーのために解決すべき課題はなんなのか、などです。見切り発進するのではなく、始める前に一度踏みとどまって、チームメンバーと一緒に目的や検証するべき内容を確認しておきましょう。
また、プロトタイピングはあくまで検証のために行うもので、繰り返し行われることを前提としています。力を注ぎすぎてしまうあまり、愛着が湧いて捨てられない案になってしまわないように注意しましょう。
プロトタイピングのツール
近年、コードを書かずしても、本物のアプリのような動きなどを再現できるプロトタイピングツールが登場しました。より素早くアイディアを形にして検証を行うことができるので、ぜひツールの特徴やメリットを以下でインプットしてみてください！
またGoodpatchでは、Prott というプロトタイピングツールを開発しています。
アルバイト探しサービス「an」アプリの開発元であるパーソルキャリア株式会社（旧株式会社インテリジェンス）のWebプロデュースグループでは、アプリの大幅リニューアル時にProttをご活用いただきました。大幅リニューアルのプロセスにおいてどのようにプロトタイピングが実践されたのかインタビューでぜひご覧ください。
まとめ
プロトタイピングのメリット、方法、ツールをご紹介しました。サービスやアプリ開発をよりスムーズに、そして価値を高めるために参考にしていただけると嬉しいです。ぜひ、チームで実践してみてください！