https://www.ui.cn/detail/616676.html

作为 UI 设计师来说，都是一群细节猎人，以像素级的细节刻画着每一个需求。日常的体验积累也总能发现那些优秀的设计解决方案，以此来强化自己的设计认知，提高设计思维和变通能力。

定期体验产品，记录优秀的设计解决方案和反思设计背后的思路，有助于提高专业层面的综合能力。黑马哥也会定期为大家带来个人的体验总结，希望可以带给大家更多帮助。本期给大家带来的感官体验内容涉及手势交互、功能区延伸设计、情感化设计、微动效、悬浮动效设计等等。

一、利用手势交互实现自动跳转

随着手势交互的不断成熟，被普遍的应用到产品设计中。利用手势的辅助可以缩短用户的操作路径，通过不断优化用户的学习成本，带给用户更加便利的操作体验。

通过指向按钮的引导可以让用户抵达需求目的，需要用户进行点击操作。针对横向滑动的交互输出中，在连贯的滑动操作中配合手势交互，随着滑动力度的不同可以实现自动跳转。比如开言英语 APP 课程模块中，针对推荐的课程卡片在向左滑动过程中，随着滑动的程度提示“查看更多”和“释放查看”，实现详情内容的自动跳转。对于需要查看更多推荐内容的用户来说，减少了二次点击的步骤，提高了操作的便捷度和使用效率。

二、手势交互带来的切歌体验

手势交互能够带给用户使用的便捷度，不过目前很多产品的手势玩法都还有待用户去挖掘。功能层面是否“暗藏玄机”需要用户的深度体验，如果可以培养用户的使用习惯，带来的便捷度和体验度都会进一步提升。

在 QQ 音乐主页底部标签栏上方会浮层展示播放器，方便用户操作正在播放的歌曲。可以通过左右滑动的手势进行切歌体验，对于盲选歌曲来说非常便利。在不改变当前布局结构的基础上新增功能操作，手势交互是不错的选择，这个隐藏的手势体验你是否注意到呢？

三、拖动进度条实时预览画面

从短视频到长视频，内容量的丰富可以满足用户的观看需求，针对长视频来说进度的设计可以便于用户选取感兴趣的部分。

抖音的进度条设计也在不断的探索新的体验，最近更新的版本中在拖动进度条时，会隐藏其他附属的功能，让界面显得更加简洁。拖动进度条时也会实时预览显示视频画面，辅助用户进行精准的内容确定，提高用户的操作效率。

四、底部功能区的延伸设计