# 产品界面体验日记 **Repository Path**: NFUNM059/dairy ## Basic Information - **Project Name**: 产品界面体验日记 - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-05-15 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ## 产品界面体验日记-红榜 #### 1. 「网易云音乐」对于用户的操作 反馈赋有人情味的文字 网易云音乐的每日推荐歌单,可以对不喜欢的音乐进行标记,它则会消失在当日歌单。并且系统会以“我们会更努力向你推荐你更喜欢的内容"回应用 户,使用户取得互动感和对于软件的好感,并且可以鼓励用户进行此操作以此更优化日后推荐歌曲的准确度。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E7%BD%91%E6%98%93%E4%BA%91%E9%9F%B3%E4%B9%90.gif) #### 2. 「腾讯视频」快速移动视频进度的按键 用户在腾讯视频里按压滑块时,滑块外侧叠加了一个半透明同心圆,模拟按钮被按压的效果;拖拽滑块时,滑轨左边的时间和界面中央显示的时间让用户感知拖拽精度,除此之外,因为导航栏与拖拽动作没有关系,拖拽滑块时,腾讯视频隐藏了导航栏和状态栏;并在播放器上蒙了一个半透明深色遮罩,让用户将注意力更集中在视频上和滑轨滑块上。这设计有利于用户的沉浸体验并且使得拖动幅度不过大。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E8%85%BE%E8%AE%AF%E8%A7%86%E9%A2%91.gif) #### 3. 「网易蜗牛读书」书桌界面简洁显示阅读进度 用户点击书桌的界面即会仅显示一本书,可左右滑动,并且最多容纳3本最近阅读的书籍,第4页(点击右上角的图标)即可点击查看更多书籍,切换至常见的书桌形式。一本书页面的展示更简洁干净,进度标签一目了然。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E4%B9%A6.gif) #### 4. 「淘宝」引导商品信息的浏览,可以切换内容区块 淘宝浏览商品的引导设计更便于用户操作,在图片滑动展示处设置详情的跳转,符合信息流统一滑动方向的设计的,使得用户浏览器来更有流畅感。并且移动至下方内容时,上方会出现一个tab,告知用户所处位置,通过点击即可快速精准定位到该位置。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E6%B7%98%E5%AE%9D.gif) #### 5. 「知乎」快捷键切换下一个回答 知乎的问答答案是下滑浏览的方式,难免有些不感兴趣的答案出现,为了避免下滑移动至下一个答案的跨度过长,知乎设置了跳转至下一个回答的按钮,并且跳转时也是沿着向下滑动的路径,不会给人冲突感。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E7%9F%A5%E4%B9%8E.gif) #### 6. 「美团」提示信息 弹出后自动消失 美团外卖点金进入商家界面时,会出现配送时间信息,以向下出现向上退出的交互方式,既吸引了用户的注意,又免除了用户对信息框删除这一操作,更具效用。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E7%BE%8E%E5%9B%A2.gif) #### 7. [豆果美食] 设有烹饪的菜谱浏览模式 菜谱设有烹饪浏览模式,即仅显示大图和文字,且通过左右滑动方式查看,使得用户更集中于菜谱的重要内容,有利于其成功做菜。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E5%8E%A8%E6%88%BF.gif) #### 8. [喜马拉雅]播放和内容进度框一直显示 在喜马拉雅选择某个内容进行播放,底下tab会出现该音频,并且会是旋转的动态,模拟以前唱片的方式更具场景感,围绕在圆盘上进度条也能告知用户信息,点击至其他页面 他就会转为单独附在地下的形式,使得用户随时可以点击查看或更换内容。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E5%96%9C%E7%8E%9B%E6%8B%89%E9%9B%85.gif) #### 9. [薄荷健康]点赞收藏时的动态效果 薄荷健康社区版面对于内容的点赞的效果更具魅力,”加一”的动态内容有利于鼓励用户做出更多点赞和收藏行为,使得社区活跃度更高。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E8%96%84%E8%8D%B7%E5%81%A5%E5%BA%B7.gif) #### 10. [微信]搜索结果和呈现 微信的搜索结果,第一对相对应的内容进行颜色处理,使得更清晰。第二朋友圈的呈现统一为最多两行文字和4张图,具有同一性。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_202005180229591.png) #### 11. [潮汐]不同内容分区的图案区别 潮汐提供的声音依据功能和场景进行区分,不同场景的声音类型显示的图标不一致,但都以圆、矩形为主,既让用户对其声音的分区印象深刻,又不至于不搭和突兀。 ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_202005180234481.png) ![xixi](https://gitee.com/NFUNM059/dairy/raw/master/gif/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20200518023448.png)