产品体验日记

前言

以下是本人一个月的产品体验日记，通过体验更多的产品来记录和提炼各类产品UI设计方面的优点，加强自己对产品设计的理解，提升自己的总结能力。今天和大家在这里分享，方便大家理解所以放的GIF图较多，PC端浏览为佳，请大家耐心等待。以下纯属个人观点，如有不足之处望大佬们轻喷~～

1、荔枝-录音

点开荔枝的录音页，左下角的头像可左右滑动，下方的轮播点也随之滑动。滑动后会更换下一个这篇文章的读者及其录音，方便了用户通过滑动头像就可以直接听到下一个读者的录音，简化用户操作步骤，并且读者的轮播顺序根据点赞数量排序。

2、懒饭-首页-合集

懒饭的合集板块中，当用户点开视频进行浏览时左右滑动切换下一个视频，同一板块的内容平滑展示下一个视频，如果切换到下一板块内容时，以立体旋转效果来区分板块之间的差异。

这里最有趣的是视频最上面的轮播条和播放进度条是合二为一的，轮播条的随着视频内容切换，然后转换成视频的进度条，进度条播放完后切换下一个视频。这一精心的设计既能让用户清晰的知道模块里面有多少个内容和视频的播放进度，又可以节省界面的使用率。

手指向上滑动时教程详情页会从底下滑出，手指往下滑时教程详情从上往下收回，这样一来方便了用户在做美味时观看制作视频和阅读教程详情之间来回切换，不需要专注点击某个地方。

3、腾讯体育-个人中心

腾讯体育—个人中心页中的用户头像，其右下角的角标显示当前的登录方式，让用户很清楚登录账号的的详情和关联的平台。

金刚区“嚯”那里和下面的“嚯！HOBBY HOUSE”点击之后都会跳转到小程序，不过跳转到小程序的分类不同，点击“嚯”会跳转到“嚯”小程序的首页，点击“嚯！HOBBY HOUSE”下面的aj1会跳转到小程序aj1的分类页。“嚯！HOBBY HOUSE”把商品外放吸引用户点击，很好的利用的用户引流到小程序。

4、京东-评价晒单

京东的评价晒单页中，当用户打出五星好评时，随后在五星好评附近会有一个放烟花的动效，类似于社交软件中的点赞一样，给用户传达轻量化的情感反馈。

反之当用户给下面的物流服务给出较差的评价时，会在对应的服务下方弹出一系列标签，供用户选择，很好的解决文字输入带给的用户惰性。

5、岛App

岛是一个青年文化兴趣社交的App。“岛”底部的标签栏设计很新颖，图标大胆的采用了无字设计，分别代表着比较常见的“我的” “首页” “消息 ”，特别符合这款产品的调性，彰显着其十足的个性。选中状态用青色小短线显示，使界面看起来整洁。

 

标签栏下面的发布功能微动效设计巧妙，和首页结合在一起。点击首页的时候首页的图标切换成青色的发布功能图标，表示当前选中的页面是首页，这时点击发布可编辑内容发布。点击“我的”和“消息”的时候首页图标才会出现，这样的设计来节省空间使界面更简洁。

6、考拉海购-商品详情页

很多电商app都会在商品详情页里的第一张轮播内容那放置视频，其余的放商品主图，“考拉海购”也不例外，它在商品详情页里的第一张轮播内容也是一个视频，但是当你滑动屏幕观看另外商品主图的时候，视频的播放按钮会缩小展示屏幕左侧，用户点击可直接观看商品视频，无需用户在返回才能播放视频，操作更快捷。

7、淘宝-频道广场-哇哦视频

在“淘宝—哇哦视频”浏览视频时，当用户上下滑动时可切换下一个视频，双击屏幕时点赞视频，单击屏幕时视频会缩留出右侧空间。该空间展示发布者的所有作品的缩略视频，可滑动并点击观看，这时上下滑动屏幕切换的视频都是该发布人的作品，而且当发布人在直播时（图3），直播会一直置顶在右上。这样的交互细节方便用户操作快捷，不用点击发布人头像进入主页观看其作品。

8、最右-发现

在“最右”的发现页里，用户可发布语音动态，而且语音框会根据用户的录音时间展示录音框的长度，这让用户清晰的区分短录音和长录音，录音框还加入了IP形象设计，这样既形象有趣又让用户加深对品牌的记忆。当发布者在线的时候，会在发布者名称下面显示在线的状态，这样更容易激发用户与用户之间的互动。

9、芒果TV-首页-精选

在芒果TV首页的精选分类即将上线板块里，点击影视海报会播放该电影的预告片，这有点像电影院购票大厅里的大屏幕轮播预告片，吸引用户关注，提高视频的点击率。

10、玩吧-登录页

玩吧的登录页，经过第一次登录之后玩吧会记录你上一次的登录方式，用角标的方式，显示在上次登录平台图标的右上方，这样的方式来提醒用户上次的登录方式。而且会在头像处加入情感化设计，引起用户共鸣。

11、百度云-登录页

百度云的登录页里，在登录按钮上方的插画可左右滑动，这有点类似于引导页。百度云利用这样的设计，吸引用户注意力，让用户在正式登录产品前预览和理解产品主要功能，看完再登录，顺理成章。

12、 Boss直聘-发现-分享知识点

Boss直聘分享知识点里的右下角头像里有个小三角角标，指引用户打开匿名功能，这个匿名功能名字和头像都是随机生成的，这样的设计既有趣，又能很好的保护用户的隐私，让用户大胆的在里面分享吐槽公司等内容。

13、驾考宝典精华版-分类选择

“驾考宝典精华版”首次登陆时的分类选择页中，当你未选择城市点击“下一步”时，会在“下一步”那里会弹出“请您选择城市”的非模态弹框提示你选择城市，大部分产品都会选择出现在屏幕中间的地方。“驾考宝典精华版”选择出现在用户即将要进行下一步操作的地方，采用这样的设计既不用挡住页面的内容，又能做到提示用户操作，非常的巧妙。

14、bilibili哔哩哔哩-视频播放

“哔哩哔哩”在播放视频的时，会自动识别人物。打开弹幕时，弹幕会下沉飘过，不会遮挡人物，从而使一些喜欢看弹幕的用户也能很好的观看视频，不会错过人物的每一个动作。

15、微信-朋友圈

微信更新了深色模式之后，在通过头像进入别人的朋友圈时，如果是日间模式，头像下面的下划线中间那显示着是一个小太阳图标，如果是深色模式下划线中间那显示着一个小月亮的图标，不得不佩服这个小设计非常的细腻，让注意到的用户倍感惊喜。

16、图虫-个人中心

在图虫的个人中心页里，上下滑动屏幕，头像的大小会变化喔，手指往上滑动屏幕头像会逐渐变小，固定在导航栏里。往下滑动屏幕时头像会逐渐变大，小小设计给产品增添了一丝趣味性。

当头像固定在导航栏里的时候，头像下方的分类选项，选中状态文字比之前选中状态的文字要大很多，使其在界面中显得醒目，让界面变得简约大气。

当文字变大的同时底部标签栏“我的”这个选项会变成一个产品色填充的“刷新”功能图标，去除了传统的上拉或者下拉刷新，利用点击刷新让用户触手可及。

17、斗鱼-首页悬浮按钮

在刚打开斗鱼App时，斗鱼首页右下的悬浮按钮会将里面的功能图标快速切换两遍，让用户快速浏览悬浮按钮所代表的主要功能，吸引用户点击。 然后悬浮按钮固定“加号”图标不变。

18、微信-扫一扫

微信的扫一扫功能终于可以识别多个二维码了，当有一个二维码的时候微信的扫一扫流程是直接跳转的，当有多个二维码的时候会显示多个绿色的“进入”图标，供用户选择进入，在生活中支付宝支付和微信支付常常会放一起，而有时候只识别了支付宝支付就会出错，这时需要用户返回扫一扫界面重新操作，这样既麻烦又浪费时间，所以现在的微信扫一扫功能可谓是解决很多用户的痛点。

19、微博-微博故事

在微博首页，顶部导航栏下面的头像点击后会播放微博故事视频，未点击之前，头像外部的圆圈是品牌色，当用户点击头像播放微博故事视频之后，头像外部的圆圈会置灰状态，用此来提醒用户是否浏览过此微博故事，以及当有新的微博故事视频更新了，可以做到提醒用户去浏览的目的。

20、转转-个人中心

转转底部的个人中心图标，点击后，个人中心图标会摇头晃脑的左看看右看看，仿佛有人拍了拍他的脑袋一样，这样的微动效设计非常贴合实际场景，提高了产品的趣味性。

21、高德地图

在使用高德地图搜索好目的地位置，选择出行方案时，底部的方案详情板块可左右滑动切换方案，滑动后地图的详情随之而变化。当用户向上滑动底部方案详情板块时，路线详情会全部显示，这时左右滑动方案详情板块路线详情也随之变化。这样的设计非常便捷用户操作不用返回上一层页面来选择路线。

22、高德地图

打开高德地图进入首页时，如果当天下雨了，首页会显示下雨的场景，这样的设计十分贴切，显而易见的天气场景，随时提醒用户做好出行的准备。

这时本人第一次写的产品体验日记，有不足之处望指点，分享就到这里了，希望能对各位有用