这些基本的提升产品体验知识你应该知道

在UI设计中，我们常常说用户体验至上，什么是用户体验？我们的产品为什么能够留住人？为什么那么多人爱用？这都是值得思考的问题。前几天我在体验一款产品注册输入验证码的时候发现，键盘能够自动获取到手机的短信，这真的是解救我这种每次输入验证码要记两遍的人。后来通过了解才知道是iPhone手机更新iOS12以后，系统键盘增加的提醒功能。

于是我又去研究了经常使用的京东金融，首先我测试了忘记密码页面，输入验证码时他采用的系统键盘样式，同样系统键盘获取到了短信验证码，直接点击验证码即可输入，简单快捷。同时我又测试了支付界面的短信验证，京东金融为了安全考虑，并没有采用系统键盘而是自己开发的安全键盘，并没有获取短信验证码信息，但是作为用户的我并没有感到不好用，毕竟以安全为主。

我想这个例子就可以回答我上面问的几个问题。什么是用户体验？对于一个成熟的产品来说，你的用户爱用、经常用就可以说他用户体验做得比较好。如何才能让用户爱用呢？首先需要保证基本功能满足；其次交互流程合理、最后在前两个都做好的情况下，我们还可以从交互的小细节来可以提升产品体验，从而让用户爱用。以下是我整理的8大交互小细节：

  • 小操作也要及时反馈
  • 让用户操作更方便
  • 强调产品希望用户注意的地方
  • 激励用户进行下一步操作
  • 新功能，引导用户点
  • 加入品牌基因
  • 不经意时制造惊喜
  • 点赞状态跟随

小操作也要及时反馈

反馈不单单是在大的功能页面才用，小操作也需要提供及时反馈，让用户知道正在发生什么，从而有掌控感。这个反馈可以是听觉、触觉、视觉。

以爱奇艺安卓版V9.9.5视频详情页为例，它就是加入了触感反馈，当你点击点赞或时，手机会进行震动（目前iPhone版还未更新），当我发现这个小交互的时候就被吸引到了。当你点赞的时候，就像你刚恋爱时，你男朋友牵你手触电的感觉，加入触感之后让整个交互更加情感化了。同时当你点赞或成功之后，也会及时反馈当前所处的状态，提示成功，从而增强用户的把控感。

让用户操作更方便

让用户操作更方便，这也是我们在做交互细节时需要考虑的，这样可以尽可能的缩短用户操作时间，同时也可减轻用户的认知负担，促进用户下单。

以天猫购物车为例，购物车单个列表可以左滑进行发现、移入夹、删除等功能，而我们长按列表，同样可以展示这三个操作。我们知道侧滑操作是iOS才有的，而安卓版大多数编辑操作都是采用长按，天猫iPhone版2种方式都有加入，可以照顾到更多人的习惯。

强调产品希望用户注意点

产品不单单只是为了用户体验，其最终目的也是为了盈利，因此通过一些小交互也可强调产品希望用户注意的地方。

左图：以大众点评为例，大众点评详情页不断上滑时，顶部会将个人信息和按钮进行置顶操作，这样就可方便用户在浏览过程中随时进行操作。右图：以掌上生活为例，在精选栏目界面像下滑动过程中，底部会提示一个产品的气泡提示，点击气泡会下滑至相关位置的产品。

激励用户进行下一步操作

激励用户进行下一步操作，在一定诱因趋势下，让用户自愿做产品期望他们做的事情，从而激励用户进行下一步操作。

以天猫双11活动为例，从天猫首页界面加入抢666红包为诱导，作为用户看到这样的内容还是很想点进去看看的，当然进入之后也不负众望确实让我抢了红包，领取到了80块的福利，同时下方还有各种任务列表，一步步引导用户去操作，从而达到产品想让用户操作的目的。

新功能，引导用户

引导用户，通过外力引导可以引导用户做产品想让他们做的事情，虽然我们说好的产品会自己说话，但是对于某些新操作，是有必要提醒用户的。

以爱奇艺为例，在首页你看到有一个长按试试的手型引导，这个是新加的操作，在初期长按操作优先在安卓版版才有，但是很多人都不知道这个功能，我也是无意中发现的。在iPhone版上线后，他们在第一张视频图上加入引导，可以更明确的让用户知道有该功能，长按封面后可对视频进行预览、、直接看正片等操作。

加入品牌基因

在产品中合理的加入品牌基因，可以让用户一眼看出这是你的产品，从而提升产品的识别度。下面我找了两款交互小细节中运用品牌基因的案例。如下图：

以转转为例，它在底部标签栏舵峰发布按钮处，刚进页面加载时，会有一个装有发条的小熊在那转啊转，在如今趋同的产品中，很容易就能够知道是转转的吉祥物。以美团外卖为例，下拉刷新时，显示一个袋鼠快递员送餐的小动画，看到它我们很容易就能够知道是美团外卖。

不经意时，制造惊喜

不经意时，在一些小细节处制造惊喜，从功能上来说并没有什么帮助，但是这个惊喜提供了超出了用户预期的体验，就会让用户对产品产生好感。

以腾讯视频为例，在doki明星详情中，为明星打榜后可以继续冲榜，点击冲榜就有很多小爱心从天而降，为用户营造浪漫温馨的氛围，提高用户的幸福感。

点赞状态跟随

当某个功能比较重要时，可能会在多个地方出现，这时候就需要做好状态的数据跟随了，如下图:

以腾讯视频为例，腾讯doki详情页面在文章底部有一个大的点赞按钮，提示用户看完内容后进行点赞操作，但是如果用户并没有滑动到底部想点赞怎么办，所以腾讯在详情页的底部固定有评论和点赞，在交互上就需要做到，点击其中一个，另外一个效果要进行跟随。

总结

作为设计师，我们在设计时除了考虑实现基本功能外，同时还可以考虑如何设计才能够抓住用户，让用户为你的产品买单。以上八个交互小细节其实仔细看，你会发现总结起来就是反馈、提醒、引导、激励这些交互方式，在做交互设计时需要我们落实到细节，加强产品与用户之间的互动，从而提升产品体验的交互细节。

海盐社（公众号）

作者： 风筝KK

赞 (0)

相关推荐

  • 关于动效赋能产品体验的思考

    会AE的设计师有很多,似乎动效已经是设计师的标配,但你懂得如何利用动效提升产品体验吗?什么是动效呢?动效就是使UI富有表现力且让产品易于使用的元素和表现手段. 设计师在工作中经常会收到"我觉 ...

  • 写给设计师和产品经理的用户体验知识（二）

    小编:在<写给设计师和产品经理的用户体验知识(一)>中,@xidea与大家分享了他个人对「用户体验」和「设计」的理解,以及2个设计原则.在这篇文章中,他在抛出了2个设计原则,它们是&quo ...

  • 如何系统性提升中后台产品体验

    自18年6月底介入电商中后台交互设计工作以来,笔者有幸做了很多和以往的交互设计不太一样的工作,除了日常需求的交互设计支持以外,更多的精力放在了系统整体体验提升和设计规范上.本文整理了之前在中后台体验优 ...

  • 设计师如何提升文案体验？

    这边文章介绍具体如何提升文案体验,译自原文下半部分:How to build a better product with UX writing 想要了解什么是关于体验文案编写师(UX Writer)的 ...

  • 十二的产品体验日记-01期

    体验产品,发现优秀设计,知其然亦知其所以然,做言之有物的设计.主要含括了网易云音乐APP.毒APP.Nike SNKRS APP 的微动效交互-等优质APP的体验以及设计细节.小伙伴们可以作为参考. ...

  • 3个小技巧帮你提升用户体验

    3个小技巧帮你提升用户体验

  • 如何衡量提升用户体验？Google新框架－HEART帮你解决！

    你知道HEART 框架吗? 当我无意中听到这个框架时,我就一直在反复思考.骑车回家的路上,我会念叨各首字母所代表的单词,我也把它画在了各个会议室四周的白板上--我深陷其中. HEART是一个用来衡量提 ...

  • 17个提升用户体验的 UI 设计小 Tips

    @应昼雨成 设计中有很多细微的东西要注意,就如UI设计中,元素的统一性,图标风格.段落的排版等等,只有能注意这些细节,你的 APP UI 才算合格. 下面由设计师应昼雨成总结了17个提升用户体验的 U ...

  • 产品体验日记 | 发现优秀的设计-02期

    一个有趣的微交互可能让用户"爱上"这一功能,不自觉地就会点开它,如果在这个交互中引入情感传递功能,比如宠物类主题的产品或功能模块,点击后出现一只淡淡的猫爪,或者一个笑脸等,也可以在 ...