プロトタイピングとは？ プロトタイプの種類とデザイン・ツールを知っておこう

プロトタイピングが必要な貴方へ

出典：gahag.net
新しいプロダクトを開発するときに必ず求められるのが「プロトタイピング」工程。

実際のプロダクトを作る前に簡単な試作品（プロトタイプ）を作ることで、より効率的な開発を行おうという考えから生まれました。

プレゼンなどでアピールするために作られることもあります。

新製品開発に関わるのであれば必須の知識・技能であるプロトタイピング。
今回は、その基本と、目的別プロトタイプの種類、作成のためにツールを紹介していきたいと思います。

プロトタイピングとは

改めて、プロトタイピングがどのような工程なのか確認しておきましょう。

プロトタイピングは、実際のプロダクトの開発を進める前に、簡単な機能・デザインのみを実装した試作品を作る工程です。
紙を使ったものやデジタルツールを使ったものなど、目的やフェーズによってプロトタイプに種類は多岐にわたります。

ソフトウェア開発の場でよく使われていたものですが、最近ではUIデザイナー、UXデザイナーなどにとっても重要なスキルとなっています。

プロトタイピングを実施する３つの意味（メリットと注意点）

出典：gahag.net
プロトタイピングが重要な工程であることを繰り返し述べてきました。
ここでその理由を確認していきましょう。

１．早い段階でフィードバックを得られる（開発コストの抑制）

プロトタイプを作成することで、問題の早期発見が期待できます。
本格的な開発を始めてしまってから問題が発覚し、それまでの作業が無駄になるというリスクを回避することができるのです。

２．ユーザーとの認識のズレに気が付ける

プロトタイプを実際のユーザーに使ってもらうことで、ユーザーとの認識のズレを防げます。
認識のズレとは、開発チームの求めているモノがユーザーのニーズから離れてしまっている状態のことです。不要な機能によってユーザビリティが阻害されている場合などがあります。

３．ビジョンを共有できる

チームや上司、その他のステークホルダーとビジョンを共有できることもプロトタイピングのメリットです。
チーム内のビジョン共有により開発がスムーズになります。
またプレゼンテーション時には、プロトタイプによってより明確なイメージを提供することができるようになります。

プロタイピングを実施する意味が分かったところで、次は実際にどのようなプロトタイプを作ればよいのか考えていきましょう。

プロトタイピングの種類

プロタイピングの分類にはいろいろなものがありますが、今回はシンプルに「デザイン型」「機能型」「ハイブリッド型」で分けてみました。

A. デザイン型

プロダクトのデザインの確認を目的とするプロトタイプです。
求められるデザインの精度はまちまちで、ラフレベルのものもあれば、綺麗にビジュアルを仕上げるものもあります。

A-1 ワイヤーフレーム

ワイヤーフレームとは、サイトやアプリの設計図です。
ボタンやテキスト、グラフィックなどのレイアウトが確認できます。

ペンで紙に描くのもデジタルツールで作ってしまうのもありです。
作ってみると、意外と必要なパーツがなかったりするかもしれません。

A-2 モックアップ

モックアップはプロダクトの模型です。
模型なので、機能はついていません。
しかし骨組みだけのワイヤーフレームと違って、しっかりとビジュアルが表現されており、実際のプロダクトに近い外見となっています。

作り方はプロダクトによっても様々で、粘土を使うのもありです。最近だと３Dプリンターを使うのもいいかもしれません。

B. 機能型

プロダクトの機能の確認を目的とするプロトタイプです。
どこをどうすればどのように動くのか、などを確かめます。

B-1 ペーパープロトタイピング

ペーパープロトタイピングは、付箋などの紙にペンで画面を描いて機能を確認する手法です。
コーディングやデザイン・ツールの知識は不要なので、どんどんイメージを実装していくことができます。エンジニアやデザイナーへの伝達にも有効です。

B-2 オズの魔法使い

オズの魔法使いというプロトタイピング手法では、機能の部分を人が代替します。
スマホ型のフレームを使って画面を遷移させる、などが一例です。
ペーパープロトタイピングと違って、よりインタラクティブなプロトタイプとなるので、ユーザーテストに向いています。

B-3 コードプロトタイピング

コードプロトタイピングは、実際にコーディングして機能を実装します。
実際のプロダクトと比べて、最低限の機能だったり、デザインが実装されていなかったりするものです。
当然手間がかかってしまいますが、最もリアルに機能を確認できます。

C. ハイブリッド型

デザインと機能両方を備えたプロトタイプです。
アプリなどの場合は主にデジタルツールで作られることになります。

より実物に近い操作感を味わうことができるので、高い効果も得られます。
最近では、チームでの管理もしやすいツールが多く登場してきました。

プロトタイピングで役立つデザイン・ツール３選+α（厳選Ver）

プロトタイピングの序盤では紙やペンなどを使うので、そこまで特別なツールは必要ありません。
しかし段階が進むとより高い精度のプロトタイプを作りたくなると思います。
そんな時に役立つデザイン・ツールはたくさん存在しますが、今回は３＋αに厳選して紹介します。

１．InVision

出典：invisionapp.com
EvernoteやAirbnbでも使われているプロトタイピング・ツールです。
コメントや更新履歴の使いやすさなどから、チームでの開発に向いているツールとなっています。
１つのプロジェクトまでなら無料で使えるので、ぜひ試してみてください。

２．Adobe XD

出典：adobe.com
デザイン・ツールの定番Adobeが開発しているプロトタイピング・ツールです。
機能が豊富で難易度が高めなイメージがあるAdobeソフトですが、XDは比較的使いやすく、直感的にプロトタイプを作れます。
無料体験版があります。

３．Marvel

出典：marvelapp.com
Marvelはかなり簡単にプロトタイプを作ることができます。
紙に描いたものを写真にとって、アプリ上で画面遷移を加えることもできます。
さらにMarvelの嬉しい特徴は、無料で無制限にプロジェクトを作成できることです。

３+. Prott

日本語でMarvelと似たような操作感を体験できるのがProttです。
こちらも非常使いやすいツールです。
１プロジェクトまでなら無料で使えます。

いろいろなツールがあるので、自分やチームに合ったモノを探してみてください。

プロトタイピングを繰り返そう

プロトタイピングは効率的に開発を行うために必要不可欠です。
またアイデアを伝えるのにも使えます。

プロトタイピングを繰り返し、フィードバックを得て、より良いプロダクトの開発を目指しましょう。

新規事業を失敗させないためには

企業が新規事業で失敗しないためには、プロタイピングなどの知識をしっかりと理解し、その上で課題をしっかりと深掘りし、解決策を見つけ、小さく改善を繰り返していくことが大切になってきます。

この記事を通してプロトタイピングの最低限の知識を知っている、いわば新規事業創造のための型を知っているということは失敗のリスクを直接的に下げることができることに他なりません。

それでもカスタマージャーニー、エンパシーマップ、AARRR指標、PMF、CPF、VRIO分析、ユニットエコノミクスなどなど……。

みなさんはどれほどの知識があるでしょうか？まだ未知の単語が多いのではないでしょうか。

知識があるというだけで、失敗のリスクは劇的に減ります。
そして知識を活用できる段階に入ると失敗のリスクはさらに下がります。

これから起業や新規事業を興す人が先ほど挙げたような語句を理解していないと、成功させることはかなり難しいと思われます。

しかし、知識はもちろん学べばいいのです。

これまで起業や新規事業、マーケティング系の記事を書いてきた起業tvの運営会社アントレプレナーファクトリーとAmazon経書関連40週連続1位の『起業の科学』執筆者田所雅之氏がコラボした、新規事業創造の型を身につける動画サービスが「enfacスタートアップサイエンス」です。

AARRR指標やこの記事でも取り上げたプロトタイプの検証方法などの新規事業創造には欠かせない知識を105本の動画に詰め込んでいます。
「enfacスタートアップサイエンス」を通して、新たな製品やサービスを世に送り出し、世の中を豊かにすることを考えていきませんか？
無料デモIDをお出ししております。
ぜひこちらのリンク先よりお問合せください。