UXデザインプロセスとドキュメント作成の手引き - Part 1

[(原文) The Guide To UX Design Process & Documentation – Part 1](https://www.uxpin.com/studio/blog/guide-ux-design-process-documentation-part-1/?utm_source=Blog&utm_medium=qiita&utm_campaign=Japan&utm_content=UX%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9%E3%81%A8%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E4%BD%9C%E6%88%90%E3%81%AE%E6%89%8B%E5%BC%95%E3%81%8D%20-%20%E3%83%91%E3%83%BC%E3%83%881)
By Jerry Cao

*この記事では、一般的な製品設計プロセスと、7つのステージのうち最初の3つのステージで作成する関連ドキュメントについて説明します。これは、厳密なレシピではなく、柔軟なフレームワークであることを意味します。これらの考え方は、電子書籍[「Guide to UX Design Process & Documentation」](https://www.uxpin.com/studio/ebooks/guide-to-ux-design-process-and-documentation/?utm_source=Blog&utm_medium=qiita&utm_campaign=Japan&utm_content=UX%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9%E3%81%A8%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E4%BD%9C%E6%88%90%E3%81%AE%E6%89%8B%E5%BC%95%E3%81%8D%20-%20%E3%83%91%E3%83%BC%E3%83%881)の150ページ以上に渡って、より詳細に説明されています。*

ここでは、製品のデザインと開発のためのドキュメントの概要、構成要素、およびそれぞれの段階について説明します。多くの企業が独自のデザインと開発の原則/方法論に従っているため、開発プロセスとその結果としてのドキュメントは、企業によって大きく異なる可能性があります。しかし、一般的には、以下の成果物の多くは、何らかの形でほとんどの組織に共通しており、私のワイヤーフレームとプロトタイピングの会社である[UXPin](https://www.uxpin.com/studio/design-systems-jp/?utm_source=Blog&utm_medium=qiita&utm_campaign=Japan&utm_content=UX%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9%E3%81%A8%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E4%BD%9C%E6%88%90%E3%81%AE%E6%89%8B%E5%BC%95%E3%81%8D%20-%20%E3%83%91%E3%83%BC%E3%83%881)にも共通しています。


### 各要素の関連性
それぞれの成果物について詳しく説明する前に、製品の設計・開発プロセス全体を俯瞰した視点から、ざっと見てみましょう。

1. **製品定義**の初期段階では、製品やプロジェクトの進め方について、必要なステークホルダー全員と最高レベルでブレインストーミングを行います。その結果、プロジェクトのキックオフプラン、リーンキャンバス、構築しようとしているものの初期スケッチの束などができあがります。

2. **リサーチ**に移行し、チームは前提条件を改善し、不足部分を補う必要があります。この段階は、製品の複雑さ、タイミング、リソース、既存の知識のレベルなど、さまざまな要因によって異なります。しかし、一般的には、競合分析や市場分析を行い、顧客調査を行うのが良いでしょう。また、既存の製品がある場合は、アナリティクス、ヒューリスティック、コンテンツ、製品のコンテキスト、ユーザーテストなどを見直すことも実に有効です。

3. **分析**では、これまでに収集した製品マーケティングデータを下地にして、ペルソナ、エクスペリエンスマップ、優先要求リストやユーザータスクマトリクスなどの要求関連文書を作成します。この時点で、製品の定義、製品の優先順位、製品計画が定義され、より正式なデザイン成果物の準備が整いますが、この間もスケッチやダイアグラムは常に生成されていると思われます。

4. ここでは、スケッチ、ワイヤーフレーム、ローフィデリティ、ハイフィデリティのプロトタイプ作成によるコンセプト化、タスクフロー図、ガイドライン、アセット作成による**デザイン要素**の仕様化などが行われます。例えば、調査・分析で得られた競合分析やペルソナは、モックアップやコンセプトマップ、シナリオの構築に役立ちます。これらは、ワイヤーフレーム、ストーリーボード、詳細モックアップなど、中・上級のデザインアウトプットを生み出すきっかけとなります。

5. **実装時**には、コードとデザインのアセットが組み合わされ、事前に確立された製品設計仕様に準拠した製品が作成されます。

6. **本番稼動後**は、トラブル／サポートチケット、バグレポート、その他の分析結果などのフィードバックデータをもとに、その後の反復、アップグレード、プロジェクトを通じて、製品の開発と改良を進めます。本番モードでは、製品の継続的な成功を確実にするために、データを継続的に生成し、分析やレポートの形で監視する必要があります。

7. データに基づいた製品の継続的な改善は、パフォーマンス・ダッシュボードや分析を用いて本番環境での製品を**測定し、反復**することで実現できます。

## 1. 製品の定義

ステークホルダーとのキックオフミーティング、ブレインストーミング、初歩的な製品スケッチなどの初期活動により、以下のようなアウトプットが作成されます。

- **[プロジェクト・キックオフ・プラン](https://www.techrepublic.com/article/follow-these-steps-to-conduct-an-effective-project-kickoff-meeting/)** - 製品の目的、製品の設計・開発に関わる人、どのように協力して進捗状況を把握するか、意図する結果や成功指標は何かなど、ハイレベルな概要を示したもの。このドキュメントは、チームがより軽快になり、プロジェクトがよりリーンになるにつれ、どんどん短くなっています。パワーポイント、ドキュメント、wiki、またはプロジェクト管理ソフトウェアで提示することができます。
- **リーン・キャンバス** - ビジネスモデル・キャンバスから転用された、製品および市場開発のための実用的な青写真です。解決しようとしている主要な問題、顧客セグメント、独自の提供物、ソリューションの詳細、主要な測定基準などを定義する点で、プロジェクトのキックオフプランと多くの点で重なります。しかし、リーン・キャンバスがより戦略的であるのに対し、プロジェクト・キックオフ・プランはより戦術的であるため、両者はある程度補完関係にあります（[手順はこちら](https://leancanvas_production.s3.amazonaws.com/cms/LeanCanvas.pdf)）。

![](https://studio.uxpincdn.com/studio/wp-content/uploads/2014/11/leancanvas.png.webp)
Source: Why Lean Canvas

## 2. リサーチ
市場における現在のソリューションやその成功/失敗例の特定など、市場の状況を評価します。このような競合分析とその結果としての市場分析は、製品のポジショニングや直接的/間接的な競合の判断に役立ちます。さらに、潜在的なお客様にインタビューを行い、製品の好みに関するデータを収集することもできます。

電子書籍[「UXデザインプロセスとドキュメントのガイド」](https://www.uxpin.com/studio/ebooks/guide-to-ux-design-process-and-documentation/?utm_source=Blog&utm_medium=qiita&utm_campaign=Japan&utm_content=UX%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9%E3%81%A8%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E4%BD%9C%E6%88%90%E3%81%AE%E6%89%8B%E5%BC%95%E3%81%8D%20-%20%E3%83%91%E3%83%BC%E3%83%881)で説明したように、これらの活動を通じて以下のドキュメントが作成されます。

- **[競合他社の配列](https://en.wikipedia.org/wiki/Competitor_analysis#Competitor_array)** - 特定の重み付けされた成功要因に基づいて各競合他社を評価し、結果として競合他社の総合的なランキングを作成するマトリックス。これは、Googleリサーチ、Crunchbaseプロファイル、競合他社の分類、競合他社のオンラインプロパティのドリルダウン、エグゼクティブインタビューなどの活動から作成されます。
- **[SWOT分析](https://en.wikipedia.org/wiki/SWOT_analysis)** - **S**trengths（強み）、**W**eaknesses（弱み）、**O**pportunities（機会）、**T**hreats（脅威）の頭文字をとったもので、競争環境における製品のポジションを評価するために、内部および外部の要因を測定します。フォーカスグループ、統計調査、その他の質的・量的調査に加え、「Competitive Array」の作成にも同じ情報源を多く利用することができます。
- **[競合他社](https://en.wikipedia.org/wiki/Competitor_analysis#Competitor_profiling)のプロファイルまたはランドスケープサマリー** - 競合他社を特定し、構築する製品またはソリューションがどのように競合するか、または競合他社の製品をどのように改善するかを示す分析です。一般的には、競合他社の背景、財務、製品、マーケティング、施設、人員、企業戦略、マーケティング戦略などの重要なポイントを説明します。
- **[市場細分化リスト](https://www.inc.com/encyclopedia/market-segmentation.html)** - 潜在的な顧客やユーザーを、特定の共有されたニーズや特性に基づいて特定のバケットに分ける文書。一般的には、地域別、人口統計学的、行動様式、心理学的、ベネフィット、または前述の組み合わせによって区分される（[説明はこちら](https://en.wikipedia.org/wiki/Market_segmentation)）。
- **調査結果** - 潜在的なユーザー、顧客、競合他社、または特定の製品に関する調査から集められたデータで、ユーザーや顧客のニーズ/懸念を特定し、仮定を検証/反証し、市場に適切に対応するための推奨ソリューションを提供します（ベストプラクティスのヒントは[こちら](https://help.surveymonkey.com/articles/en_US/kb/Design-Tips-How-to-create-and-administer-effective-surveys)）。
- **[Growth-Share Matrix](https://strategicmanagementinsight.com/tools/bcg-matrix-growth-share.html)** - 市場の成長率に対して競合他社の市場シェアをプロットしたチャート（[手順はこちら](https://en.wikipedia.org/wiki/Growth%E2%80%93share_matrix)）。

![](https://studio.uxpincdn.com/studio/wp-content/uploads/2014/11/guidelines_growth-share_matrix_l.jpg.webp)
Source: Growth Share Matrix

以下の場合は、既存の製品、または少なくともプロトタイプが必要です。

[ヒューリスティック評価](http://www.uxforthemasses.com/usability-reviews/) - 既存製品の定性的な分析をエクセルのレポートで作成します。
[ユーザビリティレポート](https://en.wikipedia.org/wiki/Usability_testing) - 製品、機能、または一連の機能の使いやすさをまとめたものです（ベストプラクティスのヒントは[こちら](https://www.uxmatters.com/mt/archives/2010/03/dos-and-donts-of-usability-testing.php)）。
分析レポート - 社内で利用可能なすべてのアクセス可能なデータを使用して既存製品を定量的に分析し、発見事項、仮定、および推奨事項に分けて報告します（分析ダッシュボードのサンプルは[こちら](https://andrewchen.com/the-easiest-spreadsheet-for-churn-mrr-and-cohort-analysis-guest-post/)）。

![](https://studio.uxpincdn.com/studio/wp-content/uploads/2014/11/ChristophJanz_CohortAnalysisNotes.0011.png.webp)
Source: The Easiest Spreadsheet for Churn MRR and Cohort Analysis

## 3. 分析
潜在的な製品がどのように顧客のニーズを満たすのか（そして現在の市場空間にどのように適合するのか）を理解した上で、ユーザー中心のモデリングを行います。 ユーザーを理解し、プロファイリングすることに重点を置き、次のようなアウトプットを行います。

- **[ペルソナ](https://uxmag.com/articles/personas-the-foundation-of-a-great-user-experience)** - リサーチやインタビューから得られたデータをもとに、共通の行動パターンや特徴によってグループ化されたユーザーの集合体。結果として、各ペルソナが製品を使用する際のタッチポイントを詳細に記したドキュメントやレポートが作成されます（手順は[こちら](https://en.wikipedia.org/wiki/Persona)）。
- **[シナリオやユースケース](http://www.uxforthemasses.com/scenario-mapping/)** - 既存のデータやインタビューをもとにブレインストーミングで作成されたもので、ペルソナの「一日の生活」を描写し、タッチポイントや製品への反応をマッピングすることで、ウェブサイトやアプリが彼らの生活にどのようにフィットするのかを含んでいます。報告書には、ビジュアル・ストーリーテリングが含まれることもあります。(説明は[こちら](https://en.wikipedia.org/wiki/Use_case))。
- **エクスペリエンスマップ** - 様々な状況やユースケースにおけるユーザーの体験を詳細に説明します。
- **[優先順位付けされた要求文書](https://en.wikipedia.org/wiki/Requirement_prioritization)** - ビジネスとユーザーの要求が詳細にまとめられ、最小の労力で最短の時間で最大の効果が得られるように優先順位付けされています。
- **ユーザー-コンテンツマトリクス** - ユーザーに関連するコンテンツタイプ、ソース、および処分を特定します。
- **[ユーザー-タスクマトリクス](https://paperprotos.com/category/user-task-matrix/)** - ユーザーのタスクをユーザーごとの使用頻度に合わせてチャート化します。

![](https://studio.uxpincdn.com/studio/wp-content/uploads/2014/11/taskmatrix1.png.webp)
Source: User Task Matrix

## まとめ
つまり、製品開発の各段階で生み出されたアウトプットは、その先の活動のためのビルディングブロックとして機能するのです。

製品設計・開発ドキュメントは、開発の各段階で発生する情報をまとめ、整理し、共有するための手段であるだけでなく、製品の開発履歴を後世に残すものでもあります。これにより、企業はプロセスを改善し、過去の製品の成功を再現することができ、より高いレベルの敏捷性と競争力を得ることができるのです。

さらに詳しい分析は、150ページを超える電子書籍[「Guide to UX Design Process & Documentation」](https://www.uxpin.com/studio/ebooks/guide-to-ux-design-process-and-documentation/?utm_source=Blog&utm_medium=qiita&utm_campaign=Japan&utm_content=UX%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9%E3%81%A8%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E4%BD%9C%E6%88%90%E3%81%AE%E6%89%8B%E5%BC%95%E3%81%8D%20-%20%E3%83%91%E3%83%BC%E3%83%881)をご覧ください。Aarron Walter氏、Laura Klein氏、Ian McAllister氏をはじめとする数多くの専門家のアドバイスが掲載されています。また、Vurb、MailChimp、Apple、Googleなどの企業によるビジュアルな例も紹介されています。

![](https://studio.uxpincdn.com/studio/wp-content/uploads/2014/11/blog.png.webp)


**本記事は2014/10/11投稿、2020/4/22更新を翻訳したものです。**