如何你的设计更有说服力？

2019-11-11

设计原则，在方案输出时，可以将设计原则作为方案的自检工具，这样在方案内审时，面对领导和同事的质疑，除了说“大厂都是这么做的”这样苍白无力的解释外，还有更多的设计原则做支撑。

一、一致性

一致性的益处：对用户来说，一致性可以降低学习成本，对开发团队来说，可以减少错误，降低产品的维护成本，提高代码和设计的复用率。对企业来说，一致性意味着产品的不同模块要有相似的外观、感觉和行为，这种特性会被扩展到企业其他产品中（比如Adobe旗下的产品都严格保持着相同的标准），有利于强化用户对品牌的认知，建立品牌忠诚度。

一致性的弊端：很多设计师容易被这一原则而禁锢，进而成为设计师偷懒的借口，设计师有时为了强调一致性而忽略了特定情境下的用户行为和使用模式，所以在设计时不能只关注用户的感觉和品牌认知，要根据特定场景敢于创新。

一致性可以从以下几个维度分析：

1、交互行为一致性，交互行为一致性又包括操作方式，控件，控件位置等。拿最近做的项目举例，「转到银行卡」和「信用卡还款」虽两个不同功能，但尽量使模块内控件，控件位置及操作方式保持统一。

2、视觉表现一致性，包括风格，色彩，文字，图标，图片等。风格和色彩的统一比较容易理解，这里详细说一下图标和图片如何保持统一。

如何做到每个图标风格，细节，体量感上的统一？

1）保持图标的复杂程度或简约程度统一

2）不使用潦草、手绘的造型，几何形更容易达到统一

3）保持图标的维度统一（二维/三维）

4）保持图标阴影、渐变等样式统一或均无样式

5）保持图标颜色或图标背景的颜色统一

6）保持图标的尺寸和比例统一（体量感）

7）保持图标线的粗细统一

8）保持图标圆角大小统一

如何做到图片的一致性：

1）图片的处理方式一致（尺寸比例，圆角，投影）

2）图片的风格一致，图片风格是否保持统一视产品属性而定，像淘宝这样的电商平台想要保持图片风格的统一性简直要了店家的命，但是图片的处理方式可以做到统一，比如淘宝的商品图大部分是灰色背景等。

3）文案的一致性，文案的人称，风格保持一致，网易云音乐的文案都是用的第二人称，且具有很强的趣味性。

二、优先级

优先级可以从以下几个维度分析：

1、功能优先级：把握核心需求，突出亮点功能，拿最近做的项目举例：转账主页面功能优先级最高的是「转到银行卡」「微转账」，所以在页面布局、所占比重上强调这两个功能，同时上滑时两个按钮变小冻结在页面顶部，方便用户快捷使用。

2、内容优先级：内容分级，突出核心内容。拿最近做的项目举例：代金券详情页，根据用户使用卡券的场景，以及数据分析得出的内容优先级对内容进行布局与设计。将优先级最高的代金券二维码放在用户视线最先触达的位置，当用户上滑时，底部出现全局浮动的按钮，可快速显示二维码。

再比如，转账后的状态页面，用户最关心的内容是转账后的状态及转账金额，其次是收款方信息以及转账备注，将信息进行整理、归类、隐藏、删减，避免不重要信息对用户获取重要信息时的干扰。点击箭头可查看更详细的转账信息，最后的页面设计如下：

3、交互优先级：主要路径清晰，减少干扰和分支。如下转账流程中，根据用户每一步骤的目的与使用场景进行信息呈现，该出现的时候出现，不该出现时隐藏，分步骤进行，使转账这一主路径清晰明了，减少其他信息对用户的干扰。

4、视觉优先级：重要的视觉信息第一眼看到，主要次要信息有所区分。如微信钱包页面，收付款和钱包的视觉优先级明显高于下方的腾讯服务。美团首页上方虽都是功能按钮，通过图标的体量、大小、位置拉开彼此层级，突出展示「扫一扫」「付款码」「红包/卡券」「骑单车」这些功能，很好的引导了用户视线，完成产品目标和用户目标。