paiza times

paizaがお届けする、テック・キャリア・マネジメント領域における「今必要な情報」を届けるWebメディア

logo

paizaがお届けする、テック・キャリア・マネジメント領域の「今必要な情報」を届けるWebメディア

Webデザイン入門者向け「UI・UX」って何?UXを向上させるには?

f:id:paiza:20180524142407j:plain

上原です。

paiza(ギノ)に入社して3ヶ月くらいのWebデザイナーです。

今回は、Web制作の現場でよく聞く「UIとUX」って一体何なのか、どういう関係性なのか、またUXを考えるのは誰の仕事なのか…などといった話を書きたいと思います。

デザイン初心者の方、これからデザインを学びたい方、UIとかUXってよく聞くけど何なのか実はよくわかってない方、そんなのはデザイナーが考えることだから関係ないと思っている方にとって少しでも参考になればと思います。

UIとUXの関係性について

UI(User Interface)とは

人とデバイスをつなぐ役割をする機能のこと。
=ユーザーの操作を助ける要素。

UX(User Experience)とは

プロダクトやサービスなどの利用を通じて、ユーザーが得る経験のこと。
=サービスを通じて得られる感覚、感情も含むすべての経験

たとえば、このpaizaのトップページで言うと…

f:id:paiza:20191007115111p:plain

この通り、ヘッダーのリンクやボタン、コードを入力できるエディタエリアなどなどは、ユーザーの操作を助ける機能=UIと言えます。

対してUXは、このページに対する「使ってみて楽しい・おもしろい!」「わかりにくくて使いづらい!」などといった感情や経験です。

「それくらい知っとるわ」という人も多いかと思いますが、何が言いたいかっていうと、「よくUI・UXって並列にひとまとめにされがちだけど、全然並列の言葉じゃない」ということです。

UIは、あくまでUXのもととなる「ひとつの要素」にすぎません。

f:id:paiza:20191008151614p:plain

f:id:paiza:20191008151642p:plain

サービスを通したUXを向上させるには

では、よりよいUXを作るにはどうしたらよいのでしょうか。

私は、UXを向上させるために必要なのは、大きくわけて

  • おもてなし精神
  • ユーザー理解

の2つだと思っています。

もう少し補足します。UXをよくするには、作り手側が一方的なおもてなしの気持ちだけで終わってはいけません。

たとえば、プログラミング学習のWebサービスがあって、そのユーザーであるプログラミング初心者たちが「手軽に学びたい」「楽しく学びたい」と思っていたとします。しかし、作り手側が「プログラミングを学ぶならまずは手続き型言語から!」「環境設定を自分でやれるようになってから!」と考えて、最初から難しい内容を網羅するようなコンテンツばかり作っていたら、UXは向上しませんし、ユーザーも離れていってしまいます。(※最初から難しい内容に取り組むことの是非ではなく、あくまでサービスを通して得られるUXの例の話です)

だから、よりよいUXを作るには、自分たちがよいと思うものばかりを形にするのでなく、それを使ってくれるユーザーを理解することが何よりも重要なのです。

f:id:paiza:20191008153832p:plain

UXを考えるのは誰の仕事?

最近はUXデザインとかUI/UXデザイナーとかいう言葉が広まっているので、「UXについて考えるのはデザイナーの仕事でしょ」と思っている方もいるかもしれません。

しかし、UXのもととなる領域は非常に広く、デザイナーが携われるのは下図くらいの領域にすぎません。どれだけ見た目のよいサービスがあったとしても、企画内容や機能がともなっていなければ、UXを向上させることはできないのです。

f:id:paiza:20191008153916p:plain

では、誰がUXを考えるべきなのか?やはりオーナーはビジネス視点から、 エンジニアは開発視点から、デザイナーはデザイン視点から…というように、サービスや企画にかかわる人が全員UXを意識することで、初めてよいUXを作れるのではないでしょうか。

f:id:paiza:20191008154230p:plain

まとめ

というわけで、UIとUXって何なのか、どういう関係性なのか、またUXを考えるのは誰の仕事なのか…などなどのお話でした。

UXについては、そのサービスにかかわる人全員が考えるべき領域だと思いますので、やっていきましょう。

paizaラーニングの「Webデザイン入門編」では、ITエンジニアやデザイン初心者の方向けに、Webデザインの基礎が学べる動画レッスンを公開しています。

Webデザイン入門編について詳しくはこちら





paizaラーニング」では、未経験者でもブラウザさえあれば、今すぐプログラミングの基礎が動画で学べるレッスンを多数公開しております。

そして、paizaでは、Webサービス開発企業などで求められるコーディング力や、テストケースを想定する力などが問われるプログラミングスキルチェック問題も提供しています。

スキルチェックに挑戦した人は、その結果によってS・A・B・C・D・Eの6段階のランクを取得できます。必要なスキルランクを取得すれば、書類選考なしで企業の求人に応募することも可能です。「自分のプログラミングスキルを客観的に知りたい」「スキルを使って転職したい」という方は、ぜひチャレンジしてみてください。

paizaのスキルチェック

paizaのおすすめコンテンツ

PPG proken プログラミングゲーム「初恋 プログラミング研究会〜海に行こうよ〜」 PPG Bingo プログラミングゲーム「コードレビューBINGO!!」
paiza転職 paiza新卒 EN:TRY paizaラーニング 記事内に記載している情報は、記事公開時点でのものとなります。 Copyright Paiza, Inc, All rights reserved.