神奇的小豪同学

北京 | UI设计师

“网易云音乐”歌曲底层的小活动
关键词：#按钮# #流量#

产品体验：
进入网易云音乐播放底层，可以在页面中下部看到活动入口，点击后跳页进入活动详情。

设计思考：
在之前也有说过网易音乐这里的入口。在视觉方面，该入口黑透做按钮背景，文字上采用两个字色，在关键字上使用网易红增加品牌效果之外还有提示效果，点击之后进入相关页面。在业务方面这里，在网易云中流量最大的核心产品功能就是音乐播放页面，在这里承接活动可以更好的保证活动的流量，保护活动顺利成功执行。

“QQ”简化版本
关键词：#视觉效果#

产品体验：
打开QQ之后，可以在设置中更改QQ的界面视觉效果。

设计思考：
作为较早的国民社交软件，依托于QQ的社交账号拓展了很多的产品产业，同时也造成了使用QQ的用户人群更加的广泛，为了适应人群，不同版本的视觉呈现对应不同用户群的使用需求。年轻人群可以选择更绚丽的动效和页面视觉效果，老年人可以使用简化版的视觉效果，满足不同人群。

“华住会”品牌的选择

关键词：#用户体验#

产品体验：
进入华住会后选择品牌，每个城市中的品牌是不同的，只显示该城市已有品牌。

设计思考：
更新之后，华住会的品牌选择更新为只显示该城市的品牌，相较于之前的所有品牌都有，点击之后发现有些城市并没有这个品牌的酒店，更新后的品牌选择缩短了用户操作路径，简化了用户思考时间，增加了用户体验感。

“抖音”榜提示

关键词：#标签#
产品体验：
在抖音中创作者主页的已发布作品中，部分作品左上角可以看到“挑战榜”的字样。点击该视频进入视频详情，在页面底部可以看到挑战榜的入口提示，点击后进入该榜单的合集。

设计思考：
创作者主页中的左上角不一定是挑战榜，也有热榜等其他视频热门榜单或者是运营活动。

首先是视觉部分的设计，在色彩选择上就是非常醒目暖橙红色的渐变，对比抖音本身的黑白界面配色十分抢眼。在用户方面，在用户主页的视频缩略图上增加创作者正在参加的打榜活动，可以刺激粉丝的进一步互动，强化创作者和用户之间的联系。

“网易云音乐”的陌生人社交

关键词：#陌生人#
产品体验：
在网易云音乐中有一项和好友共同听音乐的功能，同时在更新后加入了陌生人听音乐。在音乐详情页，点击更多按钮后选择一起听中的“开始隐身一起听”。

设计思考：
对于目前最懂用户的音乐产品（个人认为），网易云可以非常好的抓住用户的心态。作为一款音乐软件最好的方式就是用音乐去交流，在隐身一起听中并不是没有门槛的社交，而是给了双方一定的时间去听音乐，听到足够的时间才可以时时的交流，增加了社交的成功率。同时对没有vip的歌曲是不能听的，一方有vip另一方没有歌曲是不能添加到双方的曲库中，在满足用户的同时也促进了产品本身的利益收入。

“高德地图”导航全览缩略图

关键词：#焦虑# #用户体验#

产品体验：
在高德地图中开启导航后，可以看到默认前进方向的路线图，并在左上角有一个全程的缩略图。

设计思考：
这个功能可能是一个比较老的功能设计了，但是在实际操作使用过程中可以很明显的感受到这个功能的实用性，在导航过程中会遇到一种用户的心态问题，类似司机在等红灯的感觉，感觉过了好久却没有变灯带来的用户烦躁，同理这里的情况也一样，在行驶了一段时间后如果看不到还有多少路程是一个痛苦的事情。高德左上角设计了全程路线的缩略图解决了用户在这种情况下行驶的焦虑烦躁，提升了产品用户体验。

“抖音”边缘左滑进入主页

关键词：#用户体验#
产品体验：
进入抖音在推荐页左滑直接进入该创作者主页，在关注页面左滑可以看到一个提示进入主页。

设计思考：
左滑进入创作者主页在交互用户体验方面是一个缩短用户思考的过程，更流畅的操作会使得产品体验更好。同时这样的操作在视觉设计上也可以摆脱宽大明亮的按钮，更好符合整体的视觉要求，呈现更高级的视觉表现。

“美团外卖”订单页的按钮悬浮

关键词：#悬浮按钮#
产品体验：
在美团外卖中点击订单进入全部订单列表，点餐之后可以看到页面下方有一个浮动按钮，提示送餐信息。

设计思考：
我们常见的悬浮的侧边按钮一般是在用户滑动的时候展开，停止的动作的时候收起来。而美团外卖没有采用这样的交互方式，而是采用手动的方式展开，从产品来看，美团外卖这里的悬浮按钮主要是为了提示用户定餐信息，作为信息总是收起展开会使用户烦躁，在视觉上也会有疲劳的效果，所以设计为手动收起展开更符合产品本身的需求。

“支付宝”支付成功后的返回首页

关键词：#按钮#
产品体验：
使用支付宝结账成功之后，页面右下方会出现首页，点击按钮后直接返回首页。

设计思考：
这个按钮在线下付款之后出现，对于常用支付宝结账的用户来说，支付成功之后这个页面并没有更多的功能承载，只有一些任务类的入口，在这里增加一个首页按钮，可以让用户更好的留下，从而引导用户继续使用产品而不仅仅是支付动作。

“美团外卖”的运营活动

关键词：#运营活动#
产品体验：
在美团外卖点单之后会到送餐地图的页面，在页面中有一个小黄人骑车的图标，在图标后会挂一个小旗子，点击后进入活动页。

设计思考：
作为使用美团外卖的用户来说，所有人都要进入这个页面，承载着几乎所有，在这个页面中的动态小黄人对于用户视觉来说是一个很抢眼的元素，除了增加了整体产品页面的趣味性之外，在小人后设计增加旗帜也可以最大程度让用户全部看到，不论是有效还是无效浏览都会增加运营活动的浏览量，保证活动的成功。

“微信”置顶聊天的收起展开

关键词：#用户体验#
产品体验：
在微信聊天页面中，可以看到置顶的对话框区域末尾可以收起入口或者展开的按钮。

设计思考：
这个功能我并不知道是近期更新之后的功能还是之前置顶的对话框太少没有显示出来。不过这个折叠功能确实解决了在实际使用中，置顶对话框不断增多造成了未置顶对话框看不到的情况，并且要下翻几页才可以看到。
针对这样的需要，满足被迫置顶的用户需求，增加收起的功能，在有新消息的时候显示在第一位。强化了用户的使用体验感，丰富了不同用户的不同需求。

“抖音”视频错误时切换至下一个

关键词：#用户留存#
产品体验：
在抖音中浏览视频是时候遇到视频错误的内容直接切换自动播放下一个视频。

设计思考：
抖音刷视频的时候难免会出现一些有问题的视频，抖音在这里的视觉上采用了缺省页的方式设计，增加了裂开的icon图像，减少了用户的思考时间，同时刷到这类视频自动切换到下一个视频播放，减少了用户的操作动作，在裂开的情况下尽可能的挽回用户，最快的引导用户到正常的浏览轨道。

“微信”直播提示

关键词：#标签#
产品体验：
在微信公众号的列表页，正在直播的公众号会在名称后加直播中的标签，点击进入详情页后在页面顶端还有一个直播中的按钮，点击后进入直播详情页。

设计思考：
微信这次进一步提高直播的权重，给我的感觉就是每个月的更新都有增加视频号直播的优化。

这次发现的标签可以让用户更快的看到直播的标签，根据标签更快的引导用户进入到直播页面观看直播内容，帮助公众号的主体增加流量。

“美团”搜索后的页面小交互

关键词：#页面交互#
产品体验：
在美团中搜索后，进入搜索结果页，上推页面的时候页面顶部的小卡片会缩短，下滑时增长。

设计思考：
这个页面的视觉内容其实比较简单，列表属于复用的内容，顶部的卡片为直接到达的内容的tab切换的功能，只是不是切页，是直接触达内容的功能，这里在页面上推的时候卡片缩短为页面留出更多的空间展示搜索出的内容，更好的为用户展示搜索结果，毕竟在美团中的搜索也是一个比较大流量的功能。

“产品经理”收藏金句

关键词：#收藏#
产品体验：
打开产品经理app，点击文章后阅读，长按文章语句，选择后会有收藏的按钮，点击收藏后句子加蓝色底色，同时可以取消收藏。

设计思考：
在阅读类产品中收藏语句的我遇到的不多，尤其是这样的知识型的产品，用户在学习的同时简化了笔记的步骤，可以直接让用户留在产品中，而不是离开到笔记产品中，同时在视觉上设计了收藏后的底色变化，用户可以更快的找到自己收藏金句的位置。


本文原创，未经作者允许不可转载！
更多内容，欢迎关注作者微信公众号：黑马家族！