🔥 热搜 🔥
上海习近平新疆鄂州父女瓜乌鲁木齐疫情H工口小学生赛高习明泽芊川一笑图包印尼排华
分类
社会娱乐国际人权科技经济其它
🔥 热搜 🔥
上海习近平新疆鄂州父女瓜乌鲁木齐疫情H工口小学生赛高习明泽芊川一笑图包印尼排华
分类
社会娱乐国际人权科技经济其它
查看原文
其他

鹅厂的设计，果然擅长复杂问题简单化

UX设计精选 2023-07-30

The following article is from 体验进阶 Author 设计师ZoeYZ

去年全民K歌的设计团队发了一篇录唱模块改版文章：唱我想唱——全民K歌8.0录唱模块设计总结
原文比较复杂，当时我没有细看，最近再次研究，发现里面有蛮多值得借鉴的思考点。
其中最重要的核心，就是——复杂问题简单化。
现在的互联网产品都恨不得往超级app发展，功能越做越复杂。如何在混乱中梳理出一条合理的脉络，确保用户体验的简洁，不可避免地成为了设计师的难题。
全民K歌这次改版就给了一个很好的案例，他们通过四个步骤，就简化了很多原本看似复杂的问题。
这四个步骤原文并没有明确提到，是我从方案和文章思路整理出的，分别是：
⏳整合概念
🧩简化布局
⚖️统一样式
✨效果强化
接下来，我将帮大家从这四个步骤，分析一下复杂问题简单化的设计思路。


⏳整合概念
看到一个混乱的色板，我们的大脑因为无法理解、找不出规律，所以会觉得混乱、畏惧。

可如果将颜色按照顺序整理好，我们便能一眼看出规律，一点也不觉得混乱了。
因为我们潜意识里知道，可见光的颜色，都可以归类到彩虹的几种类别里，而再简化点，还能分出冷色和暖色：

产品设计也是如此，不怕数量多，只怕零散缺少分类。
1.创作入口整合
全民K歌原本歌曲录制、视频录制、清唱和上传视频这四种创作方式都是零散割裂的。
从使用频率和用户习惯考虑，将歌曲录制单独拎出，将其它三种方式整合成自由创作，外层入口就从四个简化成了两个，对大部分用户来说更好理解了。

2. 功能整合
面对一堆功能该如何是好？
可以像全民K歌这样，把功能分成几种类型。例如录制页，除了录制和模式切换之外，其它功能就可以分为信息引导、内容预览和辅助操作三种类型。
这样一简化，布局都清晰多了。

3. 模块整合
没必要的东西，可以大胆去除。
例如之前换模板和换背景是分开的，但是从模板预览图看来，很多用户第一反应并不会把模板和背景割裂开看，而是以为模板就是附带背景的。
所以改版后，将动效和背景都整合到模板里，更符合用户预期。

🧩简化布局
页面看起来复杂，还可能是因为布局混乱，信息杂糅在一起。
4. 界面分割
例如调音台页，原本将画面调节和音效调节放在同一块区域，通过 tab 来切换。
而且右上角还额外加了一小块画面调节入口，让原本拥挤的布局更显混乱。
改版后，干脆将画面调节全部放到上半界面，将音效调节全部放到下半界面，泾渭分明、简洁明了。
5. 布局简化
有的时候，界面上的东西太多，超出了主流用户的真实需求，那么要做的就是简化了。
例如老版本的调音台内容特别复杂，但是从用户习惯来看，常用的就只有音量和混响这两种而已，其它大量功能很少用到却占据大量空间。
这种情况下，反而要通过 tab 来隐藏不常用的功能，从而只露出常用功能，让页面看起来更加简洁清爽。

⚖️统一样式
做设计经常会出现这样的情况，一开始什么都没有过于简陋，就各种堆叠样式，叠着叠着，有一天突然发现样式太多，越来越混乱了。
全民K歌这次改版也遇到了这样的问题。
6. 统一色彩
旧版录唱页设计了 13 款色调，加上各种反馈图案，视觉规则越来越复杂。
这次改版，将高亮色统一为品牌红色。
7. 细节提升
因为颜色统一了，所以很多细节可以处理得更好。
例如文字的高亮色与非高亮色的对比可以更加明确、进度条可以加上渐变色、效果字可以做得更细致鲜亮……
8. 色彩调整
统一色彩并不意味着要完全丧失个性，全民K歌选择在主题色下，通过专辑封面来展示魔法色。
测试了 TOP30 的专辑封面，以确保展示效果。

✨效果强化
将样式统一优化后，才能在此基础上强化出更好的效果。
下图是原本的录制反馈，当初受限于多套主题色，视觉效果的丰富度和冲击力不够。
9. 重复强化
新版将单个粒子撞击改为多个粒子撞击，让视觉效果更加连续生动。
10. 等级差异
把文字反馈根据等级进行差异化处理，即便不仔细看字，也能略微感受到等级差异。
11. 连续叠加
Perfect 连击后，通过数字和光感来强调连击，增强效果。
总结
我感觉腾讯的产品一直很擅长复杂问题简单化，可能是因为以娱乐为主，玩法再多也不得不考虑到用户的理解能力，确保用户体验能够长期保持小白友好的程度。
但是这个方法，也不是什么场景都适用的。对于电商、办公等功能型产品来说，需要的就是专业和细节，复杂与否反而问题不大。


推荐阅读（点击标题跳转）

一文读懂B端全局导航设计

这些东西设计的够丑，每一个都丑到家了。

B端要吃透系列：工作台体验设计策略




如果你喜欢这篇文章⬇️️
麻烦点赞、在看鼓励一下吧⬇️️

您可能也对以下帖子感兴趣

文章有问题？点此查看未经处理的缓存