Work guide

職種別お仕事ガイド

UIデザイン・UI設計が学べるおすすめ本14冊!基礎からしっかり学べる書籍はコレ!

2022.06.09

UIデザインおすすめ本をご紹介!

Webデザインをある程度学んだなら、次のステップに進んでみましょう。UIデザインができるようになると、Web関係で任せてもらえる仕事の幅が広がります。

基礎からUIデザインの勉強をするのであれば、内容が比較的やさしい本から読み始めてみましょう。ここでは、初心者でも読みやすいUIデザインに関する書籍を紹介します。

Career advice

UIデザイナーへの
キャリアアップ・転職相談

「これまでの経験を活かしてUIデザイナーとして活躍していきたい」「企業が求めるUIデザイナー像を知りたい」など、WebデザイナーからUIデザイナーを目指す方のキャリアアップ・転職をサポートします。

オンライン相談に申込む オンライン相談

UIデザインとは

UIとは「User Interface(ユーザーインターフェース)」の略です。ネットユーザーがWebサイトにアクセスしたときの使い心地を意味します。そして、ユーザーが快適にWebを利用できるようページを設計することをUIデザインといいます。

関連記事:UI/UXとはどういう意味?それぞれの違いと特徴まとめ

UIデザインはサービスの利用率と相関性があるので、専門的な知識に基づいて行わなければいけません。勉強するにあたっては、本を参考にするのが効率的です。

UIデザイナーの正社員求人

  • UIデザイナーは、今とてもニーズの高いお仕事です。正社員UIデザイナーとしてやりがいのある仕事をしてみませんか?
    詳しくはこちら

UIデザインを学ぶためにおすすめの本14冊

初心者がUIデザインを学ぶのであれば、難解な用語もかみくだいて説明してくれる内容がおすすめです。以下、基礎的な書籍を14冊紹介していきます。

UIデザイン必携

原田 秀司 著、出版社:翔泳社(2022/04/13)

ベストセラー『UIデザインの教科書』の著者による、使いやすさのデザインルール集。人間の認知特性にもとづき、どのようにインターフェースをデザインするべきか、UIデザインの本質的な考え方を学べます。写真と実例が多く、現場で参考にしやすいのも特徴。手元に置いておきたい一冊です。

はじめてのUIデザイン 改訂版

池田 拓司・宇野 雄・上ノ郷谷 太一・坪田 朋・元山 和之・吉竹 遼 著(2020/05/01)

第一線で活躍するデザイナーによる共著。UIデザインの基本的な知識や考え方が一通り身につく一冊です。Kindle版のみではあるものの安価なので、これからUIデザインを学ぼうと考えている方は、ぜひ読んでみてください。

UI/UXデザインの原則

平石 大祐 著、出版社:幻冬舎 (2020/10/23)

著者は、UI/UXデザインにより200社以上のCVR改善に貢献してきた平石氏。初心者でもわかりやすくまとまっています。ビジネス視点でUIデザインをとらえているのも特徴。UIの先のUXについても学べる一冊です。

UIデザインみんなで考え、カイゼンする。

栄前田 勝太郎・河西 紀明・西田 陽子 著、出版社:エムディエヌコーポレーション(MdN)(2019/3/19)

「良いUI」を生み出すためには?本書では、WebサービスやアプリのUIを開発する上での考え方やワークフローについて、UIデザイナーだけではなく「チームで協業する」という視点から解説しています。
具体的事例を交えながら、わかりやすく書かれていて、実践していくためのヒントが満載です。

オブジェクト志向UIデザイン 使いやすいソフトウェアの原理

ソシオメディア株式会社・上野 学・藤井 幸多 著、出版社:技術評論社(2020/6/5)

2020年6月発売の最新本。オブジェクト指向のUIの理論とプロセスを詳しく解説しており、情報設計を体系的に学べます。後半ページには、ワークアウト(実践演習)があり、実際にデザインができます。
オブジェクト指向のUIの理解を高め、しっかりと身につけられる良書です。

[新版] UI GRAPHICS 成功事例と思想から学ぶ、これからのインターフェイスデザインと

出版社:ビー・エヌ・エヌ新社(2018/10/19)

2015年刊行『UI GRAPHICS』の新版で、すべての事例と論考を一新。有名クリエイターの実例からトレンドの手法を見て学べる一冊です。
特に、スマホ対応のWebサイトなど、デバイスの大きさに関係なく快適性を保ちたい場合には参考になるでしょう。巻末には2015年版『UI GRAPHICS』のテキストも再録されており、非常に充実した内容です。

インターフェースデザインの心理学

出版社:オライリージャパン(2012/7/14)

ユーザー心理に注目してデザインの極意を解説した一冊が「インターフェイスデザインの心理学」です。数々の事例を引き合いに出しながら、デザインをするときの方向性について述べています。デザイナーが作業するうえで押さえておくべき心理学を理解できるでしょう。なお、ITの専門書というよりは一般のビジネスパーソンに向けられています。

続・インターフェースデザインの心理学

出版社:オライリージャパン(2016/8/5)

ベストセラー書『インタフェースデザインの心理学』の続編。ユーザー心理に注目してデザインの極意を解説した一冊です。
数々の事例をもとに、デザインをするときの方向性について述べています。デザイナーが作業するうえで押さえておくべき心理学を理解できるでしょう。

誰のためのデザイン?

出版社:新曜社(2015/4/23)

20年以上前に出版された本にもかかわらず、Webデザイナーのあいだで語り継がれている名著が「誰のためのデザイン?」です。UIデザインに直接的な言及こそなされていないものの、快適に利用できるデザインについて鋭く考察しています。ITやデザイン関係の業種だけでなく、ものづくりにかかわる社会人にとって参考になる書籍です。

UIデザインの心理学

出版社:インプレス(2015/3/13)

論理的にWeb設計を学ぶのであれば「UIデザインの心理学」を参考にしましょう。人間の心理的特性を踏まえながら、UIデザインへの取り入れ方を具体的に解説してくれます。感覚的にネットユーザーが「見やすい」と思うデザインの特徴を理解できるでしょう。UIデザインの初歩的な概念から身につけたいときに開いてみましょう。

フラットデザインで考える新しいUIデザインのセオリー

出版社:技術評論社(2014/11/21)

視覚効果を抑えたシンプルなフラットデザインは、Webサイトのトレンドです。フラットデザインに焦点を絞ってWeb設計を解説しているのが「フラットデザインで考える新しいUIデザインのセオリー」です。そもそものフラットデザインの定義や、レイアウトと事例の対比などがまとめられています。シンプルなデザイン思考を取り入れるために有益な本といえるでしょう。

ノンデザイナーズ・デザインブック

出版社:マイナビ出版(2016/6/30)

UIデザインを本格的に勉強するため、あらかじめ把握しておきたいポイントをまとめたのが「ノンデザイナーズ・デザインブック」です。本書ではデザインの基本原則を4つに分け、それぞれを徹底することでUIの向上へつながると解説しています。UIデザインの根底を理解するために活用してみましょう。

だから、そのデザインはダメなんだ。

出版社:エムディエヌコーポレーション(2016/4/22)

良い例と悪い例を比較してくれるため、読者がやってきたUIデザインの問題点や改善点が明らかになる本です。UI設計や情報デザインについての思考法を、レイアウトやコンテンツなどの観点から言及しています。全体的にカラーページが読みやすく、専門書に慣れていない人でも苦にならないでしょう。

さよなら、インタフェース

出版社:ビー・エヌ・エヌ新社(2015/9/17)

UIデザインについて、独特な視点も取り入れておくと柔軟性が身につきます。「さよなら、インタフェース」では「無駄な画面を排除することが理想である」という主張を押し出し、UIデザインを解説していきます。ただ、語り口調なのでとっつきにくさはありません。活字に慣れ親しんでいないデザイナーでもすらすらと読み進めるでしょう。

UIデザインはWebデザイナー必須のスキル

Webサイトを使いやすく設計するためには、UIデザインをしっかり学ぶ必要があります。また、UIデザインではユーザー心理やデバイスごとの知識なども求められるので、幅広いジャンルを勉強しなければいけません。

ここまで紹介してきた本を中心に、さまざまな意見を取り入れることで、多様なユーザーから愛されるデザインを実践できるでしょう。



関連記事:UIデザイナーになるには?



キャリアアップを目指せる!UI/UXデザイナーの派遣求人

  • UIのスキルを身に付けたいと考えているのであれば、派遣のUI/UXデザイナーとして経験を積むのもひとつの手です。UI/UXデザイナーの求人であれば、時給高めのお仕事を狙えます。
    詳しくはこちら
  • 苦手な面接を克服!フロントエンドエンジニアのための面接対策の相談会
  • 苦手な面接を克服!Webデザイナーのための面接対策の相談会
  • 苦手な面接を克服!Webディレクターのための面接対策の相談会
  • 未経験からWeb業界への転職準備

人気の記事

フロントエンドとバックエンドとは?意味の違いとエンジニアの仕事

1

Reactとは?フレームワークとの違い・フロントエンド開発に活用するメリットや特徴を解説!

2

UI/UXとはどういう意味?それぞれの違いと特徴まとめ

3

【2022年最新】IT業界の今後の動向は?トレンド技術の将来性と課題をカンタン解説!

4

コーダーの仕事とは?コーディングに必要なスキルや年収を徹底解説!将来性を高めるためには?

5

フロントエンドとバックエンドとは?意味の違いとエンジニアの仕事

1

Reactとは?フレームワークとの違い・フロントエンド開発に活用するメリットや特徴を解説!

2

UI/UXとはどういう意味?それぞれの違いと特徴まとめ

3

【2022年最新】IT業界の今後の動向は?トレンド技術の将来性と課題をカンタン解説!

4

コーダーの仕事とは?コーディングに必要なスキルや年収を徹底解説!将来性を高めるためには?

5

あなたのライフスタイルに合わせて働きたい方は、WSハケン 1つの会社で長くはたらきたいかたは、WSキャリア

他の職種も見る

  • Webデザイナー・UI/UXデザイナー

  • フロントエンドエンジニア・コーダー

  • Webディレクター・Webプロデューサー

  • Webマーケター

  • システムエンジニア・プログラマ

  • Webオペレーター・Webサイト運営

  • サーバー・ネットワークエンジニア

  • DTP・グラフィックデザイナー

Career advice

転職のアレコレ。プロに相談したい方へオススメ!

最新のIT・Web業界動向を知るキャリアカウンセラーが行う
「キャリアアドバイス」

ある程度経験を積んだので次のステップにキャリアアップしたい、しばらくWeb業界を離れていたが再度業界に戻りたい、 未経験・経験浅めだがどのように転職活動を行っていったらいいかなど、ウェブスタッフでは様々なご要望に対応したキャリアアドバイスを行っております。

お申込みはこちら

ウェブスタッフが運営するサイトでは、利便性向上・分析・広告配信等のためにCookie等のデータを使用しています。当社が取得したアクセスデータとの関連付けの削除(オプトアウト)に関しては「個人情報の取り扱いについて」をご覧ください。

同意して閉じる

確認する

WEB STAFF ウェブスタッフ株式会社

ウェブスタッフは、IT・Web業界専門の求人を取り扱う人材エージェントです。
IT・Webクリエイター・エンジニアの派遣・転職はお任せください。在宅勤務・フリーランスへのキャリアチェンジもサポート。

ページトップへ ページトップへ