挑選顏色
- Main color: 通常用于吸引用戶注意, 比如按鈕碗硬,提醒操作時使用
- Secondary color: 輔助main color增加一些顏色變化
- Background color: 用于輔助內(nèi)容現(xiàn)實
- Background contrasted color: 和Background color配合凸現(xiàn)內(nèi)容
Pick Colors
選擇字體和字號
- Font: Avenir Next
- Heading: Regular 40px #fff
- Sub Heading: Regular 20px #fff Opacity: 70%
- body: Regular 14px #333333
Choose Font Styles
排版
- Margin
- Align
- Rulers
- ....
Typograph
元素分組
元素分組如同代碼重構(gòu)恩尾,讓每個元素所在layer變得更有描述意義.
Grouping
參考
- Color template: http://www.rocket-design.fr/color-template/
- A pocket guid to master typograhic Adventures http://www.typogui.de/
- Pixel Love Icons: http://www.pixellove.com/