ant design
设计价值观____设计原则____设计模式
价值观：自然、确定性、意义感、生长性
全局样式：色彩、布局、字体、图标、阴影、暗黑模式
1、色彩：
（1）系统性色彩体系：基础色板（12个主色 共120种） 中性色板（黑白灰） 数据可视化色板（可以自己额外选主色，算法生成你的完整色版）
（2）产品级色彩体系：品牌色（蓝）、功能色（红黄蓝绿）、中性色（黑到白）
2、布局：
（1）统一的画板尺寸：1440 （主流的有1920、1440、1366）
（2）适配方案：左右布局、上下布局、
（3）网格单位：基数为8
（4）栅格：24栅格体系
（4）常用模度：8的倍数、
3、字体：主字体 14px时,行高22px。字重： regular 以及 medium 两种。
4、图标：icon fount 、kitchen sketch插件、
原则：准确 简单 节奏 预约
设计尺寸1024x1024 出血64px
元素韵律：点_16的倍数（80、96、112、128）线_8的倍数 圆角_8的倍数(8 、16、32) 三角_常用角度76度
构图韵律_节奏感 平衡_弯曲的比竖直的细、倾斜的比竖直的细 辨识_辨识度
5、阴影：高度、光源 常用阴影表
6、暗黑模式：设计原则_内容舒适型 信息一致性。提供了一套色板生成工具_选择主色和背景色
element design：
（1）布局： 24分栏 （蚂蚁是24栅格体系）
（2）布局容器：顶栏容器 侧栏容器 主要区域容器 底栏容器
（3）色彩：主色-饿了么蓝 辅助色_红danger-橙warning-success绿-info灰 中性色-白到黑的几个
（4）字体：3种中文字体、3种英文字体 字号：正文13or14号 从12-20号 行高1.3紧凑、1.5常规、1.7宽松
（5）边框_实线1px、虚线2px ； 圆角_0px、2px、4px、30px ； 投影_基础投影、浅色投影
（6）图标：提供了一套常规图标集合
（7）按钮：基础用法、禁用状态、文字按钮、图案按钮、按钮组（上一页、下一页）、加载中
（8）文字链接：基础用法、禁用状态、下划线、图标（带图标的文字链接）
网友评论