图标，APPicon，启动引导页

1、图标三要素：

识别性

统一性

差异性

2、图标中常见的错误：

（1）不同图标之间差异不明显（不能明确区分代表不同含义的图标）

（2）一个图标中包含太多元素，过于复杂

（3）不必要的元素

（4）缺少风格的一致性

（5）小图标里不必要有透视和阴影（因为图标过小，看不清添加的效果，反而有种糊掉的感觉）

（6）考虑各国的社会特点，及手势图标的含义

（7）图标中不要使用真是界面的图像

（8）图标内不要有文字

3、icon应该有的状态规范

按钮规范：背景+文字（100%*64）

内嵌的元素：

（1）文字输入框

（2）按下的按钮

（3）滑动槽

（4）卡片

（5）选择后的单选按钮

（6）弹出消息（通常希望用户去点）

外凸的元素：

（1）未按下的按钮

（2）滑动按钮

（3）下拉控件

（4）卡片

（5）选择后的单选按钮

（6）弹出消息（通常希望用户点击）

4、图标类别：

（1）线性——细线型：较精致，给人小巧的感觉，适用于要求文艺范，女性化，打造品牌感。

（2）线性——粗线型：有趣，踏实可用于任何APP，但要求图标轮廓精炼，不能复杂。

（3）线性——粗细结合：给人感觉较为稳重，个性。适用于金融，医疗，教育等类别。

以粗线条构成大轮廓，细线条装饰。

（4）面型图标：面积大，视觉注意力强，可用于任何APP，非常活泼，能弥补线性图标的单调。

（5）线面结合型：以线条勾勒出大的轮廓，再以面填充，要求比较个性化，看起来较可爱，活泼。

5、APPicon设计的桑原则：

（1）如果APPicon在颜色上的展示诉求大于造型的话，可以用白色背景加公司logo

（2）如果APPicon造型足够独特具有高度识别度，或对颜色诉求相对较小的话，可用品牌色做背景

（3）如果产品拥有具象的形象物或场景的话，可设计拟物化或场景化的图标（游戏图标常使用）

6、APPicon尺寸：

1024*1024     JPG     圆角：180px

512*512     圆角：90px

114*114     圆角：20px

66*66     58*58     圆角：10px 

7、输出切图格式：png-24

命名：APPicon—1024.png

8、启动页类型：

（1）广告类

（2）logo类

（3）主题类

（4）插画类

9、引导页：

用户初次下载APP后打开见到的页面。

10、引导页形式：

（1）功能介绍型

（2）情感代入型

（3）使用说明类

（4）问题解决类

11、启动页与引导页的区别：

（1）启动页：为了缓解用户等待加载APP数据内容出现的一个界面（可以有非常棒活动入口也可以是无意义去掉内容模块保留导航标签栏的页面）

要自动消失（如果有广告，要倒计时一般为3秒）或跳过功能。不需要和用户有互动。可经常换。一张JPG，也可以是一个动画，最好7秒内，越短体验下越好。

（2）引导页：针对于新用户（相当于是使用教程）有意义的（产品特色功能，关键功能，迭代的功能介绍等）不常换的页面。可以与用户进行交互操作（例如第一步，第二步这样）

12、启动页的类型：

（1）规范型：去掉内容，保留导航跟标签栏

好处：用户体验好，给用户已经进入应用的错觉，降低用户的焦虑感。

（2）品牌推广型：启动图标+品牌名称+宣传语

好处：加深品牌感

建议不要经常与换，其目的是潜移默化用户心中的品牌形象。

（3）商业需求：加入广告（含有跳过功能，一般3秒）（例如微博的启动页）

13、引导页的类型：（一般更换的情况：发布或版本迭代）

（1）展示功能（文字（大标题+小标题）起对比作用）

每一页都要统一字号，字数，位置，半屏插画+文字

（2）使用说明（对用户在使用过程中会遇到的问题，不清楚的操作，隐藏的功能误解功能）进行指引（大多采用箭头，圆圈来进行指示）

动效：（1）缓冲     （2）反弹     （3）消失     （4）移动     （5）变大变小     （6）旋转

14、APP常见的状态：

（1）初始状态（用户看到的第一种状态）

（2）加载状态（加上动效）

（3）空白状态

（4）404状态

（5）结束状态，完成状态（例如：确认订单，订单成功）