UIデザイナーとは？超重要な理由とエンジニアとの違いを解説！

デザイナーと聞くとついつい、グラフィックデザインのような見た目が美しく、芸術性の高いものを連想しがちですが、世の中にはそれ以外のデザイン、デザイナーもたくさん存在しています。

たとえば日頃使う駅の自動改札機。

SuicaのようなICカードを「ピッ」っとする部分に傾斜がついていますが、実はあれも試行錯誤の末に導入されたデザインで、著名な「工業デザイナー」の方が手掛けたデザインです（※１）。

最初は平らな設計でしたが、読み取りエラーの頻度が高いため、傾斜をつけたところ改善したそうです。

まさにあの「ピッ」っとする部分も、「自動改札機」と「人間」をつなげる「UI=ユーザーインターフェース」です。

今回はそんなUIをデザインするUIデザインについて、その重要性と参考事例を解説していきます。

以下の３点がわかるようになっておりますので、是非最後までご覧ください。

・UIデザイナーとはどういう仕事か？エンジニアとの違いは？
・UIデザインが決定的に重要な理由
・UIデザインの参考事例３選

UIデザイナーとはどういう仕事か？エンジニアとの違いは？

まずはUIデザイナーと言うのはどういった仕事なのか見ていきましょう。

そもそもUI=ユーザーインターフェースって？

UIは広い意味を持つ言葉なので、一応ここで確認しておきましょう。

自動改札機の例でも挙げましたが、「機械」と「人間」が繋がる「接点」の部分です。

UIという言葉そのものは最近聞くような言葉ですが、実は大昔から存在していて、黒電話のダイヤルも電話という機械に番号を伝えるためのUIです。

みなさんが毎日使っているマウスやキーボード、スマホのタッチパネルもUIで、これらは物理的な形があることがから、UIデバイスと呼ばれたりもします。

形がないものとしてはWebサービスやソフトウェア上のものがあり、最もみなさんが身近に触れているのはGUI=Graphical User Interfaceでしょう。

元々はAppleが導入したパソコンを制御するためのUIで、今は一般的になったファイルやフォルダを目で見てクリックして操作するUI方式です。

これ以前はMicrosoftのMS-DOSのように文字で命令を打ち込んでパソコンを動かすCUI=Character User Interfaceだったわけですが、GUIになってからのパソコンの爆発的な普及からUIの重要性が垣間見えます。

UIデザイナーとは？

では、UIデザイナーとはなにか？という点ですが、その名の通り、UIをデザインする人です。

Webサイトであればユーザーが見ているページそのものがUIに当たります。

文章や写真、見出しのレイアウトから、ボタンの位置や大きさ、色など徹底的にユーザーにとって使いやすく、伝えたい内容が伝わりやすいようにデザインしていきます。

「デザイン」というとどうしても見た目のイメージが先行してしまいますが、UIデザインは見た目だけでなく、実際に使ってみて、ユーザーの目線の動きや画面の動き、行動パターンを意識しつつ、最適なデザインを追求していく作業。

これを任せられるのがUIデザイナーです。

エンジニアとの違いは？

さて、ここで一つの疑問が出てきます。「それってエンジニアと何が違うの？」というものです。

ここではわかりやすくWebサービスの場合を例にとりましょう。

Webサービスの場合は規模にもよりますが、サーバーの構築やプログラミングなど、直接目には見えない部分を担うバックエンドエンジニア、ユーザーから直接見える部分をプログラミングするフロントエンドエンジニアがいます。

この「フロントエンジニア」と「UIデザイナー」の違いが分かりづらい部分です。ともに、「ユーザーから直接見える部分」を作る人だからです。

その担当範囲を大まかに分けると、

・UIデザイナー：画面レイアウトや、ボタン・画像などのデザイン、配置などビジュアル部分を設計する。

・フロントエンドエンジニア：UIデザイナーの設計に従ってRubyやPHP, JavaScriptなどのWeb系言語を使ってプログラミングする。

店舗や住宅における内装デザイナーと塗装やクロス張りの職人さんと近い関係性かもしれません。

エンジニアとUIデザイナーを兼務する場合も

仕事の範囲の説明が必要なほど密接に関わるこの二つの職業は、一人の人間が兼務する場合もあります。

小規模なWebサイトやサービスであれば一人で全て開発しているものも存在し、その場合は当然設計、デザインからプログラミングまで全てを兼務する形になります。

近年は特にAWSのような使いやすいサーバーや、Ruby on Railsのようなフレームワークが充実しているため、一人で開発できる範囲も広がっており、今後もこういった例は増えていくでしょう。

また、小さな組織で運営しているサービスの場合明確に切り分けずに一人で担当している場合もあります。

ITに限らずものづくりのデザイナーはその中身の知識が求められるので、そもそも「両方の知識がある方が望ましい」のも確かです。

木材の特性を知らずに木造家屋を設計することはできませんよね。

そういった背景からか、経験を積んだフロントエンジニアがUIデザイナーに転身するという例もあり、幅広い知見やスキルを土台に開発がされています。（※２）

UIデザインが決定的に重要な理由

ここまで読んで頂ければご理解頂けていると思いますが、UIデザインは圧倒的に重要です。

現在世の中に流通しているモノやサービスはどれも洗練されていて、少なくとも一般的な製品では機能だけを見て大きく不足しているものはあまり有りません。

数少ない差別化の要因がUIとなってくるわけです。

また、世の中の流れとして、「モノからサービスへ」という流れがあります。

最も象徴的なものが自動車ですが、最近は日本でもカーシェアリングが普及してきたことも有り、自動車は所有するものというよりは、サービスとして使うものという比率が高まってきました。

このときもやはり車を予約するためにスマホアプリを使うわけですが、このアプリのUIが良くなかったらすぐ他社に乗り換えられてしまいますし、車のカギを取り出すのが面倒臭かったりしたら、同じく使ってもらえません。

UIは全体の売上に直結するものであり、ユーザーの利便性や効率に大きく影響するものであるある以上、UIの重要性に疑いの余地はありません。

冒頭にご紹介した自動改札機のICの読み取りの部分。もし、一人につき一秒余計に時間がかかったとしたら、ラッシュ時の駅の混雑はどれだけ悪化するでしょうか。

もちろん製品自体の機能面も重要ではありますが、それと同等もしくはそれ以上に重要なのがUIデザインと考えて良さそうです。

理想のUIとは？

理想のUIを語るときによく言われることがあります。それは、

「ユーザーに考えさせない」

ということ。少し噛み砕くと、「疑問を持たせない」ということになります。

Webサイトを閲覧していて、ユーザーが疑問に持ちそうな点：

・税込みか税抜か？
・送料はかかるのか？
・在庫はあるのか？

こういった疑問点を予め表示してあげておけば、ECサイトであればユーザーは何も考えずに（商品自体の吟味は別として）、購入まで進むことができます。

心理学の用語に「アフォーダンス」という言葉がありますが、これは仮にヒトが椅子という物を知らなくても、その形状からそこにあれば自然と座ってしまうというようなことを指します。

製品自体が、その機能や役割を人間に対して説明してくれているこのアフォーダンスが理想的なUIの形と言えそうです。

UIデザインの参考事例３選

では最後に実際に参考になる優れたUIを持つサービスをご紹介していきます。

どのサービスも日々改善されており、どんどん変化していきますが、最高峰のお手本として、日頃から意識してみてみることをおすすめします。

YouTube

もはやほぼ全員が使っているサービスとも言える「YouTube」ですが、そのUIは圧倒的に優秀です。

御存知の通り、「ユーザーに考えさせない」UIとなっており、おすすめ動画が無限に出てくるので、ずっと再生し続けている方も多いのではないでしょうか。

また、Googleが運営しているだけあって、検索機能も秀逸で目的の動画にたどり着くのも早く、再生までに必要なクリック数も少なく、とても使いやすいサービスに仕上がっています。

違法アップロード対策として、たとえば民法ラジオ各局も「radiko」という公式アプリをリリースしていますが、残念ながらUIがYouTubeには遠く及ばず、著作権の問題があることがわかっていてもついついYouTubeを使ってしまう、というのが現状となっています。

Uber Eats

最近急速に普及している「Uber Eats」ですが、このサービス自体はどちらかというとお店側にとって画期的なサービスで、ユーザーからすれば「出前」なので、古くからあったサービスです。

そのUberEatsがこれだけ支持されている理由は、現地での決済が不要であることや、ワンストップでいろんなお店に頼めるというUX(ユーザー体験）もさることながら、実に簡単に注文で切るUIの功績も大きいと言われています。

実際に頼んでみるとわかりますが、非常に簡単に目当てのお店のメニューにたどり着くことができ、「使っていて楽しく、考える必要がない」UIに仕上がっています。

一部住所の入力など若干不便な部分もありますが、今後のアップデートで解消されていくでしょう。

Amazon

ECサイトの世界最大手のAmazonのUIも当然ですが、とても優秀です。

日本人の買い物の仕方がAmazonの登場前と後で変わってしまったと言えるほどに浸透しているのはご存知のとおりです。

他の国内のECサイトに較べて圧倒的に見やすいこともありますが、とにかく購入までのクリック数が少なく、最も買い物がしやすいECサイトと言えるでしょう。

・「今すぐ買う」ボタン
・定期お届け便
・すばやく確認

など、常にユーザーの先回りをして、確実に購入まで誘導しつつ、「よく一緒に購入されている商品」などを上手に表示して、さらなる売上UPを狙っています。

「商品を売る」という直接的なサービスであるAmazonのUIは特に学ぶところが多いと言えます。

まとめ

いかがでしたでしょうか。

今まで人間同士が直接顔を合わせて買ってきたモノやサービスもどんどんインターネットや機械越しで買うようになっているなか、UIの重要性は高まるばかりです。

その重要な部分を任されるUIデザイナー。

日々の勉強や、最新技術へのキャッチアップなど大変な部分も大きいですが、実にやりがいのある仕事とも言えます。

奥の深い世界ですので、入り口をご紹介したに過ぎませんが、本稿が読者の方のUIデザインへの理解やUIデザイナーへの転職への助けに少しでもなれば幸いです。

◆参考文献：
※１ くらテク｜デザインで性能が変わる～Suica改札機のわずかな傾き
https://www.itmedia.co.jp/lifestyle/articles/0408/04/news021.html
※２ logmiTech｜とあるSEが、フロントエンドエンジニアとUI/UXデザイナーを兼務するまで
https://logmi.jp/tech/articles/321996