UI设计1

步骤：

1.需求分析＞原型图设计＞效果图设计＞交互设计＞标注与切图

1.1需求分析

1.1.1 市场需求

背景，定位，现有产品数据，运营与盈利

1.1.2 用户需求

显性需求，用户的可视化特征～年龄、兴趣爱好

隐性需求，内在特征～希望产品在哪些环境应用

1.1.3 产品需求

产品功能和内容

1.1.4 竞品分析

目前产品的功能，优点，缺点

 

2.效果图制作

2.1 搜集素材

网上搜集（图片+文字）注意版权

 2.2 UI设计

ps 切片（元素输出）

ai

pxcook 尺寸标注

xd

Axure 原型图设计

2.3 UI元素

点：小，图标

线：引导，分割

面：线分割出来的区域

 

2.4 色彩

2.4.1 色相（色调）

2.4.2 明度

2.4.3 纯度 

消色程度越高，纯度越低，暗

含色程度越高，纯度越高，亮

消色（该颜色的灰色比例）和含色（该颜色的含有程度）

 

2.5 色彩的对比

2.5.1 色相对比 

看各色相在色相环上的相邻程度

2.5.2 明度对比

 

2.6主色、辅助色与点缀色

主色：用于确定界面的色彩印象。1-3种。

辅助色：烘托主色，面积略小于主色。平衡界面的视觉效果。

点缀色：占用面积较小，醒目，画龙点睛，突出重点。

 

2.7 常见色彩搭配方案

暖色（红橙黄棕）

冷色（绿青蓝紫）

邻近色：色相环夹角60°以内

对比色：120-180

互补色：180夹角

中间色：黑白灰