【UI设计】产品设计之UI设计规范

确定UI设计规范首先要明确页面风格：

如何确定页面风格？

1）客户

分析年龄、出身、喜好风格

2）PM

a、商业目标、为什么要做这款产品？

b、产品所述行业、竞争对手、竞品分析

c、相关资料：VI、LOGO、网站、PPT、线下资料

d、主要逻辑特色等

e、客户要求交付文件：psd、图片、axure

3）用户

a、目标人群及特点

b、用户痛点及需求

c、使用场景

规范内容：

标准色：样式、色值、应用场景、备注

字体：中英文字体名称、样式、字重、字号、应用场景、备注

图标：尺寸范围、触控范围、颜色

间距：列表项间距、图文间距、留白、文字与文字间距、行距

列表：文章列表、标签列表

图片：图片尺寸、比例

头像：普通尺寸、特殊尺寸、应用场景

形状：描边、线分割、矩形分割线、矩形、圆形、椭圆形、色值、尺寸大小、圆角大小、阴影

背景：背景多预留一些，避免拉伸、压缩

蒙版：不透明度

按钮：尺寸大小、颜色、状态（不可点击、可点击、按下时）

表单：输入控件、大小、文字、placeholder、验证提示

弹框：默认操作提示框、默认错误/警告/成功提示

以分答H5为例：

1、前言

2、色彩规范

重要：

一般：

文字：

3、文字规范

文字规范示例：

4、按钮规范

5、页面布局

顶部导航和底部导航

只有底部导航

refer：

https://huaban.com/pins/799714841/

文章来源: blog.csdn.net，作者：简一商业，版权归原作者所有，如需转载，请联系作者。

原文链接：blog.csdn.net/liwei16611/article/details/104582440