3个产品细节，让你看看大厂是如何做设计的！

作者通过生活中的观察，介绍了 QQ 音乐、美团外卖和大众点评三款 APP 产品中的设计细节并分析了设计动机，与大家分享。

QQ音乐中的场景化设计

今天我们的分享内容是 QQ 音乐中的一项设计细节：当用户网络畅通的时候，打开 APP 进入的页面为「推荐」页面；当用户无网络的时候，打开 APP 进入的页面为「我的页面」。

这个设计细节无疑是考虑到了当用户没有网络的时候进入「推荐」页面也无法播放音频的场景，所以进行了区别化设计，在用户打开 APP 时判断用户的网络情况，再决定进入哪个页面。

无网络时进入我的页面，可以播放已经下载到本地的音乐。说实话，这个设计细节真的是我完全没有想到的，听闻之后真是赞叹不已。

随后又体验了虾米音乐和网易云音乐，这两款产品在此处的设计如下。

1. 虾米音乐的做法

虾米音乐在此处做了同样的设计，有网进入推荐页面，无网进入我的页面。看起来和 QQ 音乐的做法完全一样，只是不知道是哪个产品中先出现的这个功能。

看到这里，在感叹两者的场景化设计之妙的同时，也产生了担心，即用户是否能理解为什么我打开了 APP 却没有进入首页，而是进入了我的页面呢？这里是否要给用户一个说明，为什么进入的是我的页面？

2. 网易云音乐的做法

网易云音乐在做了和以上两款产品类似设计的同时，在进入我的页面这种情况下，同时给出了一个 toast 提示「无可用网络，你可以播放已下载的音乐」，通过一句话把用户进入此页面的原因，和用户可以进行的操作都进行了说明。

看到网易云音乐的设计，我又返回去删除了虾米音乐和 QQ 音乐，并重新下载，再次体验这种场景（某些提示只有第一次进入该场景才会出现，就像 APP 的引导页只有第一次打开 APP 才会出现），发现 QQ 音乐在无网络进入我的页面时同样有一个提示，但只是说明了网络状态，并没有说明为什么进入了这个页面，以及用户此时可以做什么操作。

大家千万不要小看这几个字的差别。当用户进入页面时，如果只提示用户「无网络」，那么用户的第一反应很可能是：没网啊，听不了歌了，那我退出吧。

这样对产品来说，「用户使用时长」和「用户日均打开次数」两个关键指标就会下降。而像网易云音乐那样，直接说明用户此时可以进行的操作则就可以在一定程度上避免这个问题。

美团外卖中评价功能的设计细节

在美团外卖 APP 中，我们在对订单评价时，如果选择了1星和2星评价则匿名评价选项会自动勾选，以保护用户在进行差评时的信息安全。

在体验过美团外卖的这项功能后，又查看了我们最常用的几个带有评价功能的产品，即淘宝和京东，它们的匿名评价功能如下：

△ 淘宝

淘宝的做法是，进入评价页面自动勾起匿名评价选项，在这之后即使你取消勾选，并选择了差评，匿名勾选按钮也不会自动勾选。

看起来这里的设计好像已经比较长时间没有被注意过了，我觉得至少可以在取消勾选并选择差评之后，再自动勾选匿名评价，并给用户一个状态变更提示。

△ 京东

京东的做法则是进入评价页面后没有自动勾起匿名评价选项，并且将评价修改为1星或2星时，匿名评价选择也没有被自动勾起，这里面应该有比较大的优化空间。

为什么美团外卖和淘宝存在这样不同的设计？我猜测：在进行差评时，产品方最重要的事情是考虑给出差评的用户的人身安全问题。所以淘宝在这里就进行了一刀切的设计，只要评价那就默认匿名。

美团外卖为什么没有默认匿名呢？可能是因为不匿名评价对他有价值。

试想一下如果你在购买外卖时看到了同事、朋友的好评，那么是不是就有较大的可能性去购买商品？并且由于外卖的距离性，我们看到同事朋友的评价的概率还是比较大的。所以美团外卖没有选择默认匿名评价。

当然还有重要的一点，美团外卖是默认隐藏用户的手机号码，商家和骑手只能通过一个虚拟号码联系到买家。

大众点评APP人性化的导航功能

大众点评应该是我们比较熟悉的产品了，周末偶尔不知道吃什么的时候，一般我会在上面看看附近美食店的评价来选择，其中的店铺详情页内置了导航功能，让我们不必切换地图 APP 就能直接查看路线。在寻找美食的时候发现了一个体验很好的设计，就是「实景图」功能。

在大众店铺详情页点击地址一栏后，自动进入导航页面，此时页面上目的地附近会出现「实景图」按钮，点击后进入下图3的页面，页面中会显示你要去的地方的实景图。

实景图功能，对于第一次去陌生环境，方向感很差的小伙伴们非常友好。我们经常会遇到跟着地图导航已经到了目的地，但是又因为店铺不在十分显眼的位置所以找不到的情况。实景图功能可以方便用户快速地找到店铺，避免因为用户找不到店铺而导致用户流失。

实景图页面包括商户正门图和网友为你指路，商户正门图有利于用户更快速地找到店铺。

网友为你指路也是非常友好的功能，从用户的角度出发，以第三方的角色再次对店铺的位置进行描述，与商户正门图形成互补，这样就在用户的脑海中形成了目的地以及周围环境的认知。

两者结合后基本解决了用户到达目的地后找不到店铺的问题，使用起来体验很好。

欢迎关注作者的微信公众号：「设计的威严」