手軽にアイデアを形にするペーパープロトタイピングのすすめ

Nick Babich

Babich氏はロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。

この記事はNick Babichからの翻訳転載です。配信元または著者の許可を得て配信しています。

The Magic of Paper Prototyping (2018-09-01)

デジタルデザインの世界には、プロトタイピングのプロセスを簡単にするたくさんのツールがあります。しかしペンと紙は、今もなおUXデザイナーにとってもっとも便利なツールとされています。

ペーパープロトタイピングは、概念化の初期段階において、チームが多様なコンセプトの中から使うものを選定する際に非常に便利です。ペーパープロトタイピングは、さまざまなアイデアを素早く視覚化し検討することを可能にします。

この記事では、デジタルインターフェイス向けのペーパープロトタイピングの準備やテストについて簡単に紹介します。

ペーパープロトタイピングの利点と欠点

ペーパープロトタイピングの具体的なTIPSを語る前に、このアプローチの利点と欠点について簡単に話しておきましょう。

まず利点からです。

  • 楽しい。ペーパープロトタイピングは、速く楽しい必要があります。遅く苦痛であった場合、プロトタイピングの仕方に何らかの間違いがあるでしょう。
  • 速い。数分で幾つかのデザインを作ることができます。
  • 安い。ペーパープロトタイピングは非常に安く済みます。基本的な道具はペンと紙だけです。デジタルプロトタイピングで使う道具の値段はさまざまですが、ほとんどの道具は1度購入する必要があるか、もしくは定額制になっています。
  • 少ないコミットメントで済む。誰も制作に何時間もかけたデジタルプロトタイプを欲しいとは思いません。作成5分しかかけていないスケッチの方が簡単に捨てられるからです。
  • 正直なフィードバックを引き出す。ペーパープロトタイピングの大きな利点はスケッチ風の見た目です。このプロトタイプは多く時間を費やして作成したようには見えないため、完成されたデザインよりも気負いせずに批評することができます。
  • チームビルディングにつながる。ペーパープロトタイピングは特別なスキルを必要としないため、誰でもプロセスに参加することができます。そのためペーパープロトタイピングをグループ活動として簡単に行えます。さまざまな経歴をもった人たちが、ペーパープロトタイピングの作成に関わることができるのです。

次に欠点です。

  • フィードバックを集めるのが難しい。ペーパープロトタイプはテスト参加者の豊かな想像力を必要とします。デザインに対する直感的な反応を得るのは難しいでしょう。紙を見ただけでは、商品の完成型を想像するのは大変だからです。
  • 直接会った人としか検証できない。参加者が広範囲に分布している場合、ペーパープロトタイプを検証することは困難です。
  • ペーパープロトタイピングは余分なステップである。ペーパープロトタイピングを、やはりデジタルプロトタイプに変換する必要があることが欠点です。

いつペーパープロトタイピングをするか

ペーパープロトタイピングは以下のような場面に最適です。

  • ブレインストーミング会議(チームがユーザーフローの手順をまとめる、または多様なレイアウトを調査/有効にする必要があるときに)
  • 概念実証テスト(チームがゲリラテストを行う必要があるときに)

デザイナーの中には、ペーパープロトタイピングはデザイン制作の初期段階でのみ有効であると考える人もいます。しかしそれは間違いです。ペーパープロトピングはデザイン制作のほぼすべての工程で役立ちます。ハイファイなプロトタイプを持っている、もしくは完成型の商品を持っている場合に、ペンと紙を使いペーパープロトピングを行うことが可能ですが、いくつかのオプションについて素早く調べる必要があります。

ペーパープロトタイプで役立つ11のTIPS

1. 各プロトタイプのゴールを決めておく

プロトタイピングの前に、プロトタイプで明確なゴールを設定することは効果的です。解決しようとしている問題について考え、その問題を解決するためのプロトタイプを作成しましょう

2. プロトタイプを完成させない

ペーパープロトタイピングは自身の芸術や工作技術を完璧にすることを目的としていません。問題の解決策を可能な限り速く見つけ出すことが目的です。見栄えを良くすることや要素を正しく整列させることに時間を使うのはやめましょう。

3. 良い道具を揃える

ペーパープロトタイピングの場合、本当に必要な道具はたったの2つ、ペンと紙だけです。しかし特別な道具を使って、プロトタイピングをより効果的にすることができます。

  • デスクペーパーホルダー。3段ホルダーを推奨します-1つの段には綺麗な紙用、2つ目は作業中のスケッチ用、3つめは完成したもの用です。

Promidesign社の木製のペーパーボード

  • ペーパープロトタイピングキット。キットのなかに方眼紙やテンプレートなど作業を簡単にするものが含まれているときもあります。

グラフペーパー。 画像: tripwiremagazine

iPad用ひな形。イメージ:tripwiremagazine

  • ステンシル。ステンシルを使ってすばやく正確に、ボタンやアイコンを書くことができます。

    iOS用のステンレス。画像: Amazon

重要:良い道具とは高いものを意味しません。実際、高くないペンと紙を使用することが勧められています。なぜでしょうか? それはたとえばモレスキンを使った場合、無意識のうちに綺麗にスケッチ描くことに集中してしまうからです(モレスキンの中に汚いスケッチを置いておきたくないからです)。

4. 鉛筆ではなく、ペンを使う

スケッチをする場合、多くのデザイナーは、スケッチの途中で自分のアイデアに疑問を持ち始め、作業につまずいてしまいます。その結果、視覚化する前にいくつかのアイデアを排除してしまいます。

ペンを使えば、スケッチ完成させる可能性が高くなります。なぜでしょうか? ペンを使えばスケッチを消して最初からやり直すことは不可能ため、ある種の誓約のような役割を果たすのです。

5. 各スクリーンに1つのスケッチを描く

プロトタイプを作成する際に、空きスペースを残し、複数枚に及ぶ内容を1枚の紙で見られるように作ることは魅力的かもしれません。しかしそれは避けた方が良いでしょう。そのようなプロトタイプは検証が非常に難しくなります。スケッチにあまりに多い要素を詰め込むと散らかって見えますし、どの部分がどのセクションに当てはまるのかを理解するのに検証者は苦労してしまうのです。

6. モバイルのプロトタイプから作る

もし商品がモバイルとデスクトップの両方に対応している場合、モバイル版のプロトタイプを先に作成することをおすすめします。スクリーンが小さく制限があるため、なにを優先するべきかをおのずと考えなければいけないからです。先にコンテンツをモバイル用に最適化しておけば、他のビューポートに拡大することが非常に簡単に感じるでしょう。

7. 色の使い方には気をつける

プロトタイプは白黒で書き上げましょう。特定の要素(たとえばボタンなど)を強調するために意図的に色を使いましょう。

さらに、使いたい色を決めたら、ペーパープロトタイピング全体を通してその色を使うことを意識しましょう。たとえば、すべてのインタラクティブ要素は同じ色を使うなどです(たとえば、青はインタラクティブ要素のみに使います)。ユーザビリティテストの際に認知的負荷が軽減されます。

8. ペーパープロトタイプから資料を作成する

忙しい環境の中で、デザイナーや開発者はきちんとした資料づくりのための十分な時間を取れません。ペーパープロトタイピングを使い、その問題を解決できるかもしれません。紙は実体のあるドキュメントなので、デザイナーはデザインの過程でこれを再利用することができます。

Tip:異なるスクリーンやインタラクションのスケッチを取り出し、メモを加えましょう。メモは主要なアイデアを他人に伝える際に役立ちます。さらに、しばらく経って特定のデザインを簡単に思い出すことができます。

イメージ:jasonrobb

9. プロトタイプのデジタルコピーを作成する

ペーパープロトタイプのデジタルコピーを作成すれば、会議へ山のような資料を運ぶ必要がなくなります。携帯で写真を撮ればいいだけです。

Tip:特定のユーザーフローを説明する、GIFアニメーションを作ることもできます。特定のフローに関係するスケッチの写真を撮影し、GIFを作成しましょう。

10. ペーパープロトタイピンプからデジタルプロトタイプを作成する

ローファイなデジタルプロトタイプの場合、基盤に紙のスケッチを使うこともできます。Marvel社のPOPというすばらしいツールを使えば、どんなスケッチもインタラクティブなプロトタイプに変換することができます。

イメージ:Marvel

11. 紙で複雑な効果を作成する

ペーパープロトタイピングの最大の魅力の1つが、視覚効果やインタラクションの模擬実験のために、デザイナーがさまざまな工夫を凝らすことです。たとえば、少しの想像力でモバイルスクリーンのスクロール機能を作成することができます。

ビューポートの枠内で長い紙を引っ張り、スクロールを再現します。イメージ:Csaba Házi氏

さまざまな立面図や影を選ぶことも可能です。影はデザインに現実味を与え、ユーザーや顧客とプロトタイプを検証する際に、よりわかりやすくなります。

イメージ:Google

ペーパープロトタイプでテストをする際のおすすめTIPS

何のためにプロトタイプを構築するのでしょうか? 主な理由は、実際のユーザーで検証を行い、アイデアやコンセプトが機能するかを事前に把握することができるためです。

どのようにペーパープロトタイプを使ったテストを行うかは、詳しく扱うべき幅広い話題です。ここにペーパープロトタイプでテストを行う際に考慮するべき、いくつかの基本事項を記しておきます。

1. 進行役と「ヒューマンコンピューター」の役割を用意する

ペーパープロトタイプでテストセッションを行う計画を立てている場合、各テストセッションには2つの役割が必要です。

  • 進行役(司会者)。テスト参加者に説明をし、やり取りする人です。
  •  「ヒューマンコンピューター」。セッション中話すことはなく、検証者がプロトタイプに反応したときにスクリーン画面を切り替えるなどの役を担います。この役は非常に重要です。テストの効果は、コンピューターを操作する人間が、検証者の示す行動にどれだけ上手く反応できるかにかかっています。

進行役と「ヒューマンコンピューター」の役割を一緒にすることは避けましょう。「ヒューマンコンピューター」と進行役を同時にこなすと、検証者からのきわめて重要な情報を逃してしまいます。

Image: gfycat

2. テストで話す文脈を考えておく

誰かにペーパープロトタイプを見せるときには、デザインの文脈をきちんと相手に理解させることが重要です。そのためテストシナリオと、ペーパープロトタイプがどのように機能するかを明確に説明できることが重要なのです。

以下がセッションを始める前に答えておくべき基本的な質問の抜粋です。

  • なぜこのプロトタイプを作成したのか?
  • このテストセッションで何を得たいのか?
  • テスト参加者からどのような情報が欲しいのか?

3. 最小で5人の異なるユーザーと検証する

もっとも効果的なユーザビリティテストを行いましょう。少なくとも5人の異なるユーザーと検証を行い、さらなる分析のために記録を取りましょう。

まとめ

ペーパープロトタイピングは新しいデザインを速く作成し、検証するのに優れています。正しく使えば、最小の労力で最大の学びが得られます。