プロトタイピング

インサイトに基づき、あるいはコンセプトの段階から自然な流れで、エンド・ツー・エンドのユーザージャーニーを表現する低・中忠実度のプロトタイプを作成します。また、ビジュアルカンプを使用して、ユーザビリティとブランド提案のテストを行うためのインタラクティブなプロトタイプを作成します。プロジェクトがフルデザインに移行する際には、情報アーキテクチャ(IA)とタクソノミーを開発します。プロトタイプの作成と情報アーキテクチャの開発をサポートする方法論は以下の通りです。

ワイヤーフレーミング

ワイヤーフレームは、アプリやウェブサイトのページのレイアウトを示す平面図です。また、グローバルナビゲーション、セカンダリーナビゲーション、ラベリング、構造を示すのにも使用されます。

ワイヤーフレームは、Webサイトやアプリをデザインする際に、比較的簡単に作成できる貴重なツールです。 迅速かつ簡単に作成・変更できる をレビューしています。

アプリやウェブサイトのページがどのように構成されるかを、さまざまなブレイクポイントで設定し、動作やインタラクションを説明するためのメモを付けることができます。ワイヤーフレームは、プロトタイピングの段階に進む前に、デザインについてクライアントの合意を得るために使用します。ワイヤーフレームは、後工程でより複雑なデザインにするよりも、はるかに低コストかつ短時間で調整することができます。

ワイヤーフレームに含まれるもの

ワイヤーフレームを作成する際には、常にプロジェクトのニーズを考慮する必要があります。紙とペンを使ってフリーハンドで作成すれば十分な場合もあれば、さまざまなワイヤーフレームソフトウェアの使用を求められる場合もあります。手書きであれソフトウェアであれ、ワイヤーフレームには以下のような同じコアコンポーネントが含まれます。

  • すべてのページ構成要素のレイアウト
  • インタラクティブな要素
  • 画像とコピー
  • タイトルと見出し
  • ナビゲーションと検索ボックス

を開発するかという選択を迫られています。 ロー、ミディアム、ハイフィデリティプロトタイプ その選択は、それがどのように使われるか、誰と使われるかによります。ローファイワイヤーフレームでは、ブランディングがなく、コピーもプレースホルダーのlorum ipsumで、セクションもページ上に描かれているだけなので、理解するのが難しいという人もいます。忠実度を上げると、より明確になり、ユーザーテストを実施する場合にも非常に有効です。

デザインの決定

当社のユーザーエクスペリエンスデザイナー(UXD)は、ページ上に表示する必要のあるコンテンツ項目を理解するために、お客様と協力します。 また ページゴール 各ページのワイヤーフレームを作成し、レスポンシブ・ウェブサイトやモバイル・バージョンのウェブサイトを設計する場合は、プラットフォーム別にこれらを理解する必要があります。ページゴールは、UXDがコンテンツのレイアウトに優先順位をつけるのに役立ち、小さなスクリーンフォーマットではコンテンツの階層を決定します。

これは ぜんごこうてい この活動は、通常、お客様とお客様のチームと一緒に現場で行います。少なくとも、お客様との詳細なブリーフィングが必要です。そして、デザインプロセスを通じて定期的にお客様と接し、ワイヤーフレームをチェックし、反復しながら進めていきます。

成果物

ワイヤーフレームは、事前に合意されたどのようなフォーマットでも納品されます。ローフィデリティ・ワイヤーフレームの例を以下に示しますが、これは各ページに期待される詳細のタイプです。同じ、あるいは非常に似たレイアウトのページをワイヤーフレーム化しても意味がないため、すべてのページがワイヤーフレーム化されるわけではありません。そのため、納品物はすべてのプラットフォームにおける主要なページで構成されます。

ローフィデリティワイヤーフレームの例

インタラクティブ・プロトタイプ

インタラクティブなプロトタイプは、ページのレイアウトだけでなく、計画されたインタラクションも図解します。最新のプロトタイピングソフトウェアでは、忠実度の高いプロトタイプが可能で、ウェブサイトやアプリの完全な構築バージョンのように見える、感じられるようになります。

デザインプロセス

私たちは、標準的なユーザー・エクスペリエンス・デザインの方法論に従ってプロトタイプを作成するため、ここまでのユーザー中心設計のプロセスのすべてではないにしても、多くの段階がすでに完了しているものと思われます。

つまり、私たちのプロトタイプは、そこから開発されているということです。

  • を明確に理解すること。 ユーザー要求 命題について
  • 命題の検証 ユーザーとステークホルダーの双方と
  • 充実した内容 ペルソナ 主要な視聴者層を代表する
  • 使用例 と ワークフロー
  • ユーザージャーニー
  • ワイヤーフレーム

これらの項目が揃えば、デザインのプロトタイプを開発することができ、立ち上げに必要な時間は限られたものとなります。

ユーザー調査を容易にするため、ユーザーのゴールをサポートするインタラクションを含む、もっともらしいシナリオに基づきプロトタイプを作成します。

を使用しています。 25:50:20:5 試作品開発へのアプローチ。

があります。 とば口 は、25%ほどのプロトタイプを作成し、クライアントからフィードバックを得て、正しい方向性を確認します。その後 昂じる 75%の設計作業が完了するまで、そして、その設計作業を完了するまで 再調査.この後、プロトタイプを フルフィニッシュバージョン のために、さらに5%の時間を確保してください。 紆余曲折.

また、私たちは、以下のような仕事も経験しています。 アジャイルチーム(またはリーンUXチーム と、UXDリソース(研究リソースも)を提供します。

プロトタイピングソフトウェア

当社のシニアUXデザイナーは、以下のような一般的な製品を含む、さまざまなプロトタイピングソフトウェアに精通しています。 Axure RPインビジョンオムニグラッフルスケッチ などなど、HTMLでもOKです。クライアントがすでに使っているソフトウェアでプロトタイプを開発する方が簡単だと思うので、私たちは喜んでそれを行います。

これらのソフトウェアの多くは、モバイルの画面サイズに合わせてリサイズする機能を備えているため、複数のプラットフォーム向けのプロトタイプを迅速かつ効率的に作成することが可能です。また、共有機能を備えているため、開発中やデザインプロセスの終了時に、クライアントと成果物を簡単に共有することができます。

CASE STUDY

大手小売業のクライアントから、彼らが計画しているユーザー調査のためのインタラクティブなプロトタイプの制作を依頼されました。彼らはフラットなデザインを持っていたので、それをもとにクリック可能なホットスポットを作成し、インタラクティブにすることができました。これにより、時間とコストが大幅に削減され、ユーザー調査に必要なすべてのフィードバックが得られました。

ユーザージャーニーレビュー

プロトタイプの作成に必要な情報が含まれていることを確認するため、ユーザージャーニーを独立した立場でレビューするデスクリサーチが行われます。また、この調査は開発とプロトタイプテストのためのジャーニーの優先順位付けに使用されます。

これは、私たちがプロトタイプの作成を請け負う場合でも、クライアントチームが自社で作成する場合でも、重要なステップとなります。すべてのユーザージャーニーを詳細にレビューし、以下のような独立した分析を行います。

  • があります。 ホリスティック・ユーザージャーニー
  • があります。 タッチポイント と チャンネル と、入出力のセンスチェック
  • があります。 ワークフローとプロセスステップ を中心に、特に代替交通を

ユーザージャーニーにおける重要なステップの間や、ジャーニーにおけるマイクロインタラクションの改善点を明らかにします。

また、ユーザージャーニーのどの部分がユーザーテストから最も恩恵を受けるか、テストセッションをサポートするために必要な詳細情報を評価します。このようにして、私たちは以下をサポートします。 プロトタイピング活動の優先順位付け を必要とし、効果のないテストセッションを避けることができます。これは、プロセス内のステップの欠落、他のプロセスにとって重要なインタラクションの未構築、ユーザーの行動に関する思い込みの結果である可能性があります。

プロトタイプのユーザビリティテストの豊富な経験をもとに、クライアントチームや自社のチームの時間とコストを削減するための方向性を示します。

ケーススタディ:ユーザージャーニーレビュー

社内チームと協力し、ユーザージャーニーを提供し、社内チームがプロトタイプを開発する前に、専門家によるレビューを行うよう依頼され、その後、ユーザーによる評価を行うことになりました。私たちのフィードバックにより、社内チームはテストが必要な主要なユーザージャーニーに焦点を当て、これまで明らかにされていなかったフローの問題にも対処することができました。

プロジェクトがおありですか?