プロダクトデザイン完全ガイド – デジタル製品をデザインする

多くの人にとって “使いやすい” デジタル製品がある一方で、使いづらくてイライラしたりするデジタル製品に違いがあることを不思議に思ったことはありませんか。それは、「効果的なデジタル製品のデザイン」が鍵なんです。

そこで、このガイドでは、UX（ユーザーエクスペリエンス）、プロトタイプ、反復開発の重要性に焦点を当て、デジタル製品のデザインプロセスを包括的に解明します。また、プロダクトデザインで避けるべきよく起きやすい落とし穴も見ていきます。

主なポイント：

プロダクトデザインとは、ユーザーニーズ、ビジネス要件、技術的制約に沿ったデジタル製品のインタラクティブなインターフェースを作成するプロセスである。
プロダクトデザイナーとは、製品のデザインをつくる担当者のことであり、この仕事をするには、学位の取得やコースの受講、プロダクトデザインに関する知識がある。
プロダクトデザインには特徴的なステップが５つあるが、それは直線的なプロセスではなく、プロダクトデザイナーは、新たなインサイトを発見した場合に特定のステップに戻ることがある。
そのステップの１つとして、コードで製品を構築する前に、行動やユーザージャーニーを示す製品のインタラクティブなモックアップを作成する「プロトタイプ」である。
うまくいくプロダクトデザインは、UXライティングを重視し、エラーの管理、ユーザーに焦点を当て、イテレーションを真剣に行う。プロダクトデザインの成功例としては、 Apple が挙げられる。

本記事では、日常生活で役にたつデジタル製品をつくることに情熱がある全ての人に向けて、決定的なリソースの提供を目標としています。

革新的なMergeが持つ技術によって、製品開発プロセスを10倍速くデザインしてみましょう。インタラクティブなコンポーネントをドラッグ＆ドロップするだけで、最終製品のように動作し、デザインシステムに従った完全な機能性を持つプロトタイプを構築できます。詳しくはこちらのページをぜひご覧ください。

プロダクトデザインとは

デジタル製品のデザインとは、人が抱える特定のニーズや問題に対応するソリューションを生み出すことであり、以下は、デザイナーが従うべきプロダクトデザインのプロセスです：

ターゲットユーザーについて知る – 誰に向けてか？どのように行動するのか？何が好きで何が嫌いか？など。
ユーザーが直面する課題を特定する
その課題に対する潜在的な解決策をブレインストーミングする
自身の製品が観客の生活にどのようにフィットするかを見出す
デザインをテストし、実際に使うであろう人達からのフィードバックを集める。

プロダクトデザインについての詳細やそのステップについては、こちらの記事をお読みください：基礎が学べる！プロダクトデザインとは？

プロダクトデザイナーと UXデザイナー

プロダクトデザイナーとUXデザイナーは、どちらもデジタル製品の開発において重要な役割を担っていますが、共通点はあるもののまったく別の職種です。

UXデザイナーは、主に「製品がユーザーにとってどのように感じられるか」に焦点を当て、デザインプロジェクトの初期段階では、ユーザーの行動を研究して、彼らのニーズや動機を理解することに取り組みます。

また、UXデザイナーは、直感的で親しみやすいユーザージャーニーを作ることを目標としているので、各ステップの流れを注意深く考えます。ユーザーが確実に最も簡単な方法で目標を達成させたいという思いで、デジタル製品をより使いやすくするためにも認知心理学の原則をデザインに取り入れることもあります。

一方、プロダクトデザイナーは、UXのみならず、ビジネス目標や技術的制約も含めた幅広い役割を担っています。

最初のアイデアから最終的な実装まで、製品開発のあらゆる面に関与し、大局的な視点に立って、それぞれのピースが全てどのように組み合わさり、一貫した全体像を作り上げるかを考えます。これには、「製品がどのように見えるか」の　UI（ユーザーインターフェース）、「どのように機能するか」のインタラクションデザイン、「より大きな市場にどのように適合するか」などが含まれます。

つまり、UXデザイナーがユーザーの「ジャーニー」と「エクスペリエンス」に焦点を当てるのに対し、プロダクトデザイナーはビジネスや技術的な側面も含め、全体的な視点から製品全体を考えます。どちらもユーザーに愛される製品を作ることを目指しますが、そのアプローチや焦点を当てる領域は微妙に違います。

詳しくは、「プロダクトデザイナーと UX デザイナーの比較分析」の記事をお読みください。

プロダクトデザインの方法

ここでは、ユーザビリティをデジタル製品のデザインプロセスの中心に据えるための５つのステップについて見ていきましょう。

ステップ１：ユーザーに共感する

これは言うまでもなく、プロダクトデザインにおいて最も重要なステップです。ユーザーを理解することは、彼らの属性を知り、共感することでもあります。つまり、ユーザーが持つニーズ、習慣、フラストレーション、欲求など、自身の製品に関連するものを見つけるということです。

そのために、インタビューやアンケートの実施、実際環境でのユーザーの観察などを行います。ユーザーについて知れば知るほど、彼らの生活に親しみやすくフィットする製品をデザインするのに有利になりますからね。

ステップ2：問題の特定

ユーザーを理解したら、次のステップは「直面している問題の特定」です。

ここでは、ユーザーとの共感から得たインサイトを、ユーザーが経験している主な問題を捉えた明確な「問題ステートメント」に変換します。

そのステートメントは、指針となるべく明確かつ具体的である必要がありますが、過度に規定的になるべきではなく、柔軟性とクリエイティブなことが非常に重要です。

ステップ３：アイデア出し

このプロダクトデザインのステップでは、できるだけ多くのアイデアをブレーンストーミングすることが重要です。創造力を解き放ち、特定された問題を解決するためにできそうな方法を色々と考えてみましょう。

マインドマップ、スケッチ、ストーリーボードなどのツールで、頭に浮かぶアイデアを視覚化することができます。この時に、実用性や実現可能性は気にしないでください。目標は質ではなく量であり、アイデアが多ければ多いほど、次のステップのためのより多くの素材が得られます。

ステップ４：プロトタイプ

ここでは、浮かんだアイデアを実際に「プロトタイプ」を作成し、 ”製品のミニバージョン” として見てみましょう。

最初に、大まかなスケッチなどのペーパープロトタイプから始めます。これによって、時間やリソースをあまりかけずに、製品がどのように機能するかを簡単に確認することができます。

基本的な機能が十分だと思ったら、忠実度の高いプロトタイプに進みます。これはより詳細でインタラクティブなもので、最終製品がよりよく表現されます。

ステップ５：テスト

最後のステップでは、製品がデザインされた目的であるその「問題」が実際に解決されているかどうかを確認します。

プロトタイプを実際のユーザーに触れてもらい、様子を観察しながらフィードバックに耳を傾けましょう。

このステップは、学んで改善するためのものであって、自分が正しいことを証明するためのものではないということを覚えておいてください。問題があったとしても落ち込まず、製品を改良するチャンスととらえる機会として考えましょう。

こちらのトピックについては、「How to Design a Product in 5 Steps」（英語）の記事をご覧ください。

製品の UXデザインでの一番のコツ

以下のポイントをおさえておくことで、製品のUX 向上につながるはずです。

UXライティングを無視しない

UXライティングで、デジタル製品のための明確で有用なテキストが作られ、それによって混乱は減り、ナビゲーションは強化されます。ここでは、UXライティングでの絶対おさえておくべきコツを５つご紹介します：

コピーは短く簡潔に：目的は「必要な情報をできるだけ少ない言葉で伝えること」である。
最優先はアクセシビリティ：全ユーザーが理解しやすい文章にし、専門用語や口語体を避ける。
ビジュアルやフォーマットを使ってわかりやすく：言葉で説明するよりも画像で説明した方がわかりやすい場合は、画像で説明し、大きなコピーの塊は、より短く、より読みやすいリストに分ける。
能動態を使う：それによって文章がわかりやすくなる。
ストレートに話す：気の利いたことやユーモラスなことを使いすぎない（まわりくどくなりすぎない）ようにする。

常にデザインをテストする

常にデザインをテストすることは非常に重要です。そうすることで、製品の見た目だけでなく性能も上がって、ユーザーの期待に応えられるようになりますからね。

その際は様々なテスト方法を取り入れるといいでしょう。ターゲットユーザーを代表するユーザーからフィードバックを集めたり、オンラインプラットフォームを使って多くのリモートユーザーにアクセスしたり、詳細なインサイトを得るために対面パネルを実施したりしましょう。

早期のテストだと、まだ修正しやすく費用対効果の高い段階で問題が見つかります。そしてこれと同じくらい重要なことですが、早期のテストで優れたUXの提供に集中し続けることができ、最終的にユーザーに評価され愛される製品につながります。

ユーザーの行動を定期的に観察する

デザイナーとして、ユーザーが直感的に製品を理解してくれると思いがちですが、このようなミスを避けることで、ユーザーの行動を常に観察しましょう。ユーザーのインタラクションをモニタリングすることで、予期せぬ行動や誤解を発見することができ、現実を確認することができます。

テストは大規模である必要はありません。たった５人のユーザーでの検証でも製品が持つ７５％の問題が見つかることがあり、最終的に製品の直感性と使いやすさを知る上で役に立ちます。

ユーザーエラーに対処する

プロダクトデザインには、ユーザーのエラーに対処するための重要なステップが以下のように２つあります：

ユーザーがミスをしたときに手を差し伸べる。
UX を微調整するためにエラーを分析する – 例えば、ユーザーがフォームに記入する際に［必須事項］を見逃した場合、明確なエラーメッセージがそのユーザーを導くはずであるが、多くのユーザーがミスから立ち直れない場合は、デザインに見直しが必要である。

ユーザーの技術スキルやデバイスはさまざまであるため、あるユーザーにとっては些細な不具合でも、別のユーザーにとっては大きな障害になる可能性があることを忘れてはいけません。そのような障害を最小限に抑え、誰にとっても使いやすい体験を保証することがデザイナーの役割ですからね。

変更は徐々に加える

製品に変更や改良を加える場合は、すべてを一気に加えない方がいいです。

というのも、一度に多くの変更を加えてしまうと、どの変更がうまくいって、どの変更にさらなる微調整が必要かの判断が難しくなってしまうからです。

別の言い方をすれば、調整を１つ２つするだけで、解決しようとした問題がその変更で解決されているかどうかや、ユーザーがその変更を理解し、有益だと感じているかどうかを観察することができます。このアプローチだと、それぞれの変更の有効性を明確に把握することができるのです。

製品の UXデザインに関するヒントをお探しの方は、こちらの記事でも詳しく説明していますので、ぜひお読みください：「Best Tips on Product UX Design」（英語）

プロダクトデザインのためのプロトタイプの一番のコツ

プロトタイプとは、製品の基本的な機能を示す簡単な模型のことで、これによって製品のアイデアを現実のものにすることができます。この重要なデザイン段階を最大限に活用するためのコツを以下でご紹介します。

プロトタイプで何を見せるかを決める

プロトタイプのデザインを始める前に、以下の重要なステップに従いましょう：

プロトタイプに必要な機能について合意する。
主要なステークホルダーがプロトタイプで確認したいことを明確に理解する。
デベロッパーと製品の機能について話し合い、潜在的な技術的問題を特定する。
そのプロトタイプが現実的に完全な製品にできるかどうか、本当のビジネスチャンスになり得るかどうかを考える。

このような情報を前もって集めることで、プロトタイプのデザインが明確になり、時間とリソースの節約になります。

時間的なプレッシャーがある場合は、協働的ラピッドプロトタイピングを利用する

厳しい納期に追われている場合、ラピッドプロトタイピングでテスト段階がより早く進みます。

これは、最短１日で製品の実用的なモデルを作成するという考えです。出来上がったプロトタイプは通常、より簡素で洗練されてはいませんが、「構築、テスト、改良、繰り返し」というサイクルである反復的なデザインに重きが置かれています。

プロダクトデザイン完全ガイド - デジタル製品をデザインする - UXPin Mergeで製品プロセスを改善できる

デジタルホワイトボードや、再利用可能なコンポーネントでプロトタイプを作成できる「Merge テクノロジー」が搭載された UXPin のような協働的なプロダクトデザインツールを使うと、チームメンバーは一緒に作業しやすくなり、それによって、お互いにアイデアを出し合いやすくなり、実行可能なデザインをより早く思いつくことができます。詳しくはこちらをご覧ください。

忠実度を選ぶ

「忠実度」として知られる特性である「プロトタイプをどの程度詳細かつ最終バージョンに近づけるべきか」を決定する際には、プロトタイプを誰に見せるのか、またデザインプロセスのどの段階にいるのかを考える必要があります。

シンプルなスケッチや基本的なワイヤーフレームのような 低忠実度プロトタイプは、社内のデザインチームのレビューには十分であり、通常は、同僚がアイデアを視覚化して議論を喚起するのに十分なものです。

高忠実度プロトタイプはもっと洗練されたもので、見た目や動作が最終製品に近いものであり、ターゲットユーザーからのフィードバックを集めるのに適しています。

中忠実度のプロトタイプは、デザインチームの一員でもターゲットユーザーでもないステークホルダーやチームメンバーに見せることができ、そのプロトタイプに含まれる詳細レベルは、低忠実度と高忠実度の中間です。

プロトタイプを実際のユーザーにテストしてもらう

同僚と機能デザインのテストをすることは有益かもしれませんが、実際のユーザーが直面する問題が見逃される可能性があります。

だからこそ、最終的に完成品を使うことになる人達にプロトタイプをテストしてもらうことが非常に重要になります。

前のセクションで述べたように、テストを行う前に、基本的で忠実度の低いプロトタイプを使うのか、より詳細で最終製品に近いものを使うのかを決める必要があり、そしてその決定は、どのようなフィードバックを求めているか、テストから何を学びたいかに影響します。

また、それでエンドユーザーのペルソナや、彼らが製品を使用するシナリオを特定することができ、それによって使用状況の理解や、それに応じたテストの計画を立てられるようになります。

実際に会ってテストすれば、ユーザーの反応を見たり質問をしたりできるので、より詳細なフィードバックが得られます。あるいは、より多くの潜在的なユーザーと関われるオンラインでのプラットフォームを利用するのもいいでしょう。

以下の記事に、プロトタイプのプロダクトデザインのヒントがさらに５つ紹介されています： プロトタイプのプロダクトデザイン – ９つのヒント

デジタル製品のデザインのベストプラクティス

Apple

Apple は、「多様なユーザーのニーズを念頭に置いてデザインし、アクセシビリティとユーザビリティを上げるために製品を常に改良している企業」の輝かしい例として際立っています。

視覚に障がいがある人のためにナレーション、ズーム、点字サポートなどの機能を提供しており、それによって、ユーザーは画面上や周囲の環境を理解することができる。
聴覚に障がいがある人のために字幕が用意されており、動画から会話まであらゆるものに対応している。また、こうしたユーザーが聞こえやすくなることを目的とした特注の機器も製造している。
音声ナビゲーションや目の動きで操作できるデバイスなど、運動面にハンデがある人に対応する機能を備えている。つまり、ユーザーはデバイスに触れることなく操作できるということである。
認知的な課題は、気が散るようなバックグラウンドノイズや視覚的なものをフィルタリングできるような、思考を凝らしたデザインによって解決されている。

プロダクトデザイン完全ガイド - デジタル製品をデザインする - Apple — 画像出典: Apple

Discord

コミュニケーションプラットフォームである「Discord」は、当初はゲーマーが簡単に交流できるようにデザインされましたが、その後拡張され、現在ではユーザーがさまざまなトピックについて話し合うことができるようになりました。気が散ることなく使えるほどシンプルなデザインでありながら、特定のユーザーのニーズに応えるのに十分な深みも備わっています。以下に特徴を挙げてみましょう：

「サーバー」やチャットルームに参加したり、作成したりする機能があり、それは大規模な公開グループにも、小規模なプライベートグループにもなれる。
サーバー内に「チャンネル」を作り、それによって、さまざまなトピックに関するディスカッションを分けて整理しておくことができる。
ダイレクトメッセージや「Ping（通知）」により、個々のユーザーと迅速かつプライベートなコミュニケーションができる。
ユーザーは音声または文字によるコミュニケーションを選択できる。
カスタマイズ可能な UI（ユーザーインターフェース）により、文字、絵文字、ユーザー名、アイコンを好みに合わせて個別化できる。

TikTok

大人気なこのSNSアプリは、そのユニークなデザインでUXを一変させました。

それには、没入型視聴のためのフルスクリーン配信、明確なインタラクティブ機能、個別化された短いコンテンツのエンドレスストリーム、多様なユーザーニーズに対応する機能などが含まれます。

このようなデザイン要素と、自動キャプションや写真感度の警告などのアクセシビリティオプションの追加により、TikTokは世界的に人気があって使いやすいアプリとなりました。そしてその成功は、思慮深いプロダクトデザインの重要性を裏付けています。

ちなみに今回は、５つある最良のプロダクトデザイン例のうち３つだけを取り上げました。

良くないプロダクトデザイン例とその理由

前のめりなポップアップ

Webサイト上ですぐに表示されるポップアップは、ユーザーにとって大きな反感を買う可能性があります。何が提供されているのかを探るチャンスさえ与えられないうちに、ニュースレターへの登録や何かのダウンロードを要求されるのですから、これは邪魔で不快なものになりかねませんよね。

ここでは、「サイトを訪れる人は、多くの場合は限られた時間と注意力の中で答えを求めている」ということを頭に入れておくことが重要です。ポップアップに振り回されると、せっかくの体験が台無しになり、別の選択肢に行かれしまうかもしれませんからね。

もちろん、ポップアップが全て悪いというわけではありません。タイミングが重要なのです。ユーザーを説得して追加サービスやキャンペーンに申し込ませようとする前に、まずはコンテンツに興味を持ってもらう方が良いですよね。

ややこしすぎるナビゲーション

例えばAWS（Amazon ウェブサービス）は、クラウドコンピューティング・サービスを幅広く提供する人気のプラットフォームですが、その使い方はすごく難しいです。

製品のタブをクリックすると、大量の選択肢が表示され、特にモバイルではスクロールし続けなければならず、圧倒されることがあります。これだとユーザーはイライラしてしまい、必要なものが見つかりにくくなります。

AWSのデザインは美しいですが、使いづらいナビゲーションはUXを向上するためにも改善する必要があります。そうすれば、訪問者が探しているものを見つけられず、すぐにサイトから離れることもなくなるでしょう。

差別的な表現に気をつける

プロダクトデザインにおいて、意図していなくても特定のユーザーグループに差別的な印象を与えてしまうケースがあります。

プロダクトデザインのよろしくない例については、こちらの記事（英語）で紹介されています。

就職に役立つプロダクトデザインの学位

プロダクトデザインやUXデザインなど、デザインのキャリアにつながる道は主に３つあります：

１．学士取得

大学でデザインの学位を取得すれば、この競争の激しい分野で他より優位に立つことができます。

大学では、色彩、タイポグラフィ、レイアウト、アイデアコミュニケーションなど、あらゆる専門分野を総合的に学ぶことができ、プロの世界で高く評価されるフィードバックの授受のスキルも養うことができます。

また、プログラミングの学位を取得すれば、プロダクトデザインに影響を与えうる技術的制約を理解することができることから、プログラミングの学位も検討の価値アリです。

（＋デザイン学位の主なメリットとして、より高い給与につながる可能性がある点です。）

ただし、コースに入るためには事前にポートフォリオの提出を求められます。その他にも、学費は高額になる傾向があり、学位取得修了までに長い時間がかかるという点も考慮した方が良いでしょう。

２．独学

独学は、実行可能で柔軟なルートです。（…自分で管理できるならの話ですが。）

Don Norman氏の「The Design of Everyday Things（日常品のデザイン）」のような本は、人間中心のデザインに欠かせないインサイトを与えてくれますが、プロダクトデザインは複雑であり、ただ読むだけでは不十分です。そのためメンターシップ、インターンシップ、オンラインコースなどを通して業界の専門家から学ぶことは非常に貴重なものとなります。

また、人脈作りも重要です。将来役に立つかもしれないので、同級生や業界関係者とのつながりを維持しておきましょう。

参考になる資料には以下のようなものがあります（英語）：

３．デザインのブートキャンプコース

デザインブートキャンプでは、選択した分野で短期間で学ぶことができます。

このようなプログラムは、対面式、オンライン、またはハイブリッド（半々）で受講することができ、奨学金や後払い制度を設けているところもあります。

新卒者であれ、キャリア転換を目指すプロフェッショナルであれ、ブートキャンプコースによって効率的にこの分野に入ることができ、知識のギャップを埋めることができます。

以下に、コースをいくつか挙げてみましょう（英語）：

プロダクトデザインのキャリアについてのより詳しいガイダンスについては、プロダクトデザインプログラムの記事をお読みください。

プロダクトデザインに関するオススメ書籍

以下４つの作品は、プロダクトデザインの分野に興味がある人にとって必読です。

「Hooked: How to Build Habit-Forming Products」Nir Eyal著

この本では、多くの成功した製品で使われている４つのステップである「フック・モデル」に焦点を当て、ユーザーを惹きつけて離さない製品を作るための貴重なインサイトを提供しています。

「Lean Startup」Eric Ries著

価値主導の製品を生み出すためのリースのガイドは、デザイナーにとって必読ともいえます。ビジネス戦略やユーザーニーズに最適なデザインを迅速にプロトタイプ化して、テストおよび反復する方法を教えてくれます。

「Laws of UX: Using Psychology to Design Better Products & Services」Jon Yablonski著

この本では、UXデザインにおける人間心理に重点が置かれ、広く使われているアプリの例を使い、使いやすい製品を作るために心理学の原則を適用するための実践的なガイドを説明しています。

「Continuous Discovery Habits: Discover Products That Create Customer Value and Business」Teresa Torres著

この本では、製品やサービスがユーザーにとって適切で価値のあるものであり続けるために、デザインにおける継続的な革新の重要性に焦点を当てています。

上で挙げた本などの詳しいレビューはこちら： Product Design Books that Will Push Your Skills Forward

デジタル製品においてのデザインの極意

デジタル製品のデザインは、機能性、ビジュアル、ユーザーニーズのバランスを取る必要があることから、多様で複雑な分野です。

今日のデジタル時代において、ユーザーにとって自然と「また使いたい」と思える製品をデザインすることの重要性は多くの場所で語られています。デザイナーとして、あなたの仕事が誰かの人生に大きく影響を与えるかもしれませんからね。

このブログで、みなさんがデジタル製品においての「デザイン」について多くのインサイト得られ、単に便利で見栄えがいいだけでなく、本当にユーザーにとって豊かな体験につながるデジタル製品を生み出せるようになりますように。

UXPin Mergeのテクノロジーを使って、実際にクリックできる製品のプロトタイプを作成してみましょう。UXPin Mergeでは、デザイナーとデベロッパーが「信頼できる唯一の情報源（Single source of truth）」を使えるため、プロダクトデザインを最初から共同作業で行うことができます。Mergeで製品をより早くリリースしましょう。14日間の無料トライアルはこちらより。

プロダクトデザイン 完全ガイド – デジタル製品をデザインする

プロダクトデザイン とは

プロダクトデザイナー と UXデザイナー