優れたUIデザインを作る為に重要なことは何か

こんにちは、だいきです。
また勉強になる海外のUIに関する記事を見つけたので翻訳してみました!
(この記事は Visual StudioというブログのWhat’s Important in UI Designという記事の翻訳ブログです。)

最近「ユーザーインターフェイスのデザインはオプションでなくなった / “Good UI Design Is No Longer Optional”」という記事が話題となり、
多くのUIデザインは人間の目の構造をもとに作られていると指摘されました。
(参照: “Good UI Design Is No Longer Optional”)

ユーザーインターフェースがデザインのオプションでなくなったということは事実ですが、Webサイトの全体像を構築した後下のような質問が出てくると思います。

どんな画面/ フォーム/ ウィンドウ/ ダイアログを作れば良いのか?
どうやってユーザーにある場所から他の場所まで移動してもらえるか?
サイトの左上には何を配置するべきか?
どこにボタンがあるべきか?
ボタンとトグル、どちらが必要か?

これらの質問に対する答えは、あなたのアプリケーションの成功には不可欠です。
そしてこれらの質問に対する回答は、二つの原則に基づく、2つのカテゴリに分類されます。

習慣

photo credit: mendhak via photopin cc

上記の質問に対する答えの一つは簡単です。
例えばWindowsでは、ダイアログボックスに[OK]ボタンと[キャンセル]ボタンがあります。
そしてボタンはダイアログボックスの右下にあり、[OK]ボタンが左側、[キャンセル]ボタンは右側にあります。

なぜか?
それはユーザーがそうなることを期待しているからです。
なぜか?
マイクロソフトでは、そのように一貫しているからです。

このアプローチには、時々反論があります。
「Microsoftはそれをやるからといって、それが正しいとは限らない」
実際に、それが正しいという訳ではありません。
しかし、MicrosoftのUIデザインチームが続けてきた習慣によって、あなたのWebサイトに訪れるユーザーが期待するものが教育されてしまっています。
あなたのユーザーの期待と戦うことができますが、あなたがそれを実行したとして、彼らにどんなメリットがあるのでしょうか?

UIを設計するときには、あなたが構築しているものに最も近いのユーザーコミュニティの間で最も人気のあるアプリケーションを見つけて、それをコピーします。
もっと具体的に話すと、Amazonなどの普段よく使うWebサイトからできるだけ多くのUIデザインを盗むということです。

 

次に何が来るか?

photo credit: rajue via photopin cc

上記の「習慣」という解決策が最初に挙げた “どんな画面/ フォーム/ ウィンドウ/ ダイアログを作れば良いのか?”  などの質問に対する唯一の解決策であると思います。

しかし、まだ答えられていない重要な質問が残されています。

  • 「どんなフォームを持つべきか?」
  • 「どうやったらユーザーと一緒にうごけるのか?」
  • 「各フォームにはなにがあるべきか?」

次の原則を理解することは、究極のユーザーインターフェースとは何かということを考えることから始まります。

・一つのボタンと説明文でできている
・ボタンをクリックして、タスクが処理される

これの基準がシンプルで完璧なUIを作り出し、常にユーザーに次に何をすべきかをわかってもらえます。
この基準通りであれば、あなたのサイトは優れたUIのWebサイトです。

ユーザーがドロップダウンリストの横にある下向きの矢印が何を意味しているものか(どのように動かすか)を知っている場合は、あなたのWebサイトのUIで、その知識を活用することができます。
しかし、ユーザーがどんな習慣を持っているかに注意しなければいけません。

また、ユーザーは他で得たUIの習慣を持ったまま、あなたのサイトに訪れることもあります。
通常はユーザーは何を達成したいか、それを達成するにはどんなタスクが必要かを知っています。
そしてあなたのWebサイトのUIデザインでユーザーに直接、タスクとゴールを示します。

 

ユーザーの為のUI設計

photo credit: ntr23 via photopin cc

多くのデベロッパーがUIを設計に重きを置いていません。
デベロッパーは「ユーザーがこの1つの画面から、したいことは何でもできる!」と自慢します。
しかし、ユーザーはある特定のタイミングで特定の1つの事をしたいのです。

あなたの目標は、ユーザーが自分の目標を達成することを可能にするUIです。
つまり、ユーザーは複数の画面を通して、今やりたいことを実現する為のガイドを必要としています。

下記がUIを構築するための最初のステップです。
1, アプリケーションのユーザーが誰であるかを理解する
2, ユーザーの目標が何であるかを理解する
3, それらの特定のユーザーがこれらの目標を達成するためにどんなタスクを期待しているか考える

これらは効果的なUIデザインの二つ目の原則に繋がります。
UIを構築する上での最初の仕事は、あなたのアプリケーションを理解することではなく、ユーザーを理解することです。

以上です。
いかがでしたでしょうか?
ここに書かれていたいたことは一見当たり前のことのように思えますが、実はとても重要なことなんですよね。
勉強させていただきました。

ABOUTこの記事をかいた人

小川大樹

プロジェクトマネージャー/ UXデザイナー 受託事業を担当し、新規事業案件やリニューアル案件、数値改善プロジェクトなど様々な案件に携わる。
  • Goodpatch Blog