浅谈视觉设计提升用户体验——以v9云之家首页视觉设计为例

一、项目背景

云之家是一款移动办公产品，帮助企业打破部门和地域的限制，提升工作效率，激活组织活力，帮助中国企业快速实现移动化转型。

随着各个巨头加入移动办公领域（阿里的钉钉、腾讯的企业微信），云之家的压力也是越来越大。云之家每年都会有一个大版本的发布，2017年的版本便是v9。那在现有版本上我们提出一个疑问：是否突出了工作以人为本，

突出组织中人与人的关系，帮助他们更好、更高效的工作？基于此，我们开启这次探索之旅。

二、为什么做云之家首页

1，现有版本存在的问题：

1.1，云之家跟微信、QQ有什么区别？
1.2，是否突出了工作以人为本，突出组织中人与人的关系？

1.3，怎样让用户更专注更高效？

2，V9的设计目标：

2.1，塑造云之家独特的基因，区别于竞品

2.2，页面有更多的动态，富于变化

2.3，提升用户相互协作和工作乐趣

2.4，提升个人和团队工作效率

2.5，促进个人成长    

三、怎么做云之家首页

1，互联网设计趋势：

随着互联网时代的成熟发展，人们已不再只是为了获取信息，界面的极简性、舒适的阅读感、强有力的视觉冲击力、微动效的惊喜感都成为了提升用户体验的重要部分。

2，云之家品牌形象：

2.1，根据关键词脑爆出更细更多更具体，并在每一点上抽取出更符合云之家的词

在关键词的基础上，经多很多轮的视觉方案评审，最终产生出以下两个方案：

很显然，最终确认的是使用方案二，下面来更详细的解析下方案二。

2.2，“年轻”

个性多样性：随时间变化的背景，刺激感官的色彩。

“时尚”

留白与色彩的完美搭配

“酷”

炫酷动效、独特差异、视觉冲击，随时间变化的背景，独特新颖的场景化设计

3，颜色和icon的新定义

3.1，色彩更加稳重

3.2，icon更优雅，更沉稳

4，卡片式设计

卡片设计其实是一种新的设计思路/风格，而卡片式设计的本质, 是更好的处理信息集合。它是在栅格的基础上更进一步，将整个页面的内容切割为N多个区域，不仅能给人很好的视觉一致性，而且更易于设计上的迭代。而另一个典型好处是可以将不同大小、不同媒介形式的内容单元以统一的方式进行混合呈现，取得在视觉上的一致性，例如google和淘宝等也都在使用卡片式的设计。基于产品内容本身我们也选择了卡片式的设计。

5，情感化设计

5.1，头部添加温馨的文案，让用户以轻松饱满的精神进行一天的工作。

通过时间段、节假日、生日、节气、天气等维度，根据不同情况进行不同的情感关怀与提醒

5.2，情感化文字分享：个性炫出来

根据八张不同时间段背景绘制八张插画组成完整一套。

5.3，趣事雷达，让工作更有趣

当在「首页」下拉界面的时候，会出现一个「趣事雷达」模块，通过这个模块，可以与身边所有的趣人趣事儿连接起来。比如：楼下 7-11 有优惠活动、大神在直播啦、你关注的女神就在你身边不远处、给最近合作的小伙伴点个赞、下班有没有一起拼车回家？等等。

5.4，开启云之家v9的动效设计，增强用户内心的仪式感。

以上就是v9云之家首页视觉设计的心路历程！谢谢你的阅读～如果觉得还不错那就点个赞吧！