こんにちは、デザイナー・ブロガーの
ゆっきー（@elcielo_design）です。
今回は、UIデザインのアイデア・
見本となる本をまとめた記事になります。
この記事の目次
UIデザインの
アイデア・見本の書籍・本
この記事では、UIデザイン中級者向けの
デザインアイデア・見本本を紹介します。
UIデザインのアイデア等が欲しい人は、
まず次に紹介するどれかから選択して
参考にするのがおすすめになります。
特に、次のような人は読んでみて下さい。
- UIデザインの
デザインアイデアを探している。 -
UIデザインの
制作スキルをアップさせたい。 -
UI/UXデザイナーを目指している。
また、デザイン書籍等を1ヶ月無料で読むなら、
Amazonの「Kindle Unlimited」がおすすめ。
UIデザインのアイデア・
見本となる書籍・本まとめ
「UIデザインのアイデア・見本の一覧」」
| 系統 | 書籍名 |
| UIデザインの事例・思想 | 【新版】UI GRAPHICS 成功事例と思想から学ぶ、 これからのインターフェイスデザインとUX |
| UIデザインの 良し悪しの例 |
失敗から学ぶユーザインタフェース 世界はBADUI (バッド・ユーアイ) で あふれている |
| だから、そのデザインはダメなんだ。 WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる |
|
| Webデザイン事例 | 2万回のA/Bテストからわかった 支持されるWebデザイン事例集 |
| モバイルデザインパターン | モバイルデザインパターン 第2版 ユーザーインタフェースのためのパターン集 |
下でそれぞれ詳しく紹介しています。
【新版】UI GRAPHICS
2015年刊行の書籍「UI GRAPHICS」の新版
| タイトル (書籍名) |
【新版】UI GRAPHICS 成功事例と思想から学ぶ、 これからのインターフェイスデザインとUX |
| 価格 | ¥3,300 (税込) |
| 発売日 | 2018/10/19 |
| 特徴 | ・世界のインターフェイスデザインを元に 成功事例と思考、トレンド、手法等から、 UI・UXデザインを学べる最新の書籍。 ・新版になり、全ての事例と論考を一新。 ・前版に収録したテキストも再録。 ・世界の優れた実例とこの領域に携わる 人の知見をインプットでき、著者の方々が 書き下ろしたテキストも読み応えがすごい。 |
| 内容 | TEXT / Intuitive / Minimal&Clean / Analog&Comfortable / Illustration&Infographic / Micro Interaction / Onboading Illustration / Internet of Things / UI GRAPHICS ARCHIVE |
| おすすめの人 | ・ある程度デザインの基礎を抑えた人 ・UIデザインのインスピレーションが 欲しいような人 |
| その他 | ・この1冊だけではUIについて体系的に 学ぶのは難しい。 |
失敗から学ぶユーザインタフェース
世界はBADUI (バッド・ユーアイ) で
あふれている
中村聡史 技術評論社 2015年02月
洗面所のUI、エレベーターのUI等、
身近でよく見かける「使いにくい」
UIデザインの写真付き事例集。
| タイトル (書籍名) |
失敗から学ぶユーザインタフェース 世界はBADUI (バッド・ユーアイ) で あふれている |
| 価格 | ¥3,278 (税込) |
| 発売日 | 2015/1/21 |
| 特徴 | ・200を超えるBADUIについて写真と状況説明 そしてユーザの失敗理由と共に紹介。 ・「使いにくさの原因は何か・どうすれば 使いやすくできるか」までしっかり解説。 ・写真や図解が多くて読みやすい文体 ・「使いにくさ」について面白く学べる。 |
| 内容 | プロローグ ようこそ 1 手がかり 2 フィードバック 3 対応付け 4 グループ化 5 習慣 6 一貫性 7 制作 8 メンテナンス 9 人に厳しいBADUI エピローグ 楽しいBADUIの世界 |
| おすすめの人 | ・多くのBADUIデザインの事例を見たい人 ・UIデザイナーになりたての人 |
| その他 |
だから、そのデザインはダメなんだ。
使いにくいWebサイト、どうすれば改善可能か
◯×形式でポイントや考えを解説した本。
| タイトル (書籍名) |
だから、そのデザインはダメなんだ。 WebサイトのUI設計・情報デザイン 良い・悪いが比べてわかる |
| 価格 | ¥2,420 (税込) |
| 発売日 | 2016/4/22 |
| 特徴 | ・良い例と悪い例を比較してくれるため、 UIデザインの問題点や改善点が明らかになる ・UI設計や情報デザインについての思考法を レイアウトやコンテンツ等の観点から言及。 ・見開き2ページ単位の構成 ・全体的にカラーページが読みやすい。 ・「なぜ、良いか・悪いか」の理由をきちんと 説明している。 ・具体例を豊富に掲載していて、現場の実務に 活用できる。 |
| 内容 | CHAPTER1 レイアウト・インターフェース CHAPTER2 コンテンツ編集・設計 CHAPTER3 ユーザビリティ CHAPTER4 サイト設計・マーケティング戦略 |
| おすすめの人 | ・ WebサイトのUI設計・情報デザインの 良い例と悪い例を比較して理解したい人 |
| その他 |
2万回のA/Bテストからわかった
支持されるWebデザイン事例集
鬼石真裕/KAIZEN TEAM 技術評論社 2018年07月24日
実際のA/Bテストを経て改善したデザインが
元のデザインとともに紹介されている事例集。
| タイトル (書籍名) |
2万回のA/Bテストからわかった 支持されるWebデザイン事例集 |
| 価格 | ¥2,728 (税込) |
| 発売日 | 2018/7/25 |
| 特徴 | ・UIデザインの具体的でリアリティーのある 施策を知ることができる。 ・支持されたデザインがなぜ支持されたのかの 考えも書かれているため、実際の改善に 活かしやすい。 ・実は少しのデザインの違いがあるだけで、 反応や影響が大きく変化することを学べる。 ・UIデザインが商品やサービスの売り上げ等、 事業の成長に繋がることを実感可能。 |
| 内容 | 第1章 なぜＡ/Ｂテストが必要なのか (Ａ/Ｂテストとは / もっとも有名なＡ/Ｂテストの事例 / なぜ継続的改善は必要なのか？ / 改善STEP1 ビジネスモデルを整理し、 KPIを設定する / 改善STEP2 どこを改善するのか？ ほか) 第2章 A/Bテスト事例集 (金融編 / リード獲得編 / サブスクリプション編 / EC編) |
| おすすめの人 | ・支持されるWebデザインを知りたい人 ・Webサイトの訪問者数が自社サービスの 売り上げに関わる人 |
| その他 |
モバイルデザインパターン
ユーザーインタフェースのための
パターン集
モバイルアプリのUIパターンを手軽に
参照できるリファレンスの第2版。
| タイトル (書籍名) |
モバイルデザインパターン 第2版 ユーザーインタフェースのためのパターン集 |
| 価格 | ¥4,070 (税込) |
| 発売日 | 2015/2/12 |
| 特徴 | ・デザイントレンドの変化に対応して全面改訂 ・主なプラットフォームで動くモバイル アプリの画面例を1,000点以上使いながら、 ユーザーインタフェースの定番パターン解説 ・基本パターン83個とアンチパターン7個が 使い易いモバイルアプリをデザインする上で クリアが必要な設計上の課題を解決できる。 |
| 内容 | ナビゲーション / フォーム / テーブル / 検索、並べ替え、フィルタリング / ツール / チャート / チュートリアルと誘導 / ソーシャル / フィードバックとアフォーダンス / ヘルプ / アンチパターン |
| おすすめの人 | ・モバイルアプリのUIデザインの例を見たい人 |
| その他 |
まとめ
以上がUIデザインの
アイデア・見本になる本でした。
この記事では、ジャンル別で本の内容を
紹介してるので、それに目を通してみて
自分に合う本を見つけて下さい。
なお、UI/UXデザイン関連の書籍は、
下の記事に一通りまとめています。
