基础层样式指南品牌色、主色 辅助色字体规范标题、 正文按钮字体间距系统网格原则,阴影圆角标准图标库,统一风格的图标集如线性 填充图标,可通过图标管理工具快速调用。
组件层原子组件按钮、输入框、标签等最小不可分割单元,分子组件由原子组件组合而成,搜索框按钮组成搜索栏,模板页面预定义的页面结构首页、列表页、详情页,包含典型组件组合,模式层交互模式模态弹窗、下拉菜单逻辑业务流程模板,如用户注册流程、商品购买流程。
用思维导图梳理设计系统层级,品牌色→按钮组件→按钮在表单中的应用模式,保存设计系统文档链接或本地副本,确保随时可查语雀或面板,明确组件的使用规则和变体,状态管理组件的不同状态,默认 、悬停、点击、禁用、是否已定义?例如按钮的 “危险色” 。
仅用于删除操作响应式规则,组件在不同屏幕尺寸下的适配方式,如移动端按钮自动缩小间距,版本记录确认组件是否有更新日志,避免使用过时版本控制功能管理。