見出し画像

UIデザインプロセス

今日は私の過去の「デザトレ!」について共有したいと思います。今回は「クリエイティブプロセス」と「UIデザインプロセス」の2つのトピックに分けて記事にしました。では、詳細を見ていきましょう。 皆さんもこの中から有益な情報を見つけていただけると嬉しいです。

クリエイティブプロセス

「私に木を切らせてくれ、最初の4時間は斧を研ぐことに使わせてくれ。」― アブラハム・リンカーンの有名な言葉の一つが、どれほどマインドセットが人生のあらゆる側面で重要であるかを示しており、もちろんデザイン分野も含まれます。そこで、私は通常使用するUXに関する3つの人気メソッドを紹介したいと思います:ヒューマンセンタードデザイン、デザインシンキング、そしてダブルダイヤモンドメソッド。

ヒューマンセンタードデザイン

ヒューマンセンタードデザイン(HCD)は、製品やサービスを利用する人々のニーズ、嗜好、行動を理解し、対処することに焦点を当てた問題解決とイノベーションのアプローチです。これはデザインプロセスの中心にエンドユーザーを置き、直感的で効果的で、特定の要件を満たすために調整された解決策を作成することを目指しています。

ヒューマンセンタードデザインの原則は、人間のニーズ人間の問題に焦点を当てることです。

プロセス:

  1. 共感:デザイナーはユーザーの視点、感情、課題を深く理解しようとします。これには直接の対話、観察、フィードバックの収集が含まれることがよくあります。

  2. 繰り返しのプロセス:HCDにはデザイン、プロトタイピング、テスト、ユーザーフィードバックに基づくソリューションの洗練までのサイクル的で反復的なプロセスが含まれています。このサイクルはデザインが効果的にユーザーのニーズを満たすまで続きます。

  3. 協力:HCDは異分野の協力を奨励し、デザイナー、研究者、エンジニアなどを一堂に会して問題を共同で解決します。

  4. ユーザーの関与:ユーザーはデザインプロセスに積極的に参加し、開発サイクル全体で洞察、フィードバック、検証を提供します。

  5. 全体的なアプローチ:HCDは使用性、美的、利用可能性、感情的な影響など、ユーザーエクスペリエンス全体を考慮に入れます。

  6. 創造性:HCDは共感とユーザーフィードバックに根ざしていますが、新しい解決策を開発するために創造的な思考とイノベーションも重視しています。 ヒューマンセンタードデザインの原則は、人間のニーズと問題に焦点を当てることです。

ヒューマンセンタードデザインの目標:製品デザイン、ユーザーエクスペリエンス(UX)デザイン、サービスデザインなどの分野で、機能的であるだけでなく、利用者にとって楽しく意味のあるものを作り出すことです。

デザインシンキング

デザインシンキングは、問題解決とイノベーションの方法論であり、ユーザーの深い理解を強調し、従来の考え方に挑戦し、人間中心のアプローチを用いて革新的な解決策を生み出します。これは複雑な問題に対処し、創造性を促進し、製品デザイン、サービスデザイン、ビジネス戦略など、さまざまな分野で革新的なアイデアを生み出すためによく使用されます。

デザイン思考のフレームワークには次のフェーズが含まれています:共感、定義、発想、プロトタイプ作成、テスト。

プロセス:

  1. 共感:エンドユーザーのニーズ、欲望、課題を理解し感情移入することがプロセスの中心です。デザインシンカーはユーザーの視点から世界を見ようとします。

  2. 定義:問題や課題を明確に定義することが最初のステップです。これには研究、インタビュー、観察を含めて洞察を集める作業が含まれます。

  3. 発想:このフェーズではアイデアのブレインストーミングと幅広い創造的なアイデアの生成が含まれます。アイデアの量と多様性が重視され、斬新な発想を奨励します。

  4. プロトタイプ:アイデアの具現化として具体的な表現を作成し、迅速で手軽なテストが可能です。プロトタイプはシンプルなスケッチからより複雑なモデルまでさまざまです。

  5. テスト:プロトタイプを実際のユーザーでテストしてフィードバックを収集し、解決策を洗練させます。この反復プロセスは、実用的な解決策が見つかるまで続きます。

  6. 繰り返し:デザインシンキングはしばしばサイクル的であり、最良の解決策にたどり着くために複数の反復が必要とされることがあります。各反復はユーザーフィードバックと洞察を取り入れます。

デザインシンキングの目標:組織はこれを使用して革新を促進し、顧客体験を向上させ、複雑な問題を解決します。これは異分野の協力と創造的な問題解決を奨励します。柔軟性と広範な課題に対処する効果的な性能から、デザインシンキングは広く支持されています。

ダブルダイヤモンドメソッド

ダブルダイヤモンドメソッドは、デザインシンキングとイノベーションでよく使用される問題解決とデザインプロセスです。このメソッドは4つの主要なフェーズで構成されています:

  1. Discover(発見): このフェーズでは、手元の問題や課題を徹底的に理解することが目標です。これには研究、ユーザーインタビュー、洞察の収集が含まれ、問題領域を定義するための情報が集まります。

  2. Define(定義): 問題が十分に理解されたら、次のステップはそれを明確かつ簡潔に定義することです。このフェーズでは、収集された情報と洞察を統合して焦点を絞った問題の声明を作成します。

  3. Develop(開発): このフェーズでは、チームは定義された問題に対するさまざまな可能な解決策をブレインストーミングし生成します。創造性と発想が奨励され、複数のアイデアが探索されます。

  4. Deliver(提供): 最終フェーズでは、選択された解決策を具体的な製品、サービス、またはイノベーションに変えることが含まれます。このフェーズでは、解決策が実現可能かつ効果的であることを確認するためにプロトタイピング、テスト、実装が行われます。

ダブルダイヤモンドメソッドは発散的思考(幅広い可能性を探求すること)と収束的思考(最良の解決策に絞り込むこと)を強調しています。これは問題解決に対する構造化されたアプローチであり、イノベーションとユーザーセンタードデザインを促進します。

UIデザインプロセス

ふぅ、では、通常私が使用するUXのマインドセットをすべて通過しました。さて、次にUIのプロセスについて話しましょう。実際、UIをデザインする際には多くのルールがあり、作成方法を選択する自由があります。ただし、私の経験に基づいて、Atomic Designを使用することをお勧めします。

Atomic Designは、要素をより小さく、再利用可能なコンポーネントに分解してデザインシステムとユーザーインターフェースを作成するための方法論です。Brad Frostによって開発され、デザインはモジュール化された体系的なアプローチで行われるべきだという考えに基づいています。

Atomic Designの中心的なコンセプトは、5つのコンポーネントのレベルを中心に回ります。これは、物質の基本的な構成要素と比較されることがよくあります。
プロセス:

  1. Atoms(原子): デザインの基本的な構成要素であり、ボタン、入力フィールド、アイコンなどが含まれます。Atomsは最も小さく、基本的な要素です。

  2. Molecules(分子): 分子はAtomsを組み合わせて作成されます。例えば、検索バー(Atom)と検索ボタン(Atom)を組み合わせて検索フォーム(Molecule)を形成できます。

  3. Organisms(生物体): 生物体はMoleculesとAtomsから構成されたより複雑なコンポーネントです。これは、ユーザーインターフェースのセクションやモジュールと考えることができます。例えば、ヘッダーやナビゲーションメニューです。

  4. Templates(テンプレート): テンプレートはページのレイアウトと構成を定義する高レベルな構造です。さまざまな生物体、分子、原子から構成され、特定の方法で配置されています。

  5. Pages(ページ): ページはテンプレートの最終的で具体的なインスタンスで、実際のコンテンツが含まれます。これがウェブサイトやアプリケーション上でユーザーが見て、対話する内容を表します。

このモジュール化された方法でデザインに取り組むことで、Atomic Designはデザインおよび開発プロセスでの一貫性、拡張性、再利用性を向上させることができます。デザイナーや開発者はより効率的にデザインシステムを作成し、メリハリのあるユーザーフレンドリーなインターフェースを実現できます。

結論

以上が私のUIデザインを作成するためのマインドセットと方法です。これらが必ずしも正しいわけではありませんし、他にも多くのデザイン手法があります。ご自身の考えを共有していただき、もし、さらに良い手法があればご教示お願いします。お読みいただきありがとうございました!


この記事が気に入ったらサポートをしてみませんか?