【今さら聞けない!】UI/UXデザインの違いとその学習方法とは!

UI/UXの違いとは何なのか、そして独学に最適な学習サイトや記事をまとめています。スマホが普及されてからUI/UXデザインの重要性が上がってきています。初心者でもこれから学習するのに役立つものが多いのでぜひ参考にしてみてください!

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

スマートフォンが普及してから、主にアプリの開発において「UI/UX」というキーワードが非常に重要視されています。UIデザイナーやUXデザイナーといった職も生まれるほど、現在のアプリ開発ではデザイン面が大事だということです。

とはいえ、普段から携わっている人でないと身近な言葉ではないでしょう。

今回は初心者の方でも分かるように、「UI/UX」について解説し実際の勉強サイトなどを紹介していきます。デザイナーとよりスムーズにコミュニケーションを取るためにも必要な知識となるはずです。

 

なお本記事は、TechAcademyのUI/UXデザインオンラインブートキャンプの内容をもとに紹介しています。

 

目次

 

UIとは

fig1-620x412

UIとは「User Interface(ユーザーインターフェース)」の略称で、「人と物が接触する部分」を意味します。

サイトであれば、ブラウザ上で表示されるフォント、画像、ボタンなどユーザーの目に触れる外観を「UI」と呼んでいます。

UIデザインに特化して学習したい人向けの記事も合わせてご覧ください。

 

[PR] スマホアプリの開発で挫折しない学習方法を動画で公開中

UXとは

UXとは「User Experience(ユーザーエクスペリエンス)」の略称で、「人が物やサービスを通じて得られる体験」を意味します。

例えば、「読みやすいフォント」「サイトの回遊がしやすい」「ECサイトで商品の購入までがスムーズ」といったサービスは全て「UX」に関わるところになります。

Webサイトやアプリに限らず「丁寧な対応」というユーザーが感じる全てのことがUXに当てはまるのです。

 

UIデザイン・UXデザインの違いとは

UI/UXという単語が広く知れ渡っているためよく混同している人もいるかと思います。

「UI」とはアイコンやボタンなどといった見た目、「UX」はそのUIを実際に触るなど体験してみて感じる「良い」「悪い」といった感覚です。

とはいえ、UIだけが良いUXを作るとは限りません。とてもキレイなUIを作っても、今まで見たことのないような動きのあるサイトを作ってもユーザーが使いやすいと感じなければUXが良いとは言えないのです。

ユーザーが満足するUXを意識しながらサイトやアプリのUIをデザインすることが重要です。

 

UI/UXが学べる記事やスライド

まだまだUI/UXデザインが学べるサイトは多くありませんが、有名なUIデザイナーなどが挙げている資料は参考になるでしょう。どういった意識で仕事しているのかなど参考にしてみてください。

心地よいUIの温度 – 言葉と気遣いで高めるUI

UIを温泉にたとえて分かりやすく紹介してくれています。ユーザーにとって心地よいUIを作るために理解しておくとより良いアウトプットが出せるはずです。

UIデザインとUXの超基礎「UI Design & UX for ENGINEER」

UI/UXの超基礎ということで、まず最初に見ておきたいスライドでしょう。

UI/UXがどういった役割を果たしているのか、そしてそれぞれの関連性についても解説しています。

 

UIデザイナーのおしごとby Sumire Hibiya

5分でおさらいするモバイルUIデザインby usagimaru

UI/UXデザイナーなら一度は目を通しておきたい「デザイン原則」まとめ【随時更新】

 

以上、UI/UXの入り口になるところを紹介してきました。

UI/UXデザインは、プログラミングと違い「これが絶対」というものはありませんが、常にトレンドを追う必要があるでしょう。これからUIデザイナーを目指す人は世の中のサイトやアプリがどのようなUIで今後どうするとより心地よくなるのか考えると良いかと思います。

[お知らせ]TechAcademyでは初心者でもUI/UXデザインができるようになるUI/UXデザインオンラインブートキャンプを開催しています。現役UI/UXデザイナーのサポートで学びたい場合はご参加ください。