プロダクトデザインの設計プロセスで役立つ9つのハック

プログラミング文化が発達し、毎日のように新しい製品やアプリが生み出されていますね。それとともに、プロダクトデザインの定義は年々広がりつつあります。

この記事は、プロダクトデザインにおける設計や意思決定に役立つ9つのハックをご紹介します。

Steven Holl Architects / archdaily

プロダクトデザインとは？

プロダクトデザインとは、商品を設計することです。

この場合の商品とは、立体的なもの、または仕組みが必要なものをさします。

平面状で完結するグラフィックデザインに比べ、製品がどのように使われ、どのようなユーザーエクスペリエンスを叶えるかを慎重に考える必要があります。

また、関わる人が多いのもプロダクトデザインの特徴。チームの意思統一や、クオリティ担保においても計画性が必要です。

良いプロダクトデザインのためのハック9まとめ

1. ゴールを定義する

まず、設計チームが目指すべきゴールを定義します。

ページビューや月間アクティブユーザなどの数字を定める人が多いと思いますが、その大半は大雑把な定め方です。

大切なのは、「消費者に利用してもらえているか」という問題へ向き合っていること。

それにかなった目標設定手段のひとつは、複数の指標を組み合わせることです。サービスの利用時間や、利用人数などの指標を、いくつか組みあわせてみましょう。

たとえば以下の方に詳しく定義します。

「1週間で200人のユーザーがページを訪れ、商品を30個購入する」
「100人のユーザーが、この15日間に3回以上アプリを開き、検索する」

チームのマネージャーが働きかけ、中長期的なゴールを共有しましょう。少なくともこの取り決めにより、仮説とその検証ができるようになります。

2. 「80/20ルール」を適用する

「パレートの法則」という名でも知られる「80/20ルール」。これは、世の中の8割はすべて２割の人や要因によって動いているということを示した言葉です。

次のような例が挙げられます。

• 交通量の80％は、道路の20％に集中している。
• 会社の収益の80％は、顧客の20％から得ている。
• 製品エクスペリエンスの80％は、UIの20％が決めている。

このルールを念頭に置いておくと手元にある問題の優先順位を決めやすいです。

たとえば、離脱者の80％がシステムエラーの20％によって引き起こされる場合、システムエラーの解消を急ごうという決断ができます。

ゴールへと向かう正しい道筋を階層ごとに探して、限られた時間とリソースを適切に活用しましょう。

Siim Land

パレートの法則を念頭に置くことで、次の事項が達成されます。

1.  状況、問題、リソース、制約把握した上で設計できる
2.  エネルギー投資する20％の領域を特定し、リソースを割り振る
3.  知識を増やし続け、次のステージのための戦略を立てる

ビジネス戦略からデザインの決定に至るまで全体を通して影響を及ぼすこともあります。

3. 「個性」をデザインする

プロダクトがもつ「個性」は自らのアイデンディティを伝えます。

Minimum Viable Personality / avc.com

この「個性」を得るためには、3つのステップがあります。

(1)  未来のビジョンを立てる

まず、チームの日々の活動が「なにに繋がっているのか」という疑問に対しての答えとしてビジョンを立てなければなりません。

テスラモーターズのスポーツカー「ロードスター」のデザインチームは、プロダクトが目指す方向を世間に発表し、数年後に商品を発表。ファンはその間ずっと待っていたわけですが、テスラ・モーターズは見事のその期待に沿うスポーツカーを完成させました。

Tesla Motors / businessinsider

(2) 製品の詳細を正しく伝える

商品を発表するときは、不足のないよう詳細を伝えましょう。

線、レイアウト、色、言葉、画像、イラスト、インタラクションとアニメーション。そのどれもが重要です。

製品の中心となる特徴と、必要とする機能、製品の魅力は何であるかを、伝えましょう

iPhoneを例にとると、発表当初のiPhoneはいいところばかりではありませんでした。電池の寿命やカメラ機能は弱かったですし価格はとても高価でした。一方で、視聴やWeb観覧、プレイリスト作成などにおける価値はiPhoneがずば抜けていました。これらをすべて説明することで、iPhoneという製品の輪郭が、消費者の頭の中に描かれるのです。

4. ストーリーを話す

ストーリーは人間の本能に働きかけ、製品の印象を強めます。デザインにも物語を取り入れると、ユーザーにとっては情報を理解しやすく、面白味を感じてもらいやすくなります。

簡単な単語を使って、あなたのプロダクトに関する話を伝えましょう。
最大5つの単語を使い「作品の世界」と、その「世界の目的」を表現する必要があります。

上記のように、ストーリーが込められた製品はデータよりも説得力をもちます。

Airbnbの場合、彼らが大切にしているのは信頼です。信頼性を訴えるためにクリーンで美しいデザインを使用し、証明と内容の訴求には、実際のユーザーストーリーを使用しています。

Airbnb

5. 十分な選択肢を提供する。

ヒックの法則によれば、意思決定に必要な時間は選択肢の数が多ければ対数的に増加するのだとされています。

選択肢の数だけ、決定を下す際の負荷が加算されるのです。

話題のトピックだと「FOMO（フォーモー）」に関連づけられます。

FOMOとは、SNSユーザーが、のタイムラインを見逃してしまうことを恐れてしまうという現象のこと。「取り残されるかもしれないという恐怖」を感じて機会損失についての不安を抱くことを意味します。しかし、これはある意味でSNSの製品戦略。結果敵機にユーザーを楽しませているともいえます。

ユーザーに選択させる必要がある場合は、選択肢の数を最小限に抑えるよう設計

しましょう。

Jan Jasinski  / pictame

6. 情報を段階的に開示する

人間の脳は、一度に多くの情報を処理することができません。
ユーザーのに負荷を与えないためにも、徐々に情報を開示する方がよいでしょう。

良い例として、Googleドキュメントのメニューがあります。
Googleドキュメントでは、ドロップダウンを多用しています。
ユーザーを圧倒することなく、テキストを編集するためのコントロールを展開していきます。

このような行動に沿った開示方法は、PCでの標準的な手順とフローが可能ではないモバイルで特に役立ちます。

『Oscar Health』というアプリでは、ユーザーの操作と対話するように情報を開示しています。

関心の度合いを変えることなく、質問から質問へと移り変わるような工夫を考えます。これにより、ユーザーの離脱を防止します。

7. 進行状況とステータスの表示

人は進歩、習得、制御、目標の接近によって動機づけられます。

システム内でのユーザーの位置や状態、タスクを明確に提示するべきです。

次の例を見てください。

『Nextdoor』では、シンプルなタスクリストを使用しています。

Amazonは簡単なプログレスバーを使って発送された商品を追跡しています。発送された商品が、全体の進捗のうちどんなフェーズにいるかを認識できるので、ユーザーを不安にさせません。

8. 変化を動きと伝達する。

モーションのグラフィックスの設計も、インターフェイスデザインの一種です。

アフォーダンスを利用して、システム特徴を伝える直感的なモーションを設計しましょう。

使用する条件に必要に応じて、影や重力、弾力を使用します。
トランジションと3Dの基礎を学び、システムと基礎を学ぶ必要があるかもしれません。

Material motion

9. 5人以上のユーザーでテストする

早い段階で問題を断片的に把握する場合は5人のユーザーに協力してもらいましょう。

N/N

早期のユーザーテストは欠かせません。

まず、1～2日間で簡単なデザインを作り、スプリントを回します。

次に、あなたがここまでのフローで得た情報から仮説を立て、アイデアをスケッチし、プロトタイプを作成し、5人のターゲットユーザーに15分ずつ使用してもらいます。
ユーザーとコミュニケーションをとることで、非常に多くの洞察を得ることができます。

そして、ユーザーから自由な意見を引き出すために「これはサンプルだ」と伝えてください。意見をいうハードルが下がることで実際のプロダクトについて論じられるようになります。

まとめ

利益をもたらすプロダクトを設計するためには、まずは「認知」「行動」「文化」などの世間一般的な原則に基づいて判断してください。

批判的思考で、プロダクトを見つめ続けましょう。

（翻訳：Yuri Tanaka）