最近はWeb開発に取り組む人も増え、Webデザインスキルへの注目も高まっています。
ただ実装ができるよりも、実装に加えデザイン知識もあると示せることで、付加価値・差別化が強まります。
こちらでは、そんな今注目のWebデザインの参考書を、人気・高評価のおすすめ本とともに紹介していきます。
発売したて・発売予定の新書をピックアップ
技術書は情報の鮮度も重要、人気ランキングの前に新しい書籍もチェックしておきましょう。
- 2024/01/26発売 「スマートWebデザイン 脱・自己流のデザイン&データ作成術」
- 2024/01/26発売 「気鋭のデザイナーたちが表現する いま注目の作字アイデア104 偏愛文字図鑑」
- 2024/02/16発売 「【購入者限定特典あり】つくるデザイン 基礎・レイアウト・かたち・文字・色・実践」
- 2024/03/02発売 「1冊ですべて身につくHTML & CSSとWebデザイン入門講座[第2版] (1冊ですべて身につく)」
- 2024/03/09発売 「世界一わかりやすいPhotoshop 操作とデザインの教科書[改訂4版]」
- Webデザインの本「最新の人気ランキング 20冊」
- Webデザインの本 人気の10冊
- なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉
- 1冊ですべて身につくHTML & CSSとWebデザイン入門講座[第2版] (1冊ですべて身につく)
- 伝わるスライドデザイン大全
- [デザイン技法図鑑]ひと目でわかるレイアウトの基本。
- イラレ職人コロが教える飾りのデザイン Illustratorのアイデア
- 鬼フィードバック デザインのチカラは“ダメ出し”で育つ
- 思わずクリックしたくなる バナーデザインのきほん
- これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本
- デザインのネタ帳 プロ並みに飾る文字デザイン Illustrator+Photoshop
- 初心者からちゃんとしたプロになる Webデザイン基礎入門
- Webデザインの本 最新・高評価のおすすめの5冊
- Webデザインの本「Kindle Unlimited 読み放題 人気本ランキング」
- Webデザイン参考書「新書一覧(2021年、2022年刊行)」
- おまけ:本より高コスパ?「Udemy Webデザインおすすめ講座」
- 関連:フロントエンド実装「HTML/CSS」「JavaScript」を学ぶ
- 関連:「Webライティング」「マーケティング」を学ぶ
Webデザインの本「最新の人気ランキング 20冊」
今人気の「Webデザインの本」をランキングで一覧したのが以下です。
Rank | 製品 | 価格 |
---|---|---|
1 | ||
2 | ||
3 | ||
4 | ||
5 | ||
6 | ||
7 | ||
8 | ||
9 | デザインのネタ帳 プロ並みに飾る文字デザイン Illustrator+Photoshop... 発売日 2022/05/02 mito, マルミヤン, 佐々木拓人, 高橋としゆき (エムディエヌコーポレーション(MdN)) 総合評価 | |
10 | ||
11 | ||
12 | ||
13 | オブジェクト指向UIデザイン──使いやすいソフトウェアの原理 (WEB+DB PRESS plusシリーズ)... 発売日 2020/06/05 ソシオメディア株式会社, 上野 学, 藤井 幸多 (技術評論社) 総合評価 | |
14 | ||
15 | ||
16 | ||
17 | ||
18 | ||
19 | ||
20 |
以降でおすすめ・注目の本をピックアップしていきます。
Kindle版のある本なら試し読みも可能。大概目次まで見れるので、概要もつかめるので、サンプル試読がおすすめです。
Webデザインの本 人気の10冊
以下が「Webデザインの本」人気の10冊詳細です。
Rank | 製品 | 価格 |
---|---|---|
1 | ||
2 | ||
3 | ||
4 | ||
5 | ||
6 | ||
7 | ||
8 | ||
9 | デザインのネタ帳 プロ並みに飾る文字デザイン Illustrator+Photoshop... 発売日 2022/05/02 mito, マルミヤン, 佐々木拓人, 高橋としゆき (エムディエヌコーポレーション(MdN)) 総合評価 | |
10 |
なるほどデザイン〈目で見て楽しむ新しいデザインの本。〉
「デザイン=楽しい」を実感できる新しいデザイン書籍。
デザインする上で必要な基礎、概念、ルール、プロセスを
図解やイラスト、写真などのビジュアルで解説しています。
現場で活躍しているデザイナーが身近にあるわかりやすいものに例えたり、
図解、イラスト、別のものに置き換えて見方を変えてみたり…
豊富なビジュアルとともにわかりやすくひも解いた、
楽しみながらデザインのあれこれがわかる「なるほど!」と思える内容が盛りだくさんです!
〈本書の内容〉
■Chapter 1
デザインに「正解」はない ーー編集とデザイン
■Chapter 2 デザイナーの7つ道具
どっちがダイジ? を口癖にしよう。ーーダイジ度天秤
主役を狙って、光を当てる。ーースポットライト
いいデザインて、いいキャラしてます。ーー擬人化力
ヒントは世の中にあふれてる。ーー連想力
言葉と絵のバイリンガルになろう。ーー翻訳機
ふところに隠し持った、最終兵器。ーー虫めがね
そのデザインを決めるもの。ーー愛
■Chapter 3 デザインの素
布地を織り上げるように組む。ーー文字と組み
言葉の「らしさ」をつくる。ーー言葉と文章
右脳と左脳で考えてみる。ーー色
イメージの力に向き合う。ーー写真
ロジカル、ときどきグラフィカル。ーーグラフとチャート
↓全て表示↑少なく表示
内容サンプル
目次
デザインしてみよう)
2 デザイナーの7つ道具(ダイジ度天秤ーどっちがダイジ?を口癖にしよう。
スポットライトー主役を狙って光を当てる。
擬人化力ーいいデザインていいキャラしてます。
連想力ーヒントは世の中にあふれてる。
翻訳機ー言葉と絵のバイリンガルになろう。
虫めがねーふところに隠し持った、最終兵器。
愛ーそのデザインを決めるもの。)
3 デザインの素(文字と組みー布地を織り上げるように組む。
言葉と文章ー言葉の「らしさ」をつくる。
色ー右脳と左脳で考えてみる。
写真ーイメージの力に向き合う。
グラフとチャートーロジカル、ときどきグラフィカル。)
↓全て表示↑少なく表示
Users Voice
内容サンプル
著者略歴
株式会社コンセントアートディレクター/デザイナー。武蔵野美術大学デザイン情報学科卒業後、2006年(株)アレフ・ゼロ(現・コンセント)入社。雑誌・書籍・広報誌・カタログ・学校案内・Webサイトなど、幅広くアートディレクション・デザインを手がける(本データはこの書籍が刊行された当時に掲載されていたものです)
1冊ですべて身につくHTML & CSSとWebデザイン入門講座[第2版] (1冊ですべて身につく)
内容サンプル
内容サンプル
伝わるスライドデザイン大全
内容サンプル
Users Voice
内容サンプル
[デザイン技法図鑑]ひと目でわかるレイアウトの基本。
〈電子書籍版に関する注意事項〉
本書は固定レイアウト型の電子書籍です。リフロー型と異なりビューア機能が制限されるほか、端末によって見え方が異なりますので、ご購入前にお使いの端末にて「無料サンプル」をお試しください。
【なっとく! デザインの基本。】
デザインの基本的なセオリーや手法を、ビジュアルで直感的に“ひと目”でわかるように解説した[デザイン技法図鑑]シリーズの第一弾は「レイアウト」です。シンプルでわかりやすいデザインサンプルや概念図を駆使した誌面で、直感的にレイアウトのルールが理解できます。
レイアウトの章では、集中・拡散・分解・整列などの実践に役立つ基本のレイアウトテクニックを解説。また、その手法を起用した実例などをとおして実践的に理解することができます。
文字の組み方やフォントのイメージ、写真の活用方法やイラストの活用、インフォグラフィックやチャートのテクニックなど、基本プラスαをきちんと学べる初心者のための教科書です。
〈本書の構成〉
デザインって何?
■CHAPTER1:レイアウト
1-1 集中
1-2 拡散
1-3 分割
1-4 散乱
1-5 整列
1-6 均等
1-7 対比
1-8 反復
1-9 余白...ほか
■CHAPTER2:文字
2-1 太めのフォント
2-2 細めのフォント
2-3 和風のフォント
2-4 丸みのあるフォント
2-5 かたまりで組む...ほか
■CHAPTER3:写真
3-1 写真が主役
3-2 正方形の写真
3-3 写真のかたち(切り抜き)
3-4 メインとサブの関係
3-5 被写体の視線...ほか
■CHAPTER4:図版
4-1 イラストの役割
4-2 イラストでマイルドに
4-3 イラストでわかりやすく
4-4 インフォグラフィックス
4-5 チャートで説明...ほか
■CHAPTER5:配色
5-1 同系色・類似色
5-2 反対色・補色
5-3 単色...ほか
〈[デザイン技法図鑑]シリーズの特徴〉
◎直感的なビジュアルでデザインの基本が理解できる
◎ちゃんとした基礎を理解しながら体系的に学習できる
◎美しくてわかりやすいサンプルで実践的に解説
↓全て表示↑少なく表示
内容サンプル
Users Voice
内容サンプル
イラレ職人コロが教える飾りのデザイン Illustratorのアイデア
本書は固定レイアウト型の電子書籍です。リフロー型と異なりビューア機能が制限されるほか、端末によって見え方が異なりますので、ご購入前にお使いの端末にて「無料サンプル」をお試しください。
【イラレ職人コロ、待望の一冊! いちばん使える最強アイデアレシピ】
イラレ職人コロさん『飾りのデザイン』が満を持して登場しました!
Illustratorで作る「飾り」のアイデア(レシピ)を集めました。『シンプルだけど汎用性の高いデザイン』を意識し、「イラスト」「パターン」「フレーム」「タイポ&ロゴ」「インフォグラフィック」のカテゴリーから、合計72種類のアイデアを収録。Illustratorの技術を完全に習得していないユーザーでも図版が作成できるよう、ステップごとに詳しく解説しています。
直感的に操作できる構成ですが、複雑な工程はページ内に「ヒント」を設定。より深い理解が得られる「オマケ」のほか、レシピによってはQRコードから動画を見ることもできます。作業工程で迷いそうな部分は、コロさんからの「ふきだしアドバイス」を参考にしてみてください。
すべての人が「楽しいイラレライフ」を過ごせますように!
〈著者プロフィール〉
イラレ職人コロ[イラレショクニンコロ]
Adobe Illustratorのチュートリアル制作に特化したクリエイター。北海道札幌市在住。1~2分の超短チュートリアル動画『本日のイラレ』の制作を中心に、「Adobe MAX 2020」「Adobe MAX 2021」への登壇、大学非常勤講師、書籍の執筆など、クリエイター向けのコンテンツ開発および情報発信を行っている。著書に『イラレのスゴ技 動画と図でわかるIllustratorの新しいアイディア』(技術評論社)がある。Twitter:@coro46(他にもYouTubeやnoteで情報を発信。詳しくは各種SNSにて「イラレ職人コロ」で検索)
↓全て表示↑少なく表示
内容サンプル
目次
可愛いぷっくりハート ほか)
2 パターン(輝きのサンバースト
魅惑のマーブリング ほか)
3 フレーム(シックな内側角丸フレーム
小粋な二角丸フレーム ほか)
4 タイポ&ロゴ(Adobe Fontsを使おう
スマートな反転文字 ほか)
5 インフォグラフィック(プレゼン資料で活躍!ベン図
シンプルなサイクル図 ほか)
↓全て表示↑少なく表示
Users Voice
内容サンプル
著者略歴
Adobe Illustratorのチュートリアル制作に特化したクリエイター。1~2分の超短チュートリアル動画『本日のイラレ』の制作を中心に、Adobe MAX 2020、2021への登壇、大学非常勤講師、書籍の執筆など、クリエイター向けのコンテンツ開発および情報発信を行っている(本データはこの書籍が刊行された当時に掲載されていたものです)
鬼フィードバック デザインのチカラは“ダメ出し”で育つ
本書は固定レイアウト型の電子書籍です。リフロー型と異なりビューア機能が制限されるほか、端末によって見え方が異なりますので、ご購入前にお使いの端末にて「無料サンプル」をお試しください。
【デザイン千本ノック、“鬼フィードバック"が待望の書籍化!】
「前田デザイン室」で生まれたデザイン千本ノック、“鬼フィードバック"が待望の書籍化です。
チャレンジャーのデザイン案に対し、そのデザインに欠けている要素や視点を、元・任天堂デザイナーの前田高志がひたすらフィードバックしていきます。「これはなんのためのもの?」「そもそもどういう利用シーンを想定してる?」といった根底の部分の問いに始まり、さまざまなバリエーションを検討しながら、最後にミリ単位の微調整を経てフィニッシュに至るまで、鬼のような(量の)コミュニケーションラリーを完全中継!
最初は焦点の定まっていなかったデザインが、次第にブラッシュアップされていき、デザインの訴求力とチャレンジャーのデザイン力が格段に向上していく様子が手に取るようにわかります。
まだ完成していないデザインは、見る人に違和感を与えることが多いもの。ですが、「そのデザインに何が足りないか?」をしっかり見抜くには経験値が必要です。ぜひ本書でデザインを見る目、育てる目、解決する目を養い、自分の中に“デザインの鬼”を宿らせてください!
〈本書の特長〉
・対話形式で楽しみながらデザインの本質を学べる
・ブラッシュアップの過程を通じてデザインの思考が体感できる
・ダメ出しへの耐性が身につく
・デザインのアイデア出しのヒントが得られる
〈本書の内容〉
■Introduction 鬼フィードバックとは
■Chapter1 バナー
■Chapter2 名刺
■Chapter3 チラシ
■Chapter4 サムネイル
■Chapter5 プレゼン資料
■Chapter6 POP
■Chapter7 ポスター
■Chapter8 企業ロゴ
〈こんな方にオススメ〉
・デザインを見る力・捉える力・考える力を養いたい方
・フィードバックの方法論を学びたいディレクター・発注者の方
・デザインができていく過程を体感したい初学者の方
〈著者プロフィール〉
前田 高志(まえだ・たかし)
デザイナー/株式会社NASU 代表取締役/株式会社VIEW 代表取締役/前田デザイン室 室長
大阪芸術大学デザイン学科卒業後、任天堂株式会社へ入社。約15年プロモーションに携わったのち、父の病気をきっかけに独立を決意。2016年2月からNASU(ナス)という屋号でフリーランスとしてスタート。NASUとは、デザインで成(為)すの意。同年4月から専門学校HALにて非常勤講師に。2017年から大阪芸術大学非常勤講師に(現在はいずれも退任)。2018年、自身のコミュニティ「前田デザイン室」を設立。雑誌『マエボン』、書籍『NASU本 前田高志のデザイン』、アートブック『モザイクパンツ』、デザインの必殺技カードゲーム『Desig-win』など、仕事とは違うクリエイティブワークを前田デザイン室メンバーと共に作り続ける。前田デザイン室でのコミュニティ作りの経験を活かし、2019年10月よりNASUの新事業としてコミュニティ事業を開始する。2020年1月よりレディオブック株式会社のクリエイティブディレクターに就任。NASUで手掛けた名刺が、同社が「スクーデリア・フェラーリ」と日本企業として13年ぶりのパートナーシップ契約を結ぶきっかけとなる。2021年3月17日にデザイン本『勝てるデザイン』を幻冬舎から出版。
↓全て表示↑少なく表示
内容サンプル
目次
1 バナー
2 名刺
3 チラシ
4 サムネイル
5 プレゼン資料
6 POP
7 ポスター
8 企業ロゴ
Users Voice
内容サンプル
思わずクリックしたくなる バナーデザインのきほん
この1冊で解決!
バナーは情報量の多いWeb上に掲載されるので
「パッと一目で情報を伝える」必要があります。
なので、目に留めてもらう工夫が必須!
この本では「パッと見て伝わるバナーデザイン」を作ることを目的とし、
8つの基本と6つのカテゴリーに分けた工夫やテクニックをご紹介します。
・バナー制作に時間がかかってしまう!
・バナーを作るのが苦手…。
・サイズが小さくで作るのが難しい
基本も応用もしっかり解説しているので、
デザイン初心者の方でもこの本を読めば、
伝わるバナーが作れること間違いなしです!
▼こんなシーンに役立つ
・WEB・SNSなどに掲載する広告バナー
・ブログやHPのアイキャッチ
・ネットショップのバナー
・記事の見出し画像
▼CONTENTS
PART1 伝わるバナーってどう作るの?
PART2 小さくてもわかりやすく! レイアウトのコツ
PART3 パッと伝わる文字の見せ方
PART4 全く違う情報をわかりやすく伝えるグルーピング術
PART5 人の顔や視線を使って目を引くデザインに
PART6 イマイチな写真をよく見せる補正と加工
PART7 あしらいと演出で心惹かれるデザインに
総復習! バナー練習問題
キーカラーで選ぶバナー配色手帳
↓全て表示↑少なく表示
内容サンプル
目次
2 小さくてもわかりやすく!レイアウトのコツ
3 パッと伝わる文字の見せ方
4 全く違う情報をわかりやすく伝えるグルーピング術
5 人の顔や視線を使って目を引くデザインに
6 イマイチな写真をよく見せる補正し加工
7 あしらいと演出で心惹かれるデザインに
↓全て表示↑少なく表示
Users Voice
内容サンプル
著者略歴
1984年生まれ。佐賀県出身。2012年よりWebデザイナーとして活動。kanvas(カンバス)という屋号で企業のホームページ制作を行う。これまで100サイト以上の制作に関わり、半数はデザインからHTML/CSSコーディング、CMSの組込までワンストップで対応。2020年2月からWebデザインの授業を視聴できるサービス「Webデザイン1on1レッスンチャンネル」を主催。TwitterではバナーデザインのTipsを発信(本データはこの書籍が刊行された当時に掲載されていたものです)
↓全て表示↑少なく表示
これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本
(著)Capybara Design, 竹内 直人, 竹内 瑠美
発売日 2021/10/14
“1冊目"に最適の入門書! 【学びをサポートする4大特典つき】
本書は手を動かしてWebサイトを作りながら
HTML/CSSとWebデザインの基本を楽しく学べる入門書です。
初学者が1冊目に読む本としてふさわしい内容を盛り込んでいるため、
これを読めば必要な基礎知識がひととおり身につきます。
制作できるサイトは計4種。
初歩的な内容から少しずつレベルアップしていき、
Flexboxレイアウト・CSSグリッドレイアウト・
レスポンシブデザイン・CSSアニメーションも作れるようになります。
またコーディングの知識だけではなく、
学習を続ける上での学び方のコツやポイントも紹介。
知識ゼロからスタートした人でも、1冊を読み終えるころには
自ら学習を深めていけるようになるでしょう。
■わかりやすい! 楽しい! ポイント
・やさしく要点をおさえた解説
・手を動かして作ることを重視した構成
・おしゃれでバリエーション豊かなサンプルサイト
・豊富な図解とイラスト、キャラクターによるガイド
・重要ポイントの理解を助ける補足動画
■こんな方におすすめ!
・Webサイト制作をゼロから学びたい初心者
・1冊目の入門書を探している人
・Web制作の仕事を目指している人
■学習をサポート! 嬉しい4大特典つき!
(※翔泳社サイトにて無料のID登録とダウンロードの必要があります)
1.サンプルサイトのXDデータ
- 画像の切り出しや色/数値抽出の練習用に
- デザインファイルの作り方の参考に
2.特典PDF:Webサイトの公開方法
- 最後に必要な公開作業の手順も解説!
- レンタルサーバー/ドメインについてやFTPソフトの使い方
3.制作に役立つおすすめサイト集
- 実際のしごとで使っているサイトを厳選!
- Webデザイン編/コーディング編と合計、約50サイトを紹介
4.初学者必携のチートシート
- 横において学習すると学びやすい!
- Flexboxレイアウト/CSSグリッドレイアウト/CSSのショートハンド/キーボード入力サポートの4種
↓全て表示↑少なく表示
内容サンプル
目次
HTMLのきほんを学ぼう)
2 SNSリンク集を作ってみよう(CSSのきほんを学ぼう
SNSリンク集のCSSを書いてみよう)
3 2カラムページを作ってみよう(ブログサイトのHTMLを書いてみよう
ブログサイトのCSSを書いてみよう)
4 1カラムページを作ってみよう(Web招待状サイトのHTMLを書いてみよう
Web招待状サイトのCSSを書いてみよう ほか)
5 複数ページのサイトを作ってみよう(制作の流れとWebデザインのきほん
レストランサイトのCSSを書こう(モバイル) ほか)
↓全て表示↑少なく表示
Users Voice
内容サンプル
著者略歴
Web制作会社、動画マーケティング会社にてディレクター・マーケター・エンジニアを経て2018年に独立。フロントエンジニアとして現役で活動しつつ、実体験に基づいた知識を活かしコーディング講師としても活動している
竹内瑠美(タケウチルミ)
UI/UXやマーケティング視点も含めたトータルなビジュアルデザインを得意とする。さまざまなベンチャー企業での経験を活かし、現在はスタートアップ企業のデザインパートナーとして活動している(本データはこの書籍が刊行された当時に掲載されていたものです)
↓全て表示↑少なく表示
デザインのネタ帳 プロ並みに飾る文字デザイン Illustrator+Photoshop
(著)mito, マルミヤン, 佐々木拓人, 高橋としゆき
発売日 2022/05/02
内容サンプル
内容サンプル
初心者からちゃんとしたプロになる Webデザイン基礎入門
〈電子書籍版に関する注意事項〉
本書は固定レイアウト型の電子書籍です。リフロー型と異なりビューア機能が制限されるほか、端末によって見え方が異なりますので、ご購入前にお使いの端末にて「無料サンプル」をお試しください。
【1日30分からはじめる! プロを目指す人の新・スタンダード。】
WebデザインやHTML・CSSの学習を「1日30分からはじめる」をテーマに、やさしくしっかり解説した書籍。初学者の方が、プロのWebデザイナーを目指す上で必要となる基本的な知識や技術を体系的に学べます。“ちゃんとしたプロ”のWebデザイナーとしてスタート地点に立つために、最初に選んでいただきたい1冊です。
Webサイトの実制作のフローに沿い、本書の解説では、Webデザインの概論と制作に必要となるツールや素材・配色について学んだあと、HTML・CSSの基礎と実践を習得し、サイトの公開や運用に関する知識を身につけます。HTML・CSSの書き方を初歩から教えるだけにとどまらず、サイトを制作し、公開・運用していくために必要な基本知識をすべて解説しています。
また、各記事ごとに学習時間の目安を記載しており、授業や独習で学習教材として活用しやすい作りを目指しました。HTML・CSSの実践部分でサンプルサイトとして制作するのは、シングルページのシンプルなお店のサイトと、モバイルファーストの手法を取り入れたサイトの2つです。サンプルは学習用データとしてダウンロード提供します。
〈こんな方にオススメ〉
・初学者からプロのWebデザイナーやマークアップエンジニアを目指す方
・Webデザイン制作やHTML・CSSの知識を身につけたい方
・WebデザインやHTML・CSSの基本情報をアップデートしたい方
〈本書の章構成〉
○Lesson1 Webサイトの成り立ち
○Lesson2 Webサイトの枠組みを知る
○Lesson3 Webデザインに必要な素材
○Lesson4 HTMLをマスターする
○Lesson5 CSSをマスターする
○Lesson6 シングルページのサイトを作る
○Lesson7 レスポンシブ対応サイトを作る
○Lesson8 Webサイトを公開してみよう
○Lesson9 SNS連携とWebサイトの運用
↓全て表示↑少なく表示
内容サンプル
Users Voice
内容サンプル
 
Webデザインの本 最新・高評価のおすすめの5冊
以下が「Webデザインの本」最新・高評価のおすすめの5冊詳細です。
Rank | 製品 | 価格 |
---|---|---|
1 | デザインのネタ帳 プロ並みに使える写真加工 Photoshop 発売日 2022/08/31 永樂雅也, コネクリ, Photoshop Book, 内藤孝彦 (エムディエヌコーポレーション(MdN)) 総合評価 | |
2 | ||
3 | ||
4 | ||
5 |
デザインのネタ帳 プロ並みに使える写真加工 Photoshop
(著)永樂雅也, コネクリ, Photoshop Book, 内藤孝彦
発売日 2022/08/31
本書は固定レイアウト型の電子書籍です。リフロー型と異なりビューア機能が制限されるほか、端末によって見え方が異なりますので、ご購入前にお使いの端末にて「無料サンプル」をお試しください。
【ハイセンスな“映える”写真で見る人をひきつける!】
SNSの普及により、写真を公開する機会が格段に増えました。アプリなどでも簡単な加工はできますが、商品写真にせよ、スナップ写真にせよ、より本格的に写真に力をもたせたいのであれば、Photoshopの使いこなしが欠かせません。
本書では、Photoshopをより活用したいという方のために、31の写真加工テクニックをステップ・バイ・ステップ形式で解説しました。撮影の難しいダイナミックな写真や、幻想的な写真、インパクトのある写真、絵画・イラスト風の加工、文字を入れる手法など、プロが使う多彩なテクニックが掲載されています。
完成Photoshopファイル(PSDファイル)もダウンロードできるので、「ちょっとやってみよう!」と気軽に挑戦できます。
ぜひ本書で、写真の魅力の引き出し方を身につけてください。
〈こんな方にオススメ〉
・Photoshopをいまいち使いこなせていない方
・紙面やWebサイトに掲載する写真を映えさせたい方
・SNSやブログに商品写真やスナップ写真をアップする方
〈本書の内容〉
■Chapter1 写真の被写体を目立たせる
■Chapter2 文字を入れる
■Chapter3 絵画・イラスト風の加工
■Chapter4 さまざまな世界観をつくる
■Chapter5 インパクトのある加工
〈本書の特長〉
・プロの技術を駆使した説得力のある仕上がり
・ステップ・バイ・ステップ形式の丁寧な解説
・レイヤー付きの完成PSDデータをダウンロード可
↓全て表示↑少なく表示
内容サンプル
Users Voice
内容サンプル
不滅のデザインルール 圧倒的な感動を生み出すアイデア群
圧倒的な感動を生み出すデザインのアイデア群
プロが使う技術58個を一挙公開!
ずっと使える不滅のルールが全部学べる。
一流の考え方がわかる特別インタビュー
とらや・サントリー烏龍茶のアートディレクション 葛西薫氏
キリンレモン・アニメ『チェンソーマン』のアートディレクション 村上雅士氏
高品質なデザインが460選
初級者から、中上級者まで、
デザインを作るすべての人に役立つ内容が詰まっている!
●本書は次のような方にオススメ
・これからデザインのことを学びたい人
・デザイン制作に自信が持てない人
・デザインのアイデアがたくさん欲しい人
・プロが使うデザインのルールを知りたい人
・ずっと使えるデザインのルールを知りたい人
CONTENTS
Special Interview
村上雅士氏インタビュー 「普通」から「半歩」外に出るデザイン
葛西 薫氏インタビュー デザインとは「潤い」
Chapter01 レイアウトのルール
01 情報整理とレイアウト
02 ホワイトスペース(余白) 空間を使った演出と視線誘導
03 ぼかし・透過 デザインを強調する美しいビジュアル
04 シンメトリー(対称) 調和や安定感のある対称のレイアウト
05 三角形の構図 奥行きや安定感を演出する
06 日の丸構図 主役を際立たせる
07 二分割のデザイン シーンを分ける
08 対比の構図 心を強く揺さぶる
09 三分割のデザイン バランスの良い構図を作る
10 デペイズマン 知覚的なイリュージョン
11 黄金比・白銀比 美しいプロポーション
12 グリッドレイアウト 統一感と規則性
13 俯瞰とあおり 奥行きが生まれる
14 方向性 視線と空間をコントロールする
14 反復 統一感とリズムが生まれる
16 リズム 効果的な構図につながる
17 タイリング リズムや動きを表現する
18 ドット(サークル) 動きを感じるエレメント
19 アシンメトリー(非対称) 躍動感を生む非対称のレイアウト
20 ライン さまざまなイメージを与える線
21 放射 圧倒的な迫力を作る
22 ランダム・フリーレイアウト 躍動感と期待感があふれる
Chapter02 配色のルール
01 色の扱い方 色を知って味方につける
02 暖色 視線を引きつける
03 寒色 静かで落ち着いた印象を与える
04 中性色 中立性と二面性
05 原色系 クリエイティブな表現
06 補色配色とマルチカラー 互いに引き合う、引き立て合う
07 明暗とコントラスト 視線を惹きつける
08 黒と高彩度の色 スタイリッシュでモダン
09 モノトーン シンプルでスタイリッシュ
10 トーン 調子でまとめる
11 クリア&グラデーション 透明感と柔らかさを演出する
12 60-30-10 のルール バランスの取れた配色
13 蛍光&光 使い方によって魅力的が増す色
Chapter03 写真とイラストのルール
01 写真の扱い方 写真もデザイン
02 角版写真 安定感のある形
03 トリミング 見せたい部分を切り取る
04 フレーミング 世界を切り分ける
05 切り抜き 自由で多彩な表現
06 写真による視線誘導 流れをつくる
07 写真で引き込む インパクトのあるビジュアル
08 コラージュ 複眼的な表現手法
09 イラストと写真の融合 ユニークで印象的なビジュアルを作る
10 線画のイラスト シンプルな表現
11 かわいいイラスト 場を和ませる
12 おしゃれなイラスト 特別なセンスが感じられる
Chapter04 タイポグラフィのルール
01 文字の扱い方
02 文字のジャンプ率 メリハリを調整して情報を見やすくする
03 文字をデザインする 文字に視線を集める
04 縦書き アイキャッチで美しい文字組み
05 文字を斜めにする 動きや勢いをつける強調表現
06 図を避けて文字を配置・図の上に文字を配置する インパクトと情報を両立させる
07 文字をバラす・崩す・切る 文字をビジュアル要素へと変える
08 文字モザイクアート 文字とビジュアルで伝えるメッセージ
09 文字を装飾する 文字を目立たせて印象づける
10 文字を組み合わせて形を作る 情報であり図形であるタイポグラフィ
11 文字で切り抜きする 文字をコンセプトとして表現する
↓全て表示↑少なく表示
内容サンプル
Users Voice
内容サンプル
ちいさくはじめるデザインシステム
「デザインシステム」は、デジタルプロダクト開発においてその必要性や役割を言及されることが多い概念で、プロダクトを提供するためのプロダクト、またはインフラとも呼ばれ、日本の企業・組織でも導入が進んでいます。一般的には、「デザインの再現性を高め、一貫した製品体験を効率よく表現すること」を目的に導入される「ドキュメントやリソース群のこと」と説明されます。
プロダクトの重要性が増すにつれ、プロダクトが示す領域も広がり、デザインシステムが取り扱う範囲も広がってきています。見た目のデザインやUIに関するルール・ナレッジだけでなく、ブランドパーソナリティや文章の表現など、ユーザーとのありとあらゆる接点を網羅し体系化する必要が出てきているともいえるでしょう。
しかし、デザインシステムには決まった在り方がなく、組織の数だけ、その目的の数だけ形を変えます。公開されている個別のデザインシステムを見ても、今の自分たちに必要なのか、作れるのか、そして運用できるのか、疑問は尽きないでしょう。
本書は、人事・労務領域の業務アプリケーションSaaSを提供しているSmartHRのデザインシステムの立ち上げ前から、現在までの取り組みをケースとして扱いながら、デザインシステムの構想・構築・運用について、一般論を含めて解説します。まずはなにもわからなくても大丈夫。デザインシステムを始める目的と、最初に手をつけるべきコンテンツを考えるところからスタートしましょう。
【目次】
Contents
1
デザインシステムについて考えよう
1-1 デザインシステムとは
1-2 誰のためのデザインシステム?|プロダクト
1-3 誰のためのデザインシステム?|ブランドコミュニケーション
1-4 デザイナーだけのものではないデザインシステム
2
デザインシステムを作るコツとステップ
2-1 デザインシステムをはじめる3つのステップ
2-2 デザインをみんなのものにする3つのステップ
#Column SmartHRの人々から見たSmartHR Design System「SmartHR Design System公開前夜」
3
デザインシステムに何をどうまとめる?
3-1 イントロダクション
3-2 運営理念
3-3 パーソナリティ
3-4 ロゴ
3-5 タイポグラフィ
3-6 伝わる文章
3-7 アイコン
#Column SmartHRの人々から見たSmartHR Design System「プロダクトのカラーリング刷新」
3-8 色
3-9 印刷ガイドライン
3-10 イラストレーション
#Column SmartHRの人々から見たSmartHR Design System「運営理念の言語化」
3-11 デザイン原則
3-12 デザイントークン
3-13 コンポーネント
#Column SmartHRの人々から見たSmartHR Design System「ライティングガイドライン」
3-14 文字コンテンツ
#Column SmartHRの人々から見たSmartHR Design System「組織への浸透」
3-15 デザインパターン
3-16 デザインレビュー
3-17 ユーザビリティテスト
3-18 ブランドコンポーネント
3-19 スライド・資料
3-20 アクセシビリティ
4
デザインシステムを続けやすくしよう
4-1 デザインシステムの運用
4-2 外部サービスとツール
4-3 デザインシステムのシステム構築
4-4 デザインシステムにおける協業
4-5 校正支援ツール
4-6 デザインデータ
5
デザインシステムの正解は1つじゃない
5-1 となりのデザインシステム
↓全て表示↑少なく表示
内容サンプル
Users Voice
内容サンプル
ザ・ダークパターン ユーザーの心や行動をあざむくデザイン
顧客の信頼を失っていませんか?
欧米で規制強化が進む、
ディセプティブ・デザインの実態と脱却の道筋
「退会方法がわかりにくい」
「勝手にメルマガに登録されている」
「消費者を煽るカウントダウンタイマー」
「期限のない在庫一掃セール」……
こうしたユーザーを意図的にだますデザイン
(=ダークパターン)の乱用が増えています。
本書は、ダークパターンとは何かから、
世界で進むダークパターンの規制強化の実状、
ダークパターンの代表的な15の具体例、
そして、企業やデザイナーがダークパターンに陥る背景と
その防止策を1冊にまとめて解説します。
目次
Chapter1 ダークパターンとは何か
1.1 消費者を惑わせるWeb サイト設計
1.2 ダークパターンとは何か、その定義
1.3 ダークパターンの世界的調査
1.4 ダークパターンは人の選択をどれほど歪めるか
1.5 国内外で高まるダークパターンへの忌避感
1.6 企業がダークパターンを使うリスク
Chapter2 意思決定の科学
2.1 その選択は、誰が決めているのか
2.2 意思決定に影響を与えるマイクロコピー
2.3 ユーザーが行動を起こす3条件
2.4 ファストアンドスロー 速い思考と遅い思考
2.5 説得 vs. 欺瞞、操作、強制
Chapter3 ダークパターンの種類
3.1 スニーキング(こっそり)
3.2 アージェンシー(緊急性)
3.3 ミスディレクション(誘導)
3.4 ソーシャルプルーフ(社会的証明)
3.5 スケアシティ(希少性)
3.6 オブストラクション(妨害)
3.7 フォースドアクション(強制)
Chapter4 ダークパターンを防ぐために
4.1 組織をプレッシャーから解放する
4.2 ユーザーをリスクから解放する
※本電子書籍は同名出版物を底本として作成しました。記載内容は印刷出版当時のものです。
※印刷出版再現のため電子書籍としては不要な情報を含んでいる場合があります。
※印刷出版とは異なる表記・表現の場合があります。予めご了承ください。
※プレビューにてお手持ちの電子端末での表示状態をご確認の上、商品をお買い求めください。
↓全て表示↑少なく表示
内容サンプル
目次
Chapter1 ダークパターンとは何か
1.1 消費者を惑わせるWeb サイト設計
1.2 ダークパターンとは何か、その定義
1.3 ダークパターンの世界的調査
1.4 ダークパターンは人の選択をどれほど歪めるか
1.5 国内外で高まるダークパターンへの忌避感
1.6 企業がダークパターンを使うリスク
Chapter2 意思決定の科学
2.1 その選択は、誰が決めているのか
2.2 意思決定に影響を与えるマイクロコピー
2.3 ユーザーが行動を起こす3条件
2.4 ファストアンドスロー 速い思考と遅い思考
2.5 説得 vs. 欺瞞、操作、強制
Chapter3 ダークパターンの種類
3.1 スニーキング(こっそり)
3.2 アージェンシー(緊急性)
3.3 ミスディレクション(誘導)
3.4 ソーシャルプルーフ(社会的証明)
3.5 スケアシティ(希少性)
3.6 オブストラクション(妨害)
3.7 フォースドアクション(強制)
Chapter4 ダークパターンを防ぐために
4.1 組織をプレッシャーから解放する
4.2 ユーザーをリスクから解放する
↓全て表示↑少なく表示
Users Voice
内容サンプル
著者略歴
1986年生まれ、北海道出身のUXライター。ダイレクトマーケティング専門のコピーライターとして独立後、コミュニケーションをデザインするライティング領域へとシフト。2021年よりオウンドメディアKOTOBA UXを開設。国内でのUXライティングの普及に努めるほか、企業への実務支援やアドバイスを行っている(本データはこの書籍が刊行された当時に掲載されていたものです)
イメージをカタチにするロゴデザイン 65のヒントで見つかる自分だけのアイデア
「ポップ」「エレガント」「伝統的」「スタイリッシュ」といったイメージ別にロゴの見本を掲載。それぞれのデザインのテクニックやポイントもしっかりと解説します。
本書にはロゴデザイナーである遠島啓介氏がデザインする250以上のロゴを掲載。ページをめくるたびに素敵なロゴが目に入ります。ロゴの基礎知識や、「擬人化」や「反復」「誇張」などのよく使われる手法についても紹介。
1冊でロゴづくりの基本がすべてわかる!ノンデザイナーでも「イメージ」に合ったクオリティの高いロゴが作れるようになります。
■本書の構成
第1章 ロゴづくりの準備
第2章 アイデアにつながる発想のひきだし
第3章 イメージをカタチにするロゴデザイン
第4章 自分らしいロゴをつくる秘訣
↓全て表示↑少なく表示
内容サンプル
Users Voice
内容サンプル
 
Webデザインの本「Kindle Unlimited 読み放題 人気本ランキング」
「Kindle Unlimited」は、Amazonの定額本読み放題サービス。
最近はKindle Unlimitedで読める本もどんどん増えており、雑誌、ビジネス書、実用書などは充実のラインナップ。
以下がKindle Unlimitedで読み放題となるWebデザインの本の一覧です。
30日無料体験も可能なので、読みたい本があれば体験期間で無料で読むことも可能です。
Rank | 製品 | 価格 |
---|---|---|
1 | Female Poses Collection 05 【Basic ・基本ポーズ 01】: 少女・ポーズ・コレクション・3DCGによるポーズ... 発売日 2021/09/16 MossGreen Kindle Unlimited対象 | 298円 |
2 | Female Poses Collection 06【DANCE02】: 3DCGによるポーズ集 イラスト・マンガ・デザインに... 発売日 2021/09/03 MossGreen Kindle Unlimited対象 総合評価 | 298円 |
3 | Female Poses Collection 04 【Expression】: 少女・ポーズ・コレクション・04・【表情・顏】: 3DCG... 発売日 2021/08/25 MossGreen Kindle Unlimited対象 | 298円 |
4 | UXと理論で作る Webデザイン: デザイナーでなくてもわかる 発売日 2017/11/12 川合 俊輔, 大本あかね, 菊池崇 (WDE Publishing) Kindle Unlimited対象 総合評価 | 2,689円 |
5 | ||
6 | 199円 | |
7 | まるごとわかる ウェブデザイン技能検定3級テキストブック... 発売日 2014/03/03 ウェブデザイン技能検定対策委員会 (Symphocity Digital Publishing) Kindle Unlimited対象 総合評価 | 900円 |
8 | HTML5+CSS3の新しい教科書 改訂新版 基礎から覚える、深く理解できる。... 発売日 2018/08/27 赤間 公太郎, 原 一宣。 (エムディエヌコーポレーション(MdN)) Kindle Unlimited対象 総合評価 | |
9 | 250円 | |
10 | 250円 |
Webデザイン参考書「新書一覧(2021年、2022年刊行)」
IT技術・プログラミング言語は、最新情報のキャッチアップも非常に重要、すなわち新書は要チェック。
ということで、2020年以降に発売したWebデザイン参考書の新書一覧(発売日の新しい順)が以下です。
製品 | 価格 |
---|---|
【2024年を成功に導く】ITスキルのない人がwebデザイナーになるための副業アウトプット成功術: webデザイナーとして稼ぐためのSucc... 発売日 2023/12/19 WEBデザイナー 山田 浩平, WEBデザイナー育成協会, 権利収入ビジネス情報通信, DIY出版 総合評価 | 398円 |
980円 |
おまけ:本より高コスパ?「Udemy Webデザインおすすめ講座」
UdemyではWebデザインを基礎から応用までトータルで学べる学習講座があります。
こちらが、セール時には2千円程度で購入可能で、講座によっては本よりコスパよく学習が可能です。
講座は、買い切り型ながら更新あり、質問可能、30日間返金も可能、という本以上の手厚いサポートがあるのが魅力。
以下の表が、Webデザインの学習講座例。セールの場合、かなりおすすめなのでぜひトライしてみください。
Udemyについては、以下のページでも詳しく紹介しているので覗いてみてください。
人気 Rank | 学習コース | 評価 |
---|---|---|
1 | 総評価数 11135件 | |
2 | 総評価数 13027件 | |
3 | ウェブ開発入門完全攻略コース - HTML/CSS/JavaScript. プログラミングをはじめて学び創れる人へ!... 発売日 2017/11/25 受講者 38,919人 通常 27,800円 現在 27,800円 | 総評価数 6608件 |
4 | 総評価数 3117件 | |
5 | 【HTML,CSS,JS,PHP,Git,Docker】プログラミング初心者OK! ゼロからわかるWebシステム開発... 発売日 2021/07/26 受講者 11,827人 通常 27,800円 現在 27,800円 | 総評価数 1519件 |
関連:フロントエンド実装「HTML/CSS」「JavaScript」を学ぶ
以下ではWebデザイン活用のためにも基礎となる「HTML/CSS」「JavaScript」の書籍も紹介しています、合わせてのぞいて見てください。
関連:「Webライティング」「マーケティング」を学ぶ
以下ではブログやサイトを実運用して利益を出していくのに必須となるWebライティング、マーケティングの本もまとめています、合わせてのぞいて見てください。
いじょうでっす。
コメント