フラットデザインで考える 新しいUIデザインのセオリー
価格: ¥0
(概要)
昨今のUIデザインのトレンドとして注目されている「フラットデザイン」は,シンプルであるが故にデザイナーにとっては基本的ではありながらもごまかしのきかない本質的なデザイン力が問われるものです。本書では,AppleのiOS 7&8,GoogleのMaterial Design,MicrosoftのWindows8など,最新の「フラット」なUIデザインの動向を分析し,これからの時代に必要となる普遍的なデザインの考え方について掘り下げていきます。
(こんな方におすすめ)
Web・アプリデザイナー,UIデザイナー
「フラットデザイン」に興味のある方
(目次)
CHAPTER 1 フラットデザインとは何なのか
1.1 代表的な会社のフラットデザインの考え方
1.1.1 Microsoft ― Windows Phone&Windows 8
1.1.2 Google ― Material Design
1.1.3 Apple ― iOS 7&8
1.1.4 昔からあるフラットデザイン
1.2 誰のための「フラットデザイン」?
1.2.1 スキューモフィズムからの脱却
1.2.2 フラットデザインを作るのは簡単なのか?
1.2.3 フラットデザインはなぜわかりにくいのか
1.2.4 わかりやすいデザインとは
1.2.5 フラットデザインが目指すもの
[章末コラム] OSがフラットデザインを採用する意味とは
CHAPTER 2 フラットデザインの特徴をつかむ
2.1 フラットデザインの特徴
2.1.1 質感を抑えた平面構成
2.1.2 ルールに基づいた図形の整列
2.1.3 エフェクトを極力抑えたデザイン
2.1.4 線の利用を控える
2.2 配色
2.2.1 フラットデザインっぽい色とは何なのか?
2.2.2 色を限定したフラットデザイン
2.3 余白やフォントのルール
2.3.1 フォントとフラットデザインの関係
2.3.2 ジャンプ率を意識する
2.3.3 余白によってコントロールできること
2.3.4 角丸の持つ意味
2.4 コンテンツの表現方法
2.4.1 表現方法が限られる難しさ
2.4.2 わかりやすいコンテンツの見せ方
[章末コラム] 日本と海外での考え方の差
CHAPTER 3 UIパーツの本質を考える
3.1 パーツの本質を意識する
3.1.1 パーツのあり方/見せ方
3.2 UIパーツの本質
3.2.1 ボタン
3.2.2 チェックボックス
3.2.3 ラジオボタン
3.2.4 テキストフォーム
3.2.5 トグルスイッチ
3.2.6 スライダー
3.2.7 セレクトボックス
3.2.8 リスト
3.2.9 メッセージバルーン
3.2.10 ローディングインジケーター
3.2.11 アイコン
[章末コラム] フラットデザインよりさらに新しいデザインへ
CHAPTER 4 トランジションを活用する
4.1 フラットデザインにおけるトランジション
4.1.1 トランジションを使用する意味
4.1.2 iOSのトランジション
4.2 トランジションの例
4.2.1 オーバーレイ
4.2.2 スライド
4.2.3 フェイド
4.2.4 ズーム
4.2.5 シェイク
[章末コラム] 見た目と動きをセットで考える