现在打开各种设计网站，去寻找App界面设计参考。你会发现如果去掉图标，仅仅去看界面设计，很多App的界面设计差异性非常小。App设计有一种同质化的倾向。
经过这几年的移动创业风潮，大量App设计已经存在，现在设计师遇到的不是从零起步，如何设计一款App的问题了。而是面临各种改版设计的需求，如何设计一款和竞品有差异化设计的界面，这是UI设计师越来越迫切的需求。面对现在App设计趋同的市场行情，如果谁可以做出不一样的设计，那么你就可以鹤立鸡群。差异化设计这对界面设计师也是一个巨大的挑战和机会。
品牌设计是在企业自身正确定位的基础之上，基于正确品牌定义下的视觉沟通。我们平常看到的logo设计只是品牌设计视觉延伸的一部分。因为移动界面设计的同质化严重，所以越来越多的公司重视对App的品牌塑造，希望通过品牌的塑造，使用户快速的对产品形象进行有效深刻的记忆。App中的Logo图标、界面的视觉风格，甚至AppStore上的介绍和宣传Banner等，都是品牌设计的组成部分。App的品牌设计，对移动互联网时代的的产品质量提升带来了更多的可能性。也对设计师本身的平面视觉技能带来了更大的机会和挑战。
移动端产品品牌视觉设计的点：
图标：APP图标、底部导航栏、其他页面的功能图标
字体：字体（APP可以内置字体包变换字体）、字号
页面设计：引导页、启动页、刷新控件
排版：元素的留白
图片：页面的配图、占位图片、页面的情感插画
线下物料：线下的各种物料及其衍生品。
APP品牌设计的步骤
1、发掘产品的气质
2、品牌图形的提炼
3、品牌图形的几何化轮廓
4、品牌图形在界面设计中的应用
5、视觉语言的一致性
当我们看一个人的时候，会根据他的外表+内涵，我们会对他有第一个印象的认知，这个就是气质。APP也一样。App的外表是我们产品的视觉设计呈现，也就是这个产品看起来让人感觉如何。内涵就是App的内容和功能的呈现，就是能否进一步留住用户驻足。所以产品就是这样，呈现什么样的气质，就会吸引来什么样子的用户。
常见的品牌气质
1、高冷气质
2、文艺气质
3、时尚气质
4、活力向上
5、个性张扬
高冷的人自带着一种生人勿近的冷淡气质，喜欢穿着黑白灰。朋友不是很多，不需要融入小圈子。然后严格按照自己任性极致的标准筛选良莠，深交的少，浅交的保持距离懒得讨好。所谓可亲而难以靠近。所以高冷气质的应用不需要讨好所有人，只服务好这个App定位的群体就好。例如（图1-1）的Gucci应用，整个界面只有黑白以及一些色彩丰富的配图，非常的简洁明快，没有任何多余的修饰，隐隐透露出大牌的傲娇。
这个说到文艺气质，其实就是一个字“范儿”，如何才能有范儿？首先要有文化底蕴，素质修养，如果没有的话，装不像的。具体什么样，可以去看看一些诗人，搞民谣音乐的人的装扮，尤其是上个世纪的。穿着宽松的毛衣，戴着圆圆的黑框眼镜，搞一条素色的围巾，拿个老式的手动旁轴相机，留着稀疏的胡渣，或是女生长发飘飘的感觉。所以应用从界面设计到页面内容，都要有足够的范儿，这样才是文艺的彻底。例如（图1-2）最美有物，从界面设计到内容标题的文字都散发出足够的文艺气质。这种范儿可能不是所有人都学的来的，比如让做B2C综合电商的应用学这样的气质就不伦不类，也许这就是产品基因吧。
（图1-2）最美有物的内容模块
所谓时尚，是时与尚的结合体。代表当前世界对社会某项事物崇尚的潮流。是一个时期的流行风气与社会环境，时尚引领潮流，是流行文化的表现。对时尚最为敏感的就是家居、服饰行业。没有人希望自己买来的衣服或者家具是一个落伍淘汰的风格。当前的在界面设计中最流行的就是使用各种几何元素，通过点线面的搭配塑造页面的时尚感。例如（图1-3）男衣邦应用，从启动界面到首页都穿插了非常多的几何线条，界面具有浓浓的几何构成时尚感。
有活力的感觉，就是充满了朝气。Same是一个非常有个性的社交应用。你安装完App打开应用首先呈现的就是两个阳光可爱的美少女。通过开场的短片秀（图1-4），就给人信心满满，自信阳光的感觉。
（图1-4）Same的启动视频
有些人，从头到脚散发出一股吸引你的气息，这就是所谓志趣相投。有些产品也一样，你可以在上面找到和你一样特质的人群。Same定位的用户是90后、00后的年轻人，他们内心世界丰富，喜欢新鲜事物。所以界面内的表情（图1-4），是继line表情之后，对当前年轻人群身份、气质、角色和代入感相当强的作品。
（图1-4）Same的表情设计
（图1-5）Same的表情设计
所以UI设计师需要做的是提炼出的产品气质并转化为具象化的视觉语言。让用户通过界面这层介质感知到你产品的气质。
这个过程与平面设计logo基本类似，其实某种程度上就是设计logo，现在的App图标游戏图标还会使用复杂的光影质感。其他主流的商业应用图标都是极简的扁平图标。所以更需要一个独特的品牌图形。
1、具象图形
通常情况下，具象图形的LOGO设计会更受到移动设计的亲睐。部分原因是这些LOGO图形容易辨认，可以更清晰的表述出应用是做什么的。例如（图1-7）里的应用只看图形就能很清晰的明白这个应用的属性或者应用的功能。只留给大家很少的开放性解释空间。有些应用的图形甚至很聪明地运用了双关含义和隐藏图形。例如OFO既使用品牌的名称，又表达了自行车的图形符合共享单车的属性。是一个非常成功的logo品牌图形。
（图1-7）具象图形的应用图标
2、抽象的几何图形
抽象图形，抽象图形LOGO设计同样很适用于多元化企业，因为它们传达出的是情绪和基调，而非具体的公司类型。一个LOGO未必需要直接反映出公司是做什么的。想想Nike旋风，McDonald’s金色拱门，或是Apple的LOGO。所以有时候App的图标也是如此，更多通过一些抽象的图形传达一些特别的含义。比如爱彼迎的图形背后有四层含义（图1-8）。首先，这是一个字母A，代表了Airbnb；第二，这像是一个人张开双手，代表了人；第三，这像是一个标记地理位置的符号，代表地点；第四，这是一个倒过来的爱心，代表了爱。
（图1-8）Airbnb的图形释义
3、吉祥物
互联网公司非常喜欢用动物做为公司的吉祥物。这些互联网公司的logo有很多是采用让人萌化的动物图案，这成了一种风气，感觉互联网的圈子成了动物园一样。比如京东的狗（图1-9），Tmall的天猫、UC的松鼠，腾讯的企鹅等。当然吉祥物并非只有选择使用动物图形，比如站酷的小酷图形。
（图1-9）吉祥物为品牌图形
我经常和学生强调，绘画和设计是两回事情，也许你会画但并不意味着设计可以做的好。现在主流App的LOGO图形倾向于扁平化设计，可能就是一个简单的剪影图形。比如你要设计一个表现自然或者格调感的应用。设计师想使用“鹿”这个图形。如果直接用钢笔勾勒鹿的图形（图1-10），那么这个呈现的是一副剪影插画。这个图形又很多细节，线条充满了不规则感，这些不规则线条对于一个LOGO设计来说是非常冗余的。
（图1-10）偏插画的未经处理的剪影图形
1、设计辅助线
好的品牌图形是需要对基本图形进行2次提炼，去除一些不必要线条细节，对原有的剪影图形进行几何抽象化。我们经常看到在画LOGO时候出现的各种辅助线（图1-11），这些辅助线以各种圆为参考形。辅助线的作用是帮助设计师用规整的几何图形去切分原有的剪影。让线条更加规整几何化。这样几何规整化的图形已经和不规则的偏插画的剪影图形区分开来了。现在更像一个有设计感的图标图形了。当然现在这样的设计辅助线，在一些设计师中有滥用的嫌疑。在一些不需要的加辅助线的地方，加了很多线条，营造一种专业的感觉。这种做法在有经验的设计师眼中是非常可笑的。
（图1-11）用椭圆切割的鹿剪影形状
2、设计的图形语言
经过几何规整化的图形只能算是一个好的图标，离好的品牌图形还有一段距离。品牌图形一定要有自己独特的设计，讲白图形一定要有自己的特色，让别人一下记住你。例如（图1-12）的设计语言就是流畅柔和的线条，通过这个极简的线条构造了鹿的品牌图形。
（图1-12）极简的线条构造鹿的图形
例如（图1-13）的鹿图形使用的是几何图形做为设计语言，用各种三角形和其他不规则图形。类似七巧板一样的设计拼接出鹿的轮廓。这个鹿的图形具有独特的设计感。
（图1-13）几何块面的鹿图形
3、提取典型的特征
由于移动设计的LOGO需要在一个圆角矩形中展示，并没有那么大面积供设计师发挥。所以需要选取最具有代表的形的局部图形（图1-14），比如鹿的头部是最具有代表性的图形部分。
（图1-14）提取典型特征的鹿头部图形
1、引导页
（图1-15）匠物的引导页
（图1-16）最美有物的引导页视频
2、启动页
（图1-17）Life启动页
如果觉得直接放品牌图形+背景的做法，比较老套的话，也可以尝试在品牌图形上进行2次设计。比如良仓的启动页（图1-18）运用logo图标的典型轮廓进行2次创作。
（图1-18）良仓启动视频
3、刷新控件
刷新控件用于刷新当前页面内容。在我的书中《术与道移动应用设计必修课》中有介绍。目前主流有下拉刷新和上拉刷新两种方式，这两种交互方式有很大区别。以网易新闻为例，我们在看当前页面的时候，使用下拉动作，界面反馈当前页面内容条数不变，而内容更新。而上拉刷新代表是加载。一个页面固定加载一定条数的新闻，从上往下看，看完一定条数，往上一拉，后面的内容继续载入。
方法1使用几何图形
Enjoy的品牌图形有一个非常鲜明的图形是那个波浪线，Enjooy下拉刷新的时候使用了这个波浪图形（图1-19），让品牌图形无处不在。
（图1-19）Enjoy的刷新图形
当然使用的图形也可以是一种图形的设计风格，比如造作的全局是较为硬朗的图形，这点在他的个人中心就可以看出来，他的个人中心（图1-20）都是非常硬朗的直接图标。所以他的刷新使用了一个矩形做为刷新图形（图1-21）。
（图1-20）造作的个人中心图标
（图1-21）造作的矩形刷新图形
方法2使用吉祥物图形
在界面设计中吗，必须有一个设计语言贯穿，这样你的设计才会有特色，这个语言可以是一个图形，也可以是一个吉祥物卡通形象。如果有这样一个形象存在，你的界面设计会一下提升不少的特色。
（图1-22）大众点评的刷新控件
4、占位图片
在界面设计中，很多图片需要考虑数据为空的情况，也有可能由于网络的情况图片可能没有加载出来，这些都需要设计一个默认的占位图片。例如最美有物的品牌图形是一个鹿（图1-23），他的个人中心默认头像就是一个鹿的占位图
（图1-23）最美有物个人中心页
需要注意的是在社交或者内容社区，品牌图形的个人头像有时候是需要慎重使用的，因为那样会让人误以为这是官方头像。
5、界面其他小元素
（图1-24）LIFE的卡片Banner
六、底部导航栏图标
典型的IOS应用的结构是把App的主要模块放在底部导航进行切换，底部导航一般分为4到5个模块。以图标+文字的设计形式进行展示。那么这些图标就可以与品牌图形相结合，加深用户的印象。
方法1：品牌图形应用在首页图标
（图1-25）大众点评、饿了么、花瓣、猫途鹰、网易云音乐首页图标使用了品牌图形
方法2：品牌名称应用在底部导航栏
一些应用的名称是字母构成，为了强化用户对于应用名称的认知，直接把名称做为标签栏的图标。例如MONO（图1-26）应用的标签栏图标，设计的非常大胆，提取logo上面的4个字母M、O、N、O后，直接将其作为图标。但是这种设计策略的缺陷也很大，每个字母和功能模块本身的含义并没有直接联系，对用户帮助理解模块有一定的困难。所以这种方法适合一些极客小众App去使用。
（图1-26）MONO的底部标签栏图标
1、颜色的一致性
在完成了产品的整体风格和功能构架后，我们可以着眼于一些细节层面的设计。比如统一你的产品中，色彩和图形的意义。比如设计一套套标准的配色方案，：用品牌色代表可点击的按钮，用橙色代表与金钱有关的操作，用蓝色代表链接，用户对这些颜色的含义就进行了学习和习惯。让用户对这个App内的颜色形成记忆。例如好物（图1-27）好物每个可点击的按钮都是品牌黄色。
（图1-27）好物界面设计
2、图形设计的一致性
图形设计包含各种插图和图标。对于插图如果是一个人设计的，那么更容易形成统一的风格。
插图的风格和图标的风格也需要保持一致。一些应用的插图设计师和界面设计师是2个人，插图的风格偏卡通或者手绘，而界面的图标设计偏规整。那么这个风格就显得格格不入。比如Same（图1-28）的插图风格和图标风格就协调的非常好。
（图1-28）Same的插图和图标设计
3、元素的一致性
界面的本质是信息传递的一种介质，界面中包含各种繁杂的信息。所以如果我们希望通过设计让界面自己会说明，我们可能会加上一些样式的区分，比如我把标题加粗加大，把辅助信息变浅色变小一些，但这只能区分主次，很难具体说明每一部分的意义；那我还可以给一些信息加上可识别的图标。Life采用的是图标+标题+栏目上下排版形式（图1-29）。这样的设计好处是每个模块很清晰，且用户可以很清晰的对应分类各种子频道。所以设计样式不是随意的选择，单纯的看视觉美学样式。而是需要有效的对产品运营的需求进行支撑。