デザインアイデアを確実に伝える手段としてのラピッドプロトタイピング | アドビUX道場 #UXDojo

Creative Cloud UI/UX & Web

デザイナーなら、解決すべき課題にプロジェクトで直面したとき、しばらく考えをめぐらせて、そして解決案を思いつくでしょう。次は当然、その案の実現に向けた作業です。でも、もし解決案が間違っていたら?誤った案に力を注ぐのは、時間と労力の無駄です。であれば、できるだけ早く、悪い案だと突き止めることはとても重要です。では、良いアイデアを悪いアイデアから区別する方法は?

ありがたいことに、プロトタイプがその役に立ちます。プロトタイプは、ソリューションを完全に構築する前に、テストに使う実験的なひな形です。この記事では、ラピッドプロトタイピングの考え方と、実践する際のヒントを紹介します。

ラピッドプロトタイピングとは何か?

例えるなら、ラピッドプロトタイピングは、コンセプトの実証実験です。サイトやアプリの想定される形をすばやくつくり、ユーザーやプロジェクトの関係者と検証する行為です。ラピッドプロトタイピングの「ラピッド」は「迅速な」の意味で、実際に開発するより素早く安価に実践できるプロトタイプ手法であることを示唆しています。

ラピッドプロトタイピングのやり方は、デザインの方向性を決め、素早く検証を繰り返えせば、ユーザーに提供する価値を最大化できるという考えに基づいています。

通常、プロトタイプは、主要なユーザーフローだけのデザインから始まり、反復するごとに増える要件を付け加えながら、幅広い機能へと成長します。プロトタイプの最終版は、開発へと手渡されます。ラピッドプロトタイピングの過程は、3つの段階の循環として表現されます。

  1. プロトタイプ作成
    テスト可能な解決案を作成します。
  2. レビュー
    ユーザーや関係者にプロトタイプを渡し、何が上手くいき、何が上手くいっていないのかを調査します。
  3. 改善
    調査結果から、解析や修正が必要な領域を特定します。修正項目のリストは、次の繰り返しに行う作業範囲の決定に使われます。
ラピッドプロトタイピングは反復的なアプローチ。プロトタイプ作成、レビュー、改善の3段階。デザイナーは個々の段階を進み、最後の段階の後は最初に戻る。最初に設定した期待値を満たすまで(何回でも)繰り返す。

なぜ、ラピッドプロトタイピングは役に立つのか

ラピッドプロトタイピングには、他の手法に対する多くの利点があります。

  • デザインの意図をより上手く伝える
    静的な仕様書と比べ、プロトタイプはずっと理解が簡単です。自身の目で動きを確かめられれば、デザインへのフィードバックはずっと容易になります。開発中の製品の見た目や振る舞いを周囲と確実に共有する最適の方法です。
  • ドキュメントを削減して時間を節約する
    開発者は、プロトタイプを使って製品の動作を理解できます。たとえ、開発者がユーザーフローやインタラクションのドキュメントを必要とした場合でも、プロトタイプに対する説明なら、ワイヤーフレームへの説明よりずっと少ない記述ですみます。
  • 実験ができる
    ラピッドプロトタイピングは、様々な案や方向性を試すのに役立ちます。視覚的に表現するのは、情報を伝える最も速い方法です。そして、見ることにより議論が促されます。その結果、より速くてより良いデザインに近づきます。

プロトタイプの手法

適切なプロトタイプ手法を使い、テストにより得られたフィードバックからすばやく改定を行うことが、プロトタイプを成功させるコツです。プロトタイプの種類は、一枚の紙に描いたラフスケッチから、本物のような見た目と機能を持つプログラムまで多岐にわたります。デザインプロセスの進行の度合い、そしてプロトタイプの目的に合わせて、適切なプロトタイプ手法を選択しましょう。

1. ペーパープロトタイプ

いまや、ほとんど手間なくプロトタイプをつくれるデジタルプロトタイプツールが数多く存在します。しかし、紙へのスケッチは、今でもすべてのデザイナーにとって最も大切な手法です。スケッチにより、それほど時間と労力をかけることなく、デザイナーはいくつもの異なるデザイン案を模索できます。スケッチは、デザイナーの目を、見た目よりもデザインの本質(何をするためのデザインか)に向けさせます。そして、スケッチの特に優れている点は、誰でも取り掛かれることです。スケッチは誰でも描けて、そして特別な道具が不要です。すべての人が参加可能なスケッチは、ブレインストーミングで使用するのに理想的な手法です。

問題解決のための案をスケッチする。スケッチは、頭に浮かんだアイデアを一つ一つ追求するのに最適。主要なユーザーフローを描いたり、多様なレイアウトを探るため、スケッチが利用できる 出典: Steven Scarborough.

スケッチは、デザインプロセスの早い段階だけで使うものと考える人は大勢います。しかし、それは正しくありません。開発中、あるいは公開後でも、デザインを見直したりアイデアを視覚化したいときは、スケッチが役に立ちます。ハイファイ・プロトタイプが手元にあるときでさえも、ペンと紙を使うことがあるかもしれません。新しいアイデアは、スケッチした方が、ずっと素早く伝えられるからです。

ヒント

  • 最初の案にこだわらない
    ほとんどの場合、アイデアを出し始めた頃は解決しようとしている問題をよく理解できていません。そのため、最初の案は不十分なものになるでしょう。最初の案に固執せず、なるべく多くのデザインを試しましょう。
  • 各プロトタイプに明確な目的を設定する スケッチを始める前に、どんなページやレイアウトが必要なのか、それは何故かを明確にしておきましょう。例えば、関係者に見せるため、ユーザーフローを表す一連の画面のスケッチを描く、のようにです。
ペーパープロトタイプは、主要なユーザーインタラクションを検討するのに役立つ 出典: Martha-eierdanz
  • スケッチにステンシルを使用する 紙に描いたスケッチでは、要素の実際の大きさを想像しにくい場合があります。ステンシルを使えば、対象のデバイスの実寸にあわせて要素を描くのが容易になります。特に、描いた要素が操作するのに十分な大きさかを確認するとき便利です
出典: Amazon
  • スケッチの見た目を気にしない
    スケッチする際、つい見た目を良くしたくなるものです。うまく描きたいと思う気持ちは当然ですが、その誘惑には負けないように。スケッチを洗練させることよりも、デザインの本質を明確にすることに集中しましょう。
  • スケッチの写真を撮る
    スケッチに没頭していると、大事なスケッチがデスクの書類の中に埋もれてしまったり、うっかり捨ててしまうことだってあるでしょう。できるだけ早く写真を撮って、デジタルコピーを残しましょう。デジタルコピーがあれば、ミーティングごとに紙を持ち運ぶ代わりに、スマートフォンにすべて保持できます。デジタルコピーは、再利用、複製、共有可能な、優れたデザイン資料です。
  • チーム内でスケッチを共有する
    チームメンバーからのフィードバックは、関係者に見せる前のアイデアの確認に最適です。まずは、スケッチをチーム内に共有して、みんなの意見を求めましょう。
  • チームの共同作業として行う
    チームで働いているなら、チーム全員からスケッチを集めてみましょう。全員がアイデアをスケッチしたら、グループとして、議論や批評を行うことができます。

2. デジタルプロトタイプ

ペーパープロトタイプを使用して、複雑なインタラクションを言葉で説明するのは困難です。アニメーションのような複雑な動きの詳細を説明する必要があるときや、ユーザー調査でデザインを検証したいとき、一般的にインタラクティブなデジタルプロトタイプが使用されます。

デジタルプロトタイプは、人々が実際に体験できるインタラクティブなデザインです。ほんの10年前、ハイファイ・プロトタイプをつくるには、プログラム言語を使ってコードを記述しなければなりませんでした。今では、プロトタイプツールを使えば、開発者ではないユーザーでも、簡単に完成品のように機能する高忠実度のプロトタイプをつくれます。

Adobe XDを使ったプロトタイプ。デジタルプロトタイプは、コンテンツの展開やアニメーションなどの動的なインタラクションの表現に優れている

ヒント

  • 技術的な制限を理解する
    実装が不可能な装飾や機能を取り入れるのは避けましょう。不確かな場合は、プロトタイプ制作を始める前に、開発者に技術的な実現可能性を確認しましょう。
  • ダミーテキストの使用は避ける
    デジタルプロトタイピングの初期段階では、仮のテキストを使用するのは避ましょう。実際のコンテンツを使い、デザイン全体への影響を確認しましょう。
  • 開発者への最新仕様書に使う
    Adobe XDをはじめとするプロトタイプツールは、簡単な操作で仕様書を書き出せます。いつでも最新の仕様を開発者に渡せます。
Adobe XDでは、テキスト属性の確認、文字スタイルやコンテンツのコピー、大きさや距離の表示が可能

3. ネイティブプロトタイプ

ネイティブのプロトタイプとは、実機上でのテストのため、コードを記述して開発するプロトタイプです。ネイティブプロトタイプは、実環境における動作を確認することが目的で、実際のユーザーと解決案を検証するときによく使われています。

ネイティブプロトタイプは、完全に機能する最終版のように見えるものが多くあります。それでも、プロトタイプは完成した製品とは別物です。ラピッドプロトタイピングのポイントは、すべてを開発することなく、何らかの動作を実現することです。

ネイティブプロトタイプをつくるなら、しっかりとした開発スキルが必要です。開発スキルが足りなければ、ネイティブプロトタイプの開発に多くの時間を費やすことになるかもしれません。数日や数週間ではなく、数時間で動くプロトタイプを準備できるようになりましょう。

ネイティブプロトタイプはコーディングしてつくる。つまり、実際のAndroid/iOSアプリやサイトを開発することを意味する 出典: Apple

ヒント

  • 本物のデバイスとデータを使う
    ネイティブプロトタイピングの目標は、実環境におけるにアプリの動きの確認です。ですから、意味のあるフィードバックを得るため、ユーザーには実際に近い体験を提供するべきです。検証には、可能な限り実際のデバイスと実際のデータを利用しましょう。
  • 動かない機能があっても気にしない
    ネイティブプロトタイプをユーザーテストに使用するとき、被験者には、それがただのプロトタイプで、完成したソリューションではないことを確認しましょう。
  • コードを再利用する
    可能な場合、プロトタイプのコードを製品開発に再利用するつもりで開発しましょう。プロトタイプ作成には追加の負担になるかもしれませんが、開発全体としてはコスト削減になる可能性があります。

終わりに

ラピッドプロトタイピングは、デザイナーとそのチームを成功への近道へと導くでしょう。デザインプロセスの早い段階からプロトタイプに投資すれば、後工程で発生する多くの時間やコストを削減できます。次回のプロジェクトでデザインするとき、次の単純なルールを覚えておきましょう。「多くのプロトタイプをつくってテストするほど、ソリューションの質が高くなる」


この記事はRapid Prototyping: The Most Efficient Way To Communicate Your Ideas(著者:Nick Babich)の抄訳です

POSTED ON 2018.02.13

Products Featured

関連製品はありません