蚂蚁森林，是如何做好体验设计的？

　　蚂蚁森林是一款让设计师幸福感爆棚的产品，毕竟这个朋友们都在用、不为消费娱乐、让世界变得更好。顺便，还得了个联合国“地球卫士奖”。

　　四年前蚂蚁森林正式上线，无数用户在其中践行自己的“ 低碳美学 ”。如今，当产品使用用户数已超5亿，在这样的高度和广度，需要给到用户一些更新的体验。

　　那么，设计在其中能做些什么呢?

　　今年蚂蚁森林升级之初，设计团队就定下了三个关键目标：

　　「真实」：建立更多真实世界的映射，让用户更有沉浸感;

　　「细节」：融入更多故事和彩蛋，让场景活起来，传递“天更蓝，心更暖”的体验;

　　「高效」：让用户体验更轻松。

　　风格，让蚂蚁森林更真实

　　每一个蚂蚁森林的设计师，在做设计前都被要求到真正的森林地块去走访。

　　初到蚂蚁森林时，“ 荒芜 ” 是对大环境的*印象，代表着造林所面对恶劣条件。“有序” 是迈入林地后对蚂蚁森林的又一感受，代表着人类在其中稳步推进。

　　然而真实世界的天空、地面和植物与手机屏幕相比，有着更多细节，也意味着巨大的视觉差异：

　　上面两张图是很好的对比案例，那么，通过设计语言怎么表达真实还是虚拟?我们在抽象和真实之间，到底选择谁?

　　为了便于描述画面，我们可以用图形、配色、质感和视角这样四个要素来进行设计：

　　如上图所示，图形、配色和质感越往右边走，我们的视觉感官就会愈发真实。

　　但*的真实往往细节过多、成本高昂，对产品设计来说未必是好事。因此，经过多版本尝试，我们把改版的视觉风格定位在了“微质感”上。

　　用最焦点的主树及主场景来说，是这样的：

　　通过减少大面积几何色块，并合理增加阴影、高光反射面，可以有效塑造层次感和真实感。同样的手法还被应用在界面中的其他视觉元素：

　　除了这些场景元素以外，产品中还有很多功能以按钮的形式出现。

　　作为画面的一员，他们同样需要在不影响固有认知的前提下，配合做一些视觉改变，使得界面中所有元素互相配合，形成统一的视觉感官。

　　在阿拉善，设计师一路坐着吉普车从沙漠边缘进入，穿过层叠的沙丘之后又突然来到一片绿洲，可能是对蚂蚁森林演变的一种*的体验。

　　因此，运用“时间”和“空间”技巧，我们想把这种真实感受送到用户面前。首先在构图和透视上，我们使用更具纵深感的平行透视，将用户目光焦点送到远方。

　　随着用户种树的进度，画面会从沙漠慢慢变成绿地。

　　大色块的做法只能通过颜色表达变化，差异性有限，给人的视觉冲击并不够强。通过由近及远的视觉变化，搭配微质感，可以让用户明显感受到种树如何为沙漠带来绿色，同时白天和夜晚的差别也会更大。

　　细节，让蚂蚁森林更有趣

　　在最初设计页面时，就有构想一只可爱的小青蛙。

　　想当然地，我们认为绿地里会有青蛙。但当实地去蚂蚁森林地块探访后(是的，每个蚂蚁森林的设计师都必须要去现场走访一次)，才发现沙漠环境里那么干燥，完全不可能出现青蛙。

　　虽然被现实打了脸，不过在最终的方案里，我们还是保留了这只青蛙，并且还为它配上了一只白色的蝴蝶， 许愿在蚂蚁森林将沙漠真正变成绿洲的时候，这些小动物都能自由自在地生活在其中。

　　未来，也许保护地的小伙伴们也可以来这里做客：藏狐、黑颈鹤、菲氏叶猴……毕竟，有树、有动物、有鸡，才是我们热闹的蚂蚁森林。

　　随着视觉纵深的扩展，横向能否也给用户更多探索的空间?

　　常见的交互方式是“左滑右滑”，但实验下来因为不容易被用户发现和误操作概率高，所以最终选用了“ 陀螺仪 ”这种更有趣的交互方式来实现横向场景的用户感知。与此同时，还为其他的彩蛋留出了余地。

　　白天，通过左右晃动陀螺仪可以在页面最左侧发现一对放风筝的小朋友。而在晚上，页面的右上角还能看到沙漠的银河。大家可以自行打开支付宝，点进蚂蚁森林里面去体验一番。

　　我们希望通过这些有趣的小彩蛋，为用户营造出更多开放性故事感，让整个产品“活”起来。

　　整合，让蚂蚁森林更高效

　　除了视觉升级之外，此次蚂蚁森林改版还对产品功能进行了整合。四年来，不断迭代的功能已经让我们的森林变得“不堪重负”：6个能量球、能量保护罩、好友浇水、红包、营销资源位……

　　当极限情况下，可能连基础的用户体验都无法保障。为了给界面减负，我们从数据出发，首先将一些不常用的功能进行收纳整合。

　　比如放话被挪到了与好友互相收能量的模块附近，更符合用户动线;攻略更适合作为新人引导融入在产品试用过程中，因此收纳起来让出了宝贵的空间。

　　现在森林主页就有“ 蚂蚁庄园 ”的入口，并采用了场景化(非功能化)的方式来呈现。

　　我们相信游戏化产品更适合把事物融入场景中，并不会影响点击率。所以，我们把“合种”从icon按钮拿了下来，当作画面里的一部分去展示。经过线上测试，合种的点击率提升非常明显。

　　细心的小伙伴肯定已经对界面右下角的“找能量”功能很熟悉了。

　　当观察了无数位用户每天反复穿梭在好友列表和好友主见之间，少则数十次多则上百次点击后，我们就在思考有没有更高效的用户互访方式。

　　通过“找能量”，用户可以快速访问一个有“行动点”的好友主页：有能量可收、有能量快消失、有红包未领取……借助算法，整个体验过程变得更加 “傻瓜” 和 “快捷”。从数据上来看，用户活跃度和使用深度都有了明显的提升。

　　贵阳航洋动漫职业学校是贵阳市教育局批准(贵阳市教[2010]15号)设立的跨专业(包含计算机平面设计、动漫与游戏制作、影像与影视技术、绘画等专业)、多门类、全日制中等专业职业学校，同时也是一所实行准军事化管理的学校。