MdNCORPORATION

ウェブデザインのつくり方、インターフェイスデザインの考え方。

ウェブデザインのつくり方、インターフェイスデザインの考え方。

矢野りん 著
定価 2,530円
(本体 2,300円+税10%)
※電子書籍の価格は各販売ストアにてご確認ください。
発売日 2011-09-26
仕様 A5判/256pP
ISBN 978-4-8443-6222-7
日々変化するウェブ制作の現場では、いままでの紙をベースにしたグラフィック主体のデザインではなく、さまざまなデバイスで表示されるデジタルコンテンツに応じた新しいデザインが求められています。モジュール、ユニット、そしてモバイルファーストやレスポンシブ・ウェブデザインといった新しい考え方が、それを代表するデザイン概念といえるでしょう。本書は、ウェブとスマートフォンなどのデジタルコンテンツ制作の現場のコミュニケーションを円滑にするために、39の新しいデザインの技法と制作のコツを解説したデザイン技法大全です。新しいデジタルデザインの技法について、そのデザインの考え方、インターフェイスの実践的つくり方、装飾的なデザインの技法、そしてそのデザインで実現できる効果などを、手描きタッチの親しみやすい図解とやさしい語り口で、具体的に解説しました。これからウェブデザインをはじめようとする初心者にとっても、現場で実際にウェブやスマートフォンの制作に携わる方にとっても、その特徴とポイントが理解できるようになっています。本書を通じて新しいウェブデザインの考え方とそのコツについて学んで、実践に役立てることができるでしょう。

■ページ見本










目次

【ウェブデザインのつくり方、インターフェイスデザインの考え方。】

はじめに

Chapter1 デザインの考え方に関する講義

Lesson 01 UX [ユーザーに質の高い経験を与える]
Lesson 02 機能の分類 [操作をスムーズにする]
Lesson 03 マジックナンバー [選択肢の数を決める]
Lesson 04 アイコン [直感的な識別を可能にする]
Lesson 05 ウェブのレイアウトパターン [型にならうことで使いやすく]
Lesson 06 スモールスクリーンのUI [ユースケースに合わせて画面を作る]
Lesson 07 ページのフォーマット [セクションごとにページの役割を決める]
Lesson 08 モジュール [情報を効率的にレイアウトする]
Lesson 09 仕様別レイアウトパターン [目的に応じたレイアウトの選び方]
Lesson 10 Media Queries [異なる環境に情報を届ける]
Lesson 11 モックアップ [完成型に近い形で仕上がりを想像する道具]

Chapter2 デザインの技法に関する講義
Lesson 12 タブインターフェイス [操作を単純にする]
Lesson 13 上下2 分割レイアウト [情報が記憶に残りやすい画面を作る]
Lesson 14 プルダウンナビゲーション [数の多い選択肢を使いやすくまとめる]
Lesson 15 色によるグルーピング [実際より情報量を少なく見せる]
Lesson 16 かたちによるグルーピング [情報を把握しやすくする]
Lesson 17 整列 [レイアウトの質を上げる]
Lesson 18 カルーセルUI [同じ高さ位置に複数の選択肢を並列する]
Lesson 19 アコーディオンUI [表示面積の消費を抑えて操作を提供する]
Lesson 20 画面完結型レイアウト [TVにレイアウトを最適化する]
Lesson 21 UI のカラーリング [機能性や訴求力を向上させる]
Lesson 22 ホワイトスペース [見やすく美しいページを作る]
Lesson 23 グリッドレイアウト [機能的で整然としたレイアウトのための手法]

Chapter3 スタイリングの技法に関する講義
Lesson 24 コンポジション [バランスよくグラフィックを整える]
Lesson 25 コントラスト [見やすさと使いやすさを決める]
Lesson 26 ジャンプ率 [見出しを探しやすくする]
Lesson 27 罫線 [画面を整理整頓する]
Lesson 28 トリミング [写真に表現力を与える]
Lesson 29 タイポグラフィ [メッセージを伝える]
Lesson 30 文字の間隔設定 [閲覧中のユーザーの疲労を軽減する]
Lesson 31 Web Font [ウェブならではのフォント表現]
Lesson 32 有彩色と無彩色 [特定の色を印象づける方法]
Lesson 33 補色 [対比効果を理解して緊張感のある色彩を計画する]
Lesson 34 透明度 [見た目の情報量をコントロールできる表現方法]
Lesson 35 彩度対比 [画面の強弱をコントロールする]
Lesson 36 明度対比 [メリハリをコントロールして見やすく整える]
Lesson 37 重さと色 [重要度を明示して視線を迷わせない]
Lesson 38 ハーモニックカラー [調和のとれた色でまとまりを感じさせる]
Lesson 39 CSS による文字の装飾 [文章を読みやすくする]

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

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