MdNCORPORATION

Webデザイン・スタンダード 伝わるビジュアルづくりとクリエイティブの最新技法

境 祐司 著/小浜 愛香 著/森本 友理 著/野田 一輝 著/北村 篤志 著/有吉 学 著
定価 2,420円
(本体 2,200円+税10%)
※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2018-12-26
仕様 B5判/152P
ISBN 978-4-8443-6777-2
「Webデザイン」という言葉が指す仕事の領域は、かつてないほど広がっています。スマートフォンの普及によってWebサイトの使われ方も多様になったことから、かつてのように1枚の画像でビジュアルを作れば終わりという時代ではありません。細かなUIやインタラクションのブラッシュアップも必要とされますし、ユーザー心理や使用場面を把握するUXデザインの視点も求められます。本書ではこのような状況を踏まえ、初学者には捉えづらい“いまのWebデザインの全体像”を一冊の書籍としてまとめました。「レイアウト」や「配色」といったデザインの基本から、「UXデザイン」への取り組み方、Webサイトを構成する「UI」や「グラフィック」の役割とポイント、「モーションデザイン」の実際まで、現場の第一線で活躍する著者の知見とノウハウを解説しています。トーン&マナーやサイトの目的に合わせたデザインのバリエーションも実例をベースに紹介しているので、実制作時のヒントにもなるはずです。これからWebデザインを学ぶ方、自分の領域を広げてステップアップしたい方にお勧めの一冊です。

■ページ見本






目次

■Introduction|Webサイトができるまで
01 Webサイトが表示される仕組み
02 Webサイトの種類と役割
03 Webサイトのワークフローとデザイナーの役割

■Chapter1|レイアウト
01 レイアウトとは?
02 Webレイアウトの特徴
03 モバイルとデスクトップのレイアウト
04 レイアウトの基本(1) 揃える
05 レイアウトの基本(2) 近づける・反復する
06 レイアウトの基本(3) 差をつける・動きをつける
07 レイアウトの基本(4) 余白・ジャンプ率
08 目的別のレイアウト例(1) メディア
09 目的別のレイアウト例(2) エンターテインメント
10 目的別のレイアウト例(3) コーポレートサイト
11 目的別のレイアウト例(4) ショップサイト
12 目的別のレイアウト例(5) ECサイト
13 目的別のレイアウト例(6) ランディングページ
14 目的別のレイアウト例(7) ブログサイト
[COLUMN]レイアウトのトレンド

■Chapter2|配色
01 Webサイトでの色の役割
02 色の基本
03 色が与えるイメージ
04 メインカラー・ベースカラー・サブカラー・アクセントカラー
05 ブランドとカラーの関係
06 配色の基本的な手法
07 イメージ別の配色例(1) キュート・ポップ
08 イメージ別の配色例(2) エレガント・高級
09 イメージ別の配色例(3) ビジネス・信頼
10 イメージ別の配色例(4) オーガニック・ナチュラル
11 イメージ別の配色例(5) クール・先端
12 イメージ別の配色例(6) 和
[COLUMN]配色のトレンド

■Chapter3|UXデザイン
01 UXデザインとは
02 UIデザインとは
03 UIデザインとUXデザインの関係
04 Webサイトのデザインで必要になるUXの知識
05 UXデザインの様々な手法
06 WebサイトのUXデザイン事例
[COLUMN]UXデザインのトレンド

■Chapter4|UI・グラフィックデザイン
01 ヘッダーのデザイン
02 フッターのデザイン
03 ボタンのデザイン
04 ナビゲーションのデザイン
05 タブ・アコーディオン等のUIデザイン
06 フォームのデザイン
07 写真を使ったデザイン(1) 写真のトーンと補正
08 写真を使ったデザイン(2) 切り抜き
09 ヒーローイメージ
10 イラストを使ったデザイン
11 インフォグラフィックのデザイン
12 タイポグラフィ(1) 書体の基本
13 タイポグラフィ(2) 文字組の基本
14 デザインガイドライン
15 イメージ別のUI・グラフィック例(1) キュート・ポップ
16 イメージ別のUI・グラフィック例(2) エレガント・高級
17 イメージ別のUI・グラフィック例(3) ビジネス・信頼
18 イメージ別のUI・グラフィック例(4) オーガニック・ナチュラル
19 イメージ別のUI・グラフィック例(5) クール・先端
20 イメージ別のUI・グラフィック例(6) 和
[COLUMN]UI・グラフィックデザインのトレンド

■Chapter5|モーションデザイン
01 Webサイトにモーションやエフェクトを持たせる意味
02 遷移アニメーションの種類と役割
03 マイクロインタラクションの考え方
04 動画を利用した表現
05 スクロールアニメーション・エフェクト
06 インタラクティブコンテンツ
[COLUMN]モーションデザインのトレンド

お詫びと訂正

お詫びと訂正のお知らせ
このたびは『Webデザイン・スタンダード 伝わるビジュアルづくりとクリエイティブの最新技法』をご購入いただきまして、誠にありがとうございました。

本書の第1刷のカバー、表紙、および奥付に記載されている著者の氏名に誤りがございました。

正しい氏名は次のとおりです。
[誤] 森本友里

[正] 森本友理
読者のみなさま、ならびに関係者のみなさまには、ご迷惑をおかけしてしまい、誠に申し訳ございませんでした。

訂正して深くお詫び申し上げます。

制作の基本からデザイン業界の最新状況まで! MdNのデザイン・グラフィック書8選

デザイン・制作・マーケティング Webでもう困らない! わかりやすくて知識が身につく8冊