UI/UX 产品体验日记 01

01、CCtalk-轮播点

【产品体验】

CCtalk线上学习软件，此次留意到它【发现】页中的精品小课排行榜右侧轮播点。一般这种出现在头部展示banner图较多，操作手势也是通过左右滑动即可看到不同的课程信息。

【设计思考】

这种形式用于内容多的去展示也是不错的手法，既能向用户展示更多，又不会让用户向下滑动的页面过长，影响返回到顶部的操作。节省了页面空间，提高用户体验。

j

CCtalk-弹窗

【产品体验】

用户登录后自动进入【发现】页面，下方会出现弹窗提示，显示上一次观看到的内容。点击弹窗，即可进入视频播放的页面，继续观看上次未完成的学习内容。如果用户没有点击弹窗，而进行了其他手势操作，弹窗就会自动消失掉，不影响用户后续操作。

【设计思考】

作为一款学习软件，用户进入都是带着目的性。登录后及时的弹窗，能让用户更快的到达目的，提高效率，人性化设计。

02、淘宝-我的订单

【产品体验】

淘宝商城，一个人手必剁的地方。它当然不会放过能节约你一秒钟支付的时间！

最近剁手的时候留意到，在【我的订单】页，对于未退货的商品信息栏中新增了「加入购物车」的按钮。用户只要点击按钮，便从下方弹出“加购成功”的提示。商品直接进去购物车待付款，就是这么快捷！

【设计思考】

这个功能键即符合用户惰性，让用户对满意的商品复购时不再重新搜索，提高操作效率；也提升了购买率，是个双向有利的功能。

03、芒果tv-轮播图

【产品体验】

芒果TV视频播放，轮播图后面的背景色用的是当前展示图片的同色调去填充整个头部。

【设计思考】

这样根据轮播图变化填充的背景色，给用户看起来视觉感更强，通栏展示的错觉，内容更为丰富。

04、途家民宿-编辑

【产品体验】

途家民宿-主打特色民宿的app。当用户切换到发现页的时候，底部编辑的悬浮框及提示内容最为显眼，滑动的时候提示内容会消失，不影响用户查看其他内容信息。

【设计思考】

悬浮加提示，较强的抓住了用户的第一视觉。发现页主要是以展示用户体验后的一些图文分享，悬浮提示+发文送积分的引导 诱惑下，促使用户去点击发表内容。

05、名字忘记了

【产品体验】一款解压放松app，常见的一些类型都是什么风声雨声沙沙声。但是这款软件多了一种吸猫解压，一下区别于其它同类产品。伴随下方的操作健选择，图中的小猫会发出相应的声响和动作。声音模拟的很真实，生动有趣。

【设计思考】

贴合现在年轻人的喜好，养宠人事居多。现实生活中，养猫确实也是一种解压方式。所有更能引起共鸣，好感度。能支配猫咪是件不容易的事，满足铲屎官们的小愿望。用猫咪悬浮窗的形式在首页凸显出来，让用户一眼注意到，解锁这个新功能。

06、猫耳FM-男女版/搜索词/播放状态

【产品体验】

猫耳FM-喜欢二次元的朋友们再熟悉不过的弹幕音图站,同时也是中国声优基地,在这里可以听电台,音乐,翻唱,小说和广播剧,用二次元声音连接三次元...

【设计思考】

1、【男女身份切换】：进入首页顶部导航左上角，有个用户男/女身份的切换ICON。当我切换女生版后，界面中的内容重新替换呈现。为我过滤掉适合男生观看的内容，这样大大提升我查找、搜索的便捷，甚至为我省掉这一步骤。

这个交互方式一是增加了与用户的互动性，让用户自主切换身份。二是更精准的为不同用户推选出合适的内容，提高用户的使用便捷以及留存率。

2、【热门搜索词】在发现页中，搜索框下面有一些热门搜索词的展示，以及搜索中最火的内容用颜色差异来区分，达到视觉上的关注。

热门搜索词在很多APP上都会被广泛运用到，有的甚至是排行榜的形式展现。为的就是解决用户在无目的性的情况下，为他们做引导作用。

3、【当前播放状态】在底部标签可以看到中间有一个猫咪的IP形象，当有内容和没内容的播放状态都不一样，非常的生动有趣，增加与用户情感上的交流。

07、美团-返回顶部

【产品体验】

在美团底部标签栏中的【首页】按钮发现了2处不一样的体验：

【设计思考】

1、当用户进入首页时，首页的icon是直接用品牌logo去展示的。也跟当前界面呈现的品牌黄色做了呼应的效果。但去到其他分类，就会变成常见的首页+icon样式。

2、当用户在首页进行下滑预览的时候，首页icon就会切换成「回到顶部」的箭头指向性图标按钮，示意用户可进行点击返回顶部。其它分类页的返回顶部则没有指示性变化，直接点击文字+icon回到。

我们常见的返回顶部操作一般是点击标签图标跟悬浮按钮比较居多，但是很多用户并不知道点击标签图标可以返回顶部的操作。美团首页的指引，也许会引发用户对其他页面是否有相同操作的探究。满足探索心理，增加产品互动。

08、淘宝-购物车商品替换

【产品体验】

心仪的东西总是很多，但是money不允许...所以只能先放购物车，购物车塞爆也是常有的事。在改版前，购物车的加购数量是限制在99件（没记错的话）。所以我们只能切换到购物车界面去删除一些商品后才能重新加购进去。

但是，现在只需要在当面弹窗提示中去替换掉购物车中的商品就可以直接加购了。

【设计思考】

改版后的设计：在购物车塞满的情况下，用户只需要在弹窗提示中去完成加购操作，无需再跳转另外界面。无疑是提高了用户的便捷操作。弹窗中出现的可替换物品正是购物车里时间最久远的，也是做了个“先进先出”的道理。最久远的可能正是我们遗忘的、不需要的 ，通过这样的判断去更换。

此设计有2个好处点：1、让用户在当面界面完成加购操作，减少繁琐步骤；2、间接清理了购物车中久远、不需要的商品。一举两得。