超五亿用户的蚂蚁森林是如何做好体验设计的？

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

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

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

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

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

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

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

风格，让蚂蚁森林更真实

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

细节，让蚂蚁森林更有趣

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

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

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

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

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

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

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

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

整合，让蚂蚁森林更高效

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

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

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

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

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

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

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

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

回归公益初心，给用户更好的体验

游戏化的方式做产品，不代表要做一个真的游戏。

公益产品是互联网环境中难得的一片净土，让设计，给它更好的用户体验。因为蚂蚁森林，我们选择每天早起收能量，选择骑共享单车而不开车，又结识了一个个一起种树的人，在蚂蚁森林的每一秒，每一克能量，都因设计变得真实、有价值。视觉化的升级并不单纯只有感官的改善，进而也会带来产品体验和业务数据的提升。

当然，新的视觉风格上线后，是不是所有人都喜欢？

答案是否定的，我们也收到了不少用户的宝贵建议，到现在也依然在持续优化颜色、细节。所以，屏幕前的你，对蚂蚁森林有什么好的建议？

作者微信公众号：「AlibabaDesign」