上篇文章写了一些以导航栏为基础而引发的对不同终端设计差异思考，而后留下了一些问题：不同的终端之间有这么多的差异，那么怎样去设计才能达到一个产品的一致性呢？
首先，需要说明一下什么是一致性，为什么要有一致性？
一致性，即整体、统一，是一个产品品牌的体现。而对于设计方面来说，是根据不同的业务需求，形成这个产品的一套设计标准。这个设计标准可以帮助团队进行设计工作，也可以帮助业务团队充分的理解产品，同时也可以使用户更了解产品的设计过程及用户体验的设计价值，提升客户对产品的理解度和欣赏度。
近几年响应式页面很火，因为页面的设计与开发可以根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整，这是最能体现产品一致性。但往往现在一个产品的功能越来越多，一套界面已经承载不起所有的需求，所以为了适应不同的终端，也就需要不一样的设计。比如淘宝：
淘宝PC端和移动端的页面对比
那么， 产品的一致性需要考虑哪些方面呢？拿之前做的一个项目为例子来探讨一下吧。
1.��视觉。
视觉是一个产品的第一体现，是给用户最直观的感觉，在视觉层面上可以分成下面几点：
（1）色彩。
颜色是给用户最直接的感觉，利用色彩刺激用户的视觉，增强对产品的记忆力，让色彩在用户的脑海中形成一种强势的语言。目前市场上，谈到橘红色，让人想到的是淘宝，说到蓝色，可能第一想到就是腾讯，还有微信的绿色。我们是属于互联网金融企业，又是提供黄金白银交易的平台，所以我们给产品的定位颜色是金色。
两端的页面色彩对比
（2）排版。
版式的一致性可以很好的将用户在体验各终端产品时来感知该产品无意识地传达给用户的一致性体验。像Pinterest，它是全球最大的图片社交分享网站。Pinterest采用的是瀑布流的形式来展现图片内容，无需用户翻页，新的图片不断自动加载在页面底端，让用户不断的发现新的图片。这种独具风格的版式在各终端上都能很好的体现出该产品的特点。而我们这个项目是开户的流程，所以在内容的排版上主要以表单的形式来呈现。
表单形式的排版
（3）控件元素。
控件也是页面不可或缺的一部分，比如图标，按钮。有的时候设计不同终端时的页面时，把象征性符号、图形、字体等控件元素结合起来设计，也会使得用户产生对该品牌有一定的品牌认知，也能达到视觉上的一致。
两端图标的统一
这次的项目使用的组件元素是以表单为主，但也有少量图标和按钮，在样式上都尽量做到统一。
2.功能。
每个产品都要他主要的功能，淘宝的主要功能是购物，微信的主要功能是聊天，就算在不同的终端上进行设计，也不能脱离了主要的功能点。不过，同一产品在移动端和PC端会有一些功能增减，主要基于功能是否属于用户高频使用点，以及终端特性的考虑，比如在手机上依靠GPS定位的相关功能、摇一摇、扫一扫等，这些就属于移动端的特有功能点。开户这个项目，功能主要体现在填写表单上，但也有个别的功能两端有些增减。比如，在上传身份证这个功能上，移动端充分使用了终端的特有性能——拍照，所以，在移动端的开户过程中，用户就可以直接使用手机进行拍照上传。在这里，未上传的时，也会有一个小相机的图标提醒用户可以用手机拍照上传。
移动端可以拍照上传身份证的图标提醒
3.流程。
这个不管是哪个产品，多端上的核心流程大致相同，不然用户在跨平台使用时很可能就懵逼了。这个项目是关于开户的流程，所以在流程上都是三步：第1步，填写基本信息；第2步，选择银行；第3步，填写密码（完成开户）。在一个小的细节上面也有做到流程的统一，就是在最开始的时候，需要手机进行验证，当发送验证码给用户的时候，会有一个小弹窗提醒用户去准备身份证，银行卡等。
两端对流程的统一
如果第一次开户没有开户成功，在上传银行卡那里卡了壳，那么当用户第二次进入时，会自动给用户跳过第1步“填写基本信息”，两端的流程统一设计了。
4.字段。
字段是每个页面上不可缺少的传达给用户最直接的信息来源，因此字段相同，也能让用户识别出这是同一个产品。但是有些场景下需要区别考虑，尤其是在页面概要展示和全局功能部分，移动端往往只将用户最需要的内容放在用户的眼前，该隐藏的考虑隐藏，该屏蔽的需要屏蔽。而在开户这个项目中，最需要体现的就是字段的统一，每一个步骤上的表单填写都不能缺少或增加字段。
【小结】在设计多终端的产品时，需要体现多终端的一致性，也需要搞清楚怎样的一致性设计能给用户提供最好的体验，而不是一昧的追求统一。 如果说一致是全局的，那对比就是局部的。跨终端的一致需要找到一个平衡点，过多会显得奇异、格格不入，而我们更需要的是在差异中寻找一致，也需要结合不同终端的特性进行更好的功能创新，比如PC端的点击，移动端的手势，拍照等功能，看需要怎样的一个方式来统一该产品多终端的一致性。
网友评论