デザイン

UI/UXって何?ノンデザイナーのためのUIUX入門

UIとUXって最近よく聞くけれど、それぞれどんな概念で違いは何なのか、という疑問にお答えします。
読了目安:4分
avator
Misaki Akimoto
2018-11-20

「UI/UX」という表現は「表/裏」のように、対立する概念・相互補完する概念、といった印象を与えるかもしれません。 しかし、実際はUIとUXは対立・相互補完するものではありません。 今回は、それぞれの概念について触れ、UIとUXがどのような関係性なのかを明らかにしていきます。

そもそもUIとUXとは?

電車内でスマートフォンを操作している時のことを想像してみてください。

あなたは、通勤時の電車内で家計簿アプリで予算を管理したり、ニュースサイトをチェックしたりすることをイメージしているのではないでしょうか。

利用しているサービスには、私たちの操作を補助するように分かりやすい説明やボタンなどが表示されていますよね。このスマホに表示される操作を補助するディスプレイがUI(ユーザーインターフェイス) です。

表示されるデザイン、 フォントなど、製品であれば製品そのものや外観など、 私たちユーザーの目に触れる情報すべてが「UI」と呼ばれています。

これをサービスや製品上で、ユーザーが負荷なく利用できるようにグラフィックを設計していくことがUIデザインです。

対してUX(ユーザーエクスペリエンス)とはどのような概念なのでしょうか。 先ほどの電車内での例に置き換えてみると、UXは、電車内でスマートフォンを操作している”体験” 自体を指します。

朝の通勤時間に時事ニュースをチェックしたいとき、混雑した電車内でつり革につかまりながらスマホを操作するのは危険ですし、ユーザーもストレスを感じます。 この場合、スマホを片手で操作せずに情報が得られるようなオーディオタイプのニュースアプリなどがあると理想の体験に近づくかもしれません。

このように、ユーザーが求めているニュースや情報を伝えるためには、サービスにおいてどのような体験を提供すべきなのか、という体験の設計していくのがUXデザインです。

IT用語辞典ではUI、UXを以下のようにそれぞれを定義づけています。

UI

ユーザに対する情報の表示様式や、ユーザのデータ入力方式を規定する、コンピュータシステムの「操作感」。基礎的なUIはOSによって提供されるため、UIはOSの評価を左右する大きな要素となる。UIには大きく分けて、文字ベースのCUIとグラフィックベースのGUIがある。

特にアプリの文脈でいうUIとは、「アイコンデザイン・画面デザイン・ヴィジュアル・フォント」 のことを指します。

UX

ある製品やサービスを利用したり、消費した時に得られる体験の総体。個別の機能や使いやすさのみならず、ユーザが真にやりたいことを楽しく、心地よく実現できるかどうかを重視した概念である。

アプリの文脈におけるUXとは、「認知段階・入手段階・使用段階・拡散段階の4フェーズにおける心地よい体験」 のことを指します。

UIとUXの関係性は?

UI⊂UX UIに触れることは、ユーザー体験の一部

ユーザーとサービス体験の接点はUIであり、ユーザーはUIに触れることでサービスを体験することができます。つまり、理想のUXを可能にするのがUIです。

ユーザーに心地よい体験(=理想のUX)をしてもらうためにはどうしたらいいか。その答えがUIに現れてきます。UIデザインを行うならば、見た目の美しさを追求するだけでなく、「なぜこのデザインなのか」について、説明できなければなりません。

「かっこよくするために」UIデザインをするのは間違い

UIやUXという概念がないと、「なんとなくかっこいいから」という理由で、配置・配色・フォントなどを選んでしまうかもしれません。

ユーザーの使いやすさ・使い心地の良さを考えデザインする。若者が見たらダサいと思うほど文字が大きいサイトも、お年寄りにとっては最適解になりうることもありえます。「誰が・いつ・どのように」利用サービスなのか、しっかりと背景を考慮していくことが必要です。

「ユーザーの使い心地」をまず考え、その上で「美しさ」や「個性」などを表現していくのです。

結論

ユーザーの心地よさを設計し、具体的な手段をデザインしていく。 UXデザインはユーザーに心地よい体験をしてもらうために、こうなるといいだろうという「心地よい体験の仮説」です。そして、UIデザインは、「心地よい体験の仮説」を現実のものにするために、表現を作り上げていくことです。

UI/UXデザインを行うにあたっては、「いつ、誰がどのように利用するサービス」 なのかを考えることが重要です。

UIデザイン
UXデザイン
デザインパートナーをお探しではありませんか?
オハコはデザインと実装の力で、サービスをゼロから形にするデザインコンサルティング会社です。 サービスの成長から逆算し、最適なプロジェクトをデザインします。
デザインについてのご相談は下記よりお問い合わせください。
avator
Misaki Akimoto
プロダクトマネージャー/ Product Huntをチェックするのが日課です^^