osのフラットデザインを考えてみる_hokuriku.net vol.12

春日井良隆日本マイクロソフト株式会社UXエバンジェリスト

OS のフラットデザインを考えてみる

iOS

Google+

Google Chrome

Internet Explorer

Yahoo! Japan

Uniqlo

Windows Phone

Windows 8

UI

CLI - Command Line Interface

GUI - Graphical User Interface

GUI - Graphical User Interface

GUI - Graphical User Interface

Skeuomorphism

Skeuomorphism

Skeuomorphism

Skeuomorphism

本物っぽいデザインに飽きた派手なデザインにも飽きた

LINE天気

デフォルトの天気

ヤフー天気

Weather+

Solar

Partly Cloudy

device

PC

Station

fright

beach

スキューバーダイビングとシュノーケル

デバイスの多様化でアプリの使い方が変わった

Content before Chrome

モバイルの利用状況のデザインヒント

1. 余分なものを削ぎ落とす

2. ちら見しやすいようにデザインする

3. 階層を深くしない

4. 自然な形で接点を見せる

5. 途中で操作を止めても同じところから再開できるようにする

6. 時間軸を使って情報を整理する

Windows 8 design principles

1. Do more with less 削ぎ落とす

2. Pride in craftsmanship とことんこだわる

3. Be fast and fluid 軽快であれ、滑らかであれ

4. Authentically digital デジタルの本質を採り入れる

5. Win as one 一体感を与える

http://msdn.microsoft.com/library/windows/apps/hh770552

フラットデザインのために

Flat UI

Pixel Fabric

Pinterest

UI/UX Flat design

Swiss Design

Font

Font Weight

Segoe UI Light

Segoe UI semilight

Segoe UI

Segoe UI semibold

Font Weight

Segoe UI Light

Segoe UI semilight

Segoe UI

Segoe UI semibold

Font Weight

Segoe UI Light

Segoe UI semilight

Segoe UI

Segoe UI semibold

Font Weight

Segoe UI Light

Segoe UI semilight

Segoe UI

Segoe UI semibold

Font Weight

Font Weight

Color

HSV

Color

COLOURlovers

Adobe Kuler

Inforgraphic

Metro

シリギヤロック

シギリヤロックのインフォグラフィック

黄金比

1

1.61803398874989484820458683436

グリッドシステム

Copyright © 2008-2012 Antonio Carusone, unless otherwise noted

End