新しいプロダクトを作るときは、本当にユーザーのニーズに応えられているか、価値あるものとしてユーザーに受け容れられるか、自身の価値観や思い込みに偏ってはいないか･･･など、色々不安になるものです。
プロジェクトを成功させるには、初期のコンセプトづくりの時点から、ユーザーとコミュニケーションを取る必要があります。そして、その後の開発過程でも、デザインの良し悪しや使い勝手について、ユーザーの反応を確認し、取り入れていくことが重要です。
その手助けとなるのが「プロトタイピング」。この記事では、一般的に言われている「プロトタイピング」についてや、メリット・業務での活用方法、プロトタイピングツールについてご紹介します。
目次
プロダクト作りの失敗例
プロダクト作りにおいてよく起こるのが「コミュニケーション」に関する問題。特に大きく2つの問題がよく起こります。
口頭ベースでアイデアを伝えられない
社内の関係者との会話でも、口頭ベースではアイデアを正しく伝えられないことがよくあります。ましてや、社外のユーザーにコンセプトやそれを実現する仕様、細かい機能のアイデアを口頭で伝えるのは至難の技といえます。「アイデアの可視化」が必要となるのです。
ユーザーから意見をもらうことが難しい
ユーザーはまだ存在しないプロダクトに対して、具体的に想像して、本当に欲しいかどうか評価することができるでしょうか。おそらくユーザーは、自分の知っている物事と照らし合わせて回答せざるを得ません。結果的に、せっかく出してもらった意見でも軸がブレていて、上手くプロダクトに落とし込めなくなってしまいます。
ではこれらをどう解決すればよいのか。
プロダクトを完成させてから、ユーザーや社内の意思決定者に判断してもらえば良いのでしょうか？
しかし、作りきってしまうのはリスクがあります。価値あるプロダクトを作ったつもりでも、そもそも必要とされてないかもしれません。そうなった場合、開発費用は水の泡ですよね･･･
そこで活躍するのが「プロトタイピング」。開発プロセスの早い段階から多くの人にアイデアに触れてフィードバックをもらうことができ、プロジェクトを効率的に進めることが出来ます。
次の章からは、プロトタイピングについて深掘りしてご紹介していきます。
プロトタイピングとは
まずはソフトウェアのプロダクトを想定し、「ソフトウェアプロトタイピング」を調べてみます。
【ソフトウェアプロトタイピング（英: Software Prototyping）】
将来完成する予定のソフトウェアの不完全なモデル（プロトタイプ）を作成することおよびその過程を意味する。
(参考：Wikipedia)
なるほど、ソフトウェアのプロトタイプを作ることやそのプロセスを指すようです。
では、ここで当たり前のように出てきた「プロトタイプ」という言葉はどうでしょうか？
【プロトタイプ（英: prototype）】
デモンストレーション目的や新技術・新機構の検証、試験、量産前での問題点の洗い出しのために設計・仮組み・製造された原型機・原型回路・コンピュータプログラムのことを指す。
（参考：wikipedia）
簡単に言うと、プロトタイプとは、「将来のプロダクトの『原型』や『モデル』」と言うことですね。
※ここでは “プロダクト”は、広義の意味も含まれますが、この記事では“ソフトウェアのプロトタイピング”に注目します。
言葉の成り立ちをもとに、一旦重要なポイントを整理してみましょう。
- プロトタイプとはプロダクトが目指す未来のビジョンを伝えるモノであり、プロトタイピングはそれを実現するためのプロセスである
- プロトタイピングとは、コーディングなどで作り込むより前に、将来の完成像を思い描ける「モデル」を手早く作ることを言う
こうしてみると、プロトタイピングの理解にはプロトタイプの理解が不可欠だというのがお分かりいただけたかと思います。ただ、「未来のビジョン」「完成像のモデル」という説明は抽象的すぎて、何となくわかった程度かもしれません。
「ExcelやKeynote、PowerPointで、何をどこに配置するかといったレイアウトを説明するワイヤーフレームを作ることなのかな？」
「専門のツールを使うなど、難しいことなのかな･･･」
「プロトタイプを作るって必要なのかな？」
プロトタイプを作ったことがない方からすれば、具体的にイメージするのは難しく、疑問に感じるかもしれません。そこで、まず先に「なぜプロトタイプを作る必要があるのか」について、深掘りしたいと思います。
なぜプロトタイプを作る必要があるのか？
デザインプロセスを最適化・効率化できる
簡単なスケッチでも動きのあるプロトタイプを作ることで、初期から動きが理解できるものをベースにしてデザインを進める議論が可能になります。見た目を磨くことに夢中にならず、インタラクションやユーザビリティ（ユーザー体験）への注目も維持できるため、デザインプロセスを効率化させ、質も高められます。
コミュニケーション・コラボレーションを生み出せる
昔から言われるように「百聞は一見にしかず」です。苦労して長々と説明するよりもプロトタイプを取り出して一緒に見た方が話は百倍早いはず。
素晴らしいプロダクトを作るためには、多くの人による協力が必要です。そしてステークホルダーは社外のユーザーや投資家、社内のエンジニア、デザイナー、マーケターなど立場も意見も異なるさまざまな人たちです。背景の異なるステークホルダーを一つのビジョンに向けてまとめるのはとても大変ですが、プロトタイプを共通言語として活かせば認識のギャップを埋めていくことができるのです。
アイディアが売りやすくなる
先に挙げた通り、事業は開発チームだけでは完結しません。経営層や投資家からの理解も重要です。現場の開発プロセスに関わらなくても決定権をもっているメンバーのサポートを確保するためには、プロトタイプを触りながら進行状況やアウトプットを確認してもらうことが最も効果的でしょう。
また、ユーザーにプロダクトを届けるためにセールスチームとのコラボレーションも不可欠です。いかに魅力的なプロダクトか。どのような価値があり、ユーザーにもたらす具体的なメリットは何か。口頭で、あるいはコンセプトの書かれた資料だけでは十分に伝わりませんが、プロトタイプはそのギャップを埋めてくれます。早い段階からマーケティングやセールスがプロダクトを想像でき、準備できるようになるのです。
技術的な可能性を測定できる
プロトタイプを作り、テストや議論の結果を盛り込んで改善し、それをまたプロトタイプとして具現化するーこのプロセスの中で、開発者たちは見通しを立てながら技術的な可能性を試すことができるようになります。完成品を作るまでもなく、安く失敗できると言っても過言ではありません。
面白い事例があるので一つご紹介しましょう。
イギリスのコンサルティングサービスを提供しているジョナサン・ベーカー・ベーツ社では、かつてウォーターフォール型で開発を行なっており、様々な問題を抱えていました。エンジニア向けの大量のドキュメンテーションに非常に時間がかかっていたのです。そして、時間をかけても口頭や文字だけのドキュメントでは正しいプロダクトのイメージや規模感が読み取れないために、毎回確認リクエストが大量に発生し、開発に遅れが生じるという負の循環が生まれていました。
プロトタイピングを行ったことで、そうしたドキュメントの作成時間は半分になり、スケジュールや予算感のズレも大幅に削減。目指すイメージを共有しながら開発を進められるため、都度の確認は80%なくなり、バグの修正も25％減ったそうです。
ユーザーへ視点を保てる
おそらくプロトタイピングのもっとも素晴らしいマジックは、ユーザーが早い段階でプロダクトに触れることが可能になることでしょう。最初にお伝えした通り、いま存在しない何かについて正確な判断を下すことはとても難しいことだからです。仮に見たことのない新プロダクトのコンセプトを聞いたうえで「便利だと思うか」「お金を払っても欲しいと思うか」「他のもので代用できると思うか」と問われても、善意と想像力の範囲でなんとなく回答するのが関の山です。
直に触れることができてはじめて、ユーザーは確実なフィードバックを行うことができるようになるのです。実のあるユーザーの声を聞き、ユーザービリティに関する問題点を早期に発見できるということは、ユーザーのニーズに応え、愛されるプロダクトを作るための大きなメリットと言えるでしょう。
Goodpatchと関わらせて頂いているクライアント様の中でも、プロトタイピングを取り入れて成功した事例があります。是非こちらも参考にしてみてください。
プロトタイプが活躍する場面・役割
プロトタイプの「プロダクトが目指す未来のビジョンを伝える」という役割は揺るがない大前提ですが、登場する場面により求められる役割や適切なカタチは異なります。いくつかのシチュエーションに分けてご紹介します。
学習 – アイデアを形にしてさらにアイデアを湧かせる
ブレインストーミングやグループディスカッションの場面を思い浮かべてください。あるいは一人で思考をまとめる場面でも良いでしょう。スケッチやラフの制作、模造紙に付箋、ホワイトボード上にマインドマップ･･･意見を形にすることから新しい気づきや他人の意見を得て、最適解を導き出してみましょう。
説明 – チーム内の共通言語とすることでお互いの理解を深める
考え方の異なるチームメンバー全員が理解できる共通言語を見つけることは難しいものですが、プロトタイプを作ることでこのギャップを埋めることができます。プロトタイプを見ながら疑問を解決し、改善のアイデアを検討することでプロダクトの機能や特徴を深く理解し、ノウハウを共有するための時間を圧倒的に短縮できます。
テスト – ユーザーに実際のものを触ってもらう
リリース後のプロダクトが市場で生き残れるかどうかは、ユーザーの反応にかかっています。プロトタイプを作り、潜在的なユーザーに直に触ってもらうことで、完成品が持つ機能やアイデアに価値があると言えるか、またユーザーに受け容れられそうか事前に確かめることができます。アイデアを絵やイメージで伝えるだけではなく、直に体験できるようなプロトタイプであれば、さらに正確で具体的な反応を得られるはずです。
販売 – 投資家、上司、チームにプロダクトのビジョンを見せる
プロダクトは開発するだけでは終わりません。資金を集めたりプロモーションするために、経営層や投資家に事業価値を説明しなくてはいけない場面もあれば、営業やマーケティングのメンバーにもそのプロダクトのビジョンを理解し、プロモーション準備を進めてもらう必要もあります。ビジネスの可能性を信じてもらい実現するために、プロトタイプを活用することができます。
プロトタイプの構成と完成度について
さらに上記の場面・役割によってプロトタイプの構成や完成度も異なります。大きく3つのレイヤーに分かれます。
コンテンツ
対象は画面上のコンテンツです。どこで何が表現されるのか、伝えたい内容を理解するためのレイヤーと考えれば良いでしょう。
ファンクション
対象は動きです。どのように画面が遷移するのか、コンテンツが表示されるのか、などの操作上のイメージを理解するためのレイヤーです。
ビジュアル
対象はUI（ユーザーインターフェース）、つまり見た目の印象です。例えば、使う色や文字フォント、大きさなど、ユーザーに与える雰囲気を醸成する様々な単位の決め事と考えればよいでしょう。
ポイントのみを押さえたラフのようなビジュアルやファンクションのレイヤーの粗い粒度（ローフィデリティ）が適切な場合もあれば、動きを伴うカラフルなサンプルのように、できるだけ細かいレベルまでの表現（ハイフィデリティ）を必要とする場合もあります。
例えば、企業で何かキャンペーンなどを告知する際に、ウェブサイト上に1ページの長いランディングページを作ることがあります。そのようなページを作る場合は、ワイヤーフレームをもとにコンテンツの確認を行いますし、画面遷移の流れなどもコメントで補足をすれば十分伝わります。しかし、ユーザーのインタラクションが重視される複雑なウェブサイトやモバイルアプリの場合、ワイヤーフレームだけでは不十分なので、細かい粒度の表現が必要となります。
完成度を使い分けるコツ
プロトタイプの完成度を考える際、使い分け方の判断指標となるのが、その目的やオーディエンスです。
目的別
プロトタイプを利用する目的はさまざまですが、早い段階では全体のコンセプトを確認するのが最も重要な目的でしょう。
木を見るのではなく、森を見るイメージです。プロトタイプを体験する人たちが細かいところに引っかからず全体像（プロダクトのコンセプトなど）に注目するためには、コンテンツレベルでは細かく、ビジュアルやファンクションのレベルでは粗い表現レベルのプロトタイプの方が適切です。
コンセプト確定後に作られる多くのプロトタイプは、ユーザーのインタラクションを実験したりプロダクトのフィーリングを確認することが目的となっています。
全体像や大まかなコンテンツだけを伝えるプロトタイプでは、細かいユーザーの反応やフィードバックを実験するのが難しいでしょう。プロダクトコンセプトがある程度確定され、細かいデザインやユーザビリティ（ユーザー体験）について学ぶフェーズでは、プロダクトの持つ機能やデザインの具体的なポイントを表現したものが必要になります。
オーディエンス別
開発プロセス上、エンジニアやデザイナーなど他のチームメンバーがオーディエンスになる場合、メンバーが理解し議論できるレベルのプロトタイプが適切です。関係者はプロセスの進行や目的を良く理解しており、その場で直接にコミュニケーションが取れるため、一つの疑問をディスカッションするためのたたき台というかたちで十分な場合が多いです。
それに対して、ターゲットオーディエンスが投資家や経営者であれば、立派に見えるカラーを使う方が印象に残ります。事業の夢を持たせることが主眼にあるため、見た目のインパクトは重要です。ただし、プロタクトの成功はプロトタイプで簡単に予測できるものではありません。おしゃれなプロトタイプに満足してもらえたからと言って、ビジネス視点を見落とさないよう気をつけましょう 。
プロトタイプを作るために必要なツールとは
先に述べた通り、目的やオーディエンスによって、コンテンツ、ファンクション、ビジュアルの完成度は変わり、適切と言えるプロトタイプの形式も異なります。要件にあわせて適切なプロトタイプを作るために様々なツールがあります。
コンセプトを確認するフェーズでは、紙（ナプキンでも）のラフスケッチで十分な場合がほとんどです。デジタルワイヤーフレームを作るには、PowerPointやKeynoteなどプレゼンツールを利用する人がいますが、細かいビジュアルを作るのにはPhotoshopやSketchなどの複雑なデザインソフトが便利です。
ただし前述の通り、実際にはワイヤーフレームやスクリーンのビジュアルでは足りない場合も多々あります。そんなとき、コードを書けば完成度の高いプロトタイプを作ることは可能ですが、スキルレベルが要求されますし、その分の工数が少なからず発生します。
そこで、実際に動きを伴うプロトタイプを簡単に作れるように、様々なプロトタイピングツールが使われるようになったのです。
GoodpatchでもProttやBaltoと言った、プロトタイピングを効率化できるツールを提供しています。
プロトタイピングは誰の仕事か？
一見デザイナーの仕事のように思いますが、これはずばりプロダクトマネージャーの仕事です。
そもそもプロダクトマネージャーの責任範囲は、プロダクトの一生全てに及びます。コンセプトを考え、そのビジョンをもとに社内外の関係者とともに具現化し、ユーザー体験から学び、プロダクトを磨いていく･･･その全ての工程には、プロトタイプが欠かせません。したがって、プロダクトマネージャーの仕事と言えるのです。
もちろん、細かいデザインフェーズではデザインソフトウェアを使う必要も出てきます。そうした作りこみが発生する場合はデザイナーのスキルを頼ることもありますが、あくまで主導するのはプロダクトマネージャーです。プロトタイプ自体が共通言語なので、デザイナーと密接にコラボレーションして思い描いたデザインを具現化しましょう。
おわりに
かつての開発手法と言えば「ウォーターフォール型」が一般的でした。しかし、進化が目覚しく競争の激しいテクノロジーの世界では、ついていくことが難しくなっています。代わりに台頭した「アジャイル」や「リーン」という手法の採用により、アイデアの段階からユーザーが価値を感じられるものを開発し、早期にプロダクトの精度を高めることが重視されるようになりました。
ただ、アジャイルやリーンの開発手法では、短期間で構築ー計測ー学習（built – measure – learn）のフィードバックループというプロセスを何度も繰り返すことがポイントになってきます。そのため、アイデアや仮説を確実にテストし評価できるモノ、つまりプロトタイプを早く、安く作成する必要があるのです。
次は実際にプロトタイピングの実践方法を学んでいきましょう。実務で活かして効率よく、クオリティの高いアウトプットを作りましょう！
