flat uiまとめ
DESCRIPTION
最近流行のFlat UI(フラットデザイン)についてまとめた資料です。 スマートフォンサイトやPCサイトなどを作成するときのポイントとして役に立てばと思います。TRANSCRIPT
![Page 1: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/1.jpg)
Flat UI まとめ2013/05/19@mauekusa
![Page 2: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/2.jpg)
フラットデザイン
立体的 フラット
立体的でなく、エフェクトを使わないフラットなデザイン
![Page 3: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/3.jpg)
色 ブロック
アイコン シンプル
![Page 4: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/4.jpg)
![Page 5: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/5.jpg)
![Page 6: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/6.jpg)
![Page 7: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/7.jpg)
![Page 8: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/8.jpg)
![Page 9: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/9.jpg)
![Page 10: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/10.jpg)
![Page 11: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/11.jpg)
Flat UI 事例
Brit + Co.
ClearWeather フラバ fitbit Svpply
InfomaticFigure
![Page 12: Flat UIまとめ](https://reader031.vdocuments.mx/reader031/viewer/2022013102/5556606fd8b42a144c8b48f1/html5/thumbnails/12.jpg)
まとめ
ビビッドカラーとの相性が良い
シンプルで分かりやすいUI
シャドウや罫線を用いない
文字サイズにメリハリを出す