从网易云音乐客户端更新浅析交互设计思路

主要观点总结

本文主要介绍了网易云音乐Mac客户端的更新内容，包括全局框架的拆解、响应式的应用以及框架规划的简单性对后续交互、响应、设计实现的影响。文章还提到了B端产品设计的启示和对比分析方法。

关键观点总结

关键观点1: 网易云音乐Mac客户端的更新

文章介绍了网易云音乐在今年的重大改动，包括桌面端和移动端的精简，回归歌曲推荐的基本盘。对全局框架进行了拆解，包括侧边栏、顶栏、内容区域、底部播放器等模块。

关键观点2: 响应式的应用分析

文章分析了新版网易云音乐的响应式应用，包括窗口尺寸规则、全局组件的规则，以及适配断点的逻辑等。

关键观点3: B端产品设计的启示

文章通过网易云音乐的更新，给出了B端产品设计的启示，包括框架规划的重要性，简单框架对后续交互、响应、设计的实现的优势，以及追求复杂视觉效果的弊端。

关键观点4: 对比分析

文章提到可能以网易云音乐与其他播放器如QQ音乐、酷狗、Apple Music、Spotify等进行对比分析，以更深刻地理解框架对交互、设计的影响。

关键观点5: 课程介绍

文章最后介绍了B端产品设计全能班的新一期招生信息，课程旨在帮助解决工作项目真实问题，或者帮助拥有独立优秀的B端作品集入行或跳槽。

文章预览

最近网易团队终于在百忙之中抽出时间，更新了 Mac 客户端，让 Mac 用户可以拥有这款“口碑爆棚”的 APP 了，真的感觉好尊贵啊…… 网易云音乐在今年的改动比较大，不管是移动端还是桌面端，都做了大量的精简，把一些花哨的功能弱化，回归歌曲推荐的基本盘。 在桌面端，新版本的设计对比之前还是提升了不少，所以可以借这个机会对它的界面框架结构做个简单的梳理，对 B 端的设计也会有很好的启发。 全局框架拆解 我们先从全局框架入手，主要页面包含侧边栏、顶栏、内容区域、底部播放器四个模块。 左侧的导航首先做了优化，增加了 LOGO，移除头像。下方的选项也做了调整，因为我的内容数不少，所以折叠，下方创建、收藏的歌单默认也折叠。折叠后的高度小于整个窗口的最小高度（没法再拖小），目的是为了在默认环境下不出现滚动条 ………………………………