唱我想唱——全民K歌8.0录唱模块设计总结
前言
全民K歌在最近迎来了全新的8.0版本。借此机会，“旧城”录唱模块也迎来它的大焕新。本次录唱改版围绕「更统一」的生产框架、「更丰富」的视觉反馈、「更多元」的唱歌体验，对该模块进行了界面重构与体验探索。
一、旧版本存在的挑战
随着新功能的不断引入，加上原本录唱模块累积的一些体验问题，使得这次“焕新”变得势在必行。对此，我们对问题进行了梳理，重点整理出页面框架拓展性差、演唱中反馈较弱、调音操作复杂、唱歌玩法单一等体验问题。
挑战一 ：「如何规整？」一级分类不明确，布局拓展性差
用户在录唱前需要在模式选择页面决定录唱形式，但旧的模式选择界面的一级分类并不明确，存在概念之间相互交叉的现象；并且页面拓展性差，现有结构难以承载新功能和玩法。
挑战二 ：「如何强化反馈？」演唱进程中反馈较弱，难以对用户产生激励
在旧版K歌中，midi命中、单句反馈等效果表现较弱，且单句反馈各级之间视觉差异度较小，反馈维度单一，给用户带来的激励感不足。
挑战三 ：「如何简化发布？」调音操作复杂，理解成本高
调音台是用户流失的关键节点之一，既要承载音效的调节，也要支持画面模板的更换。旧调音台的音效调节与画面调节区域相互杂糅，功能分区混乱，导致用户对音效和画面认知混淆。同时，随着业务的发展，该页面内功能逐渐堆叠冗杂，增加了用户的操作成本。
挑战四 ：「如何拓展体验？」唱歌玩法单一，难以持续吸引用户
用户似乎已经很难从常规录唱中再获得新鲜感了，那如何创新？如何给用户带来不一样的录唱体验也成为了本次改版的一个重点。
二、改版目标
面对上述挑战，我们思考该如何打造K歌8.0的录唱体验。为此，提出了以下几个目标：
框架定义：打造统一的生产架构
功能优化：增强录唱反馈，提升爽感；简化发布操作，降低理解成本
业务赋能：探索更多唱歌玩法，给录唱带来更多可能性
三、设计方案
3.1 打造统一的生产架构
随着业务的发展，新功能不断扩充，如果没有定义好框架会导致结构散乱和无法扩展等问题。因此，改版的第一步就是定义统一的生产架构，使其可拓展、规范化、有条理并且可快速迭代优化。
3.1.1 重新定义一级分类
首先我们对K歌现有的功能进行重新梳理，让一级分类涵盖不同的演唱形式：独唱、合唱和歌房唱，而片段唱则调整为合唱和独唱的基础功能。
3.1.2 模块化组件
根据统计，在模式页面的功能多达十余种，并且还在慢慢扩展中。为了避免功能无序堆叠，让页面布局更加合理地去展示多种信息也是此次改版的重点。
将模块进行组件化，可以在稳定的页面结构下，针对不同的唱法，为用户提供不同的功能，保证了页面的拓展性和稳定性。我们将页面内的信息进行了梳理，将页面布局进行重新规划，建立模块化组件，分为核心内容区和辅助功能区两大模块。
核心内容区主要承载不同演唱形式的主要内容，独唱主要展示歌词和效果，合唱和歌房唱则展示作品内容。
辅助区域主要是为不同模式提供功能补充，例如演唱相关的伴奏品质、曲风、升降调以及画面效果相关的皮肤、道具等。
3.1.3 统一各类生产链路
在确定主录唱框架后，我们对平台内各类生产流程也做了规范。首先是对生产方式进行重新分类，将视频上传、视频录制和清唱整合成「自由创作」，路径更清晰明确。其次，将各类生产流程的框架也进行了统一，减少割裂感。
3.2 元素用色收归，突出演唱中的反馈，给用户带来爽感和激励
反馈作为用户在演唱中接收到的重要信息。如何降低其他元素的干扰？如何增强演唱中的反馈？如何给用户带来更直观的激励感？在本次改版中，我们进行了以下几个方向的处理。
3.2.1 统一品牌色的应用
旧版录唱一共配置了13款魔法色以及其对应的演唱反馈，这导致整体色彩过于混乱、品牌感丢失。于是在新改版的录唱中，我们在保留专辑封面模糊背景的同时，统一对品牌颜色的进行收归和应用。
在整体延续用户视觉习惯的前提下，将过去的13套魔法色进行了映射收归。
在魔法色背景规则制定后，我们拉取了平台TOP30的歌曲封面进行测试，以验证品牌颜色与不同专辑封面图的匹配度。
3.2.2 强化反馈效果
MIDI作为演唱过程中，用户自我评估的重要一环。在本次改版设计中，通过连续粒子的发射效果，加强演唱MIDI的击中感，给用户带来更直观的命中反馈。
在不同的专辑封面背景下，如何让Combo信息既能匹配不同的背景颜色，又能在界面中突出展示？于是在动效的设计上以「光感」为出发点设计了一套反馈样式。
3.2.3 引入连击维度
在延续过去评价体系的基础上，这次改版加入了连击的反馈。当单句perfect连击累计到一定次数时，就会触发屏幕两侧的连击反馈，且随着连击不断积累，反馈会随之增强。
3.3 优化发布环节
3.3.1 优化页面结构
旧调音台的调音和调模板分区混乱，概念相互杂糅，这导致用户对声音和画面调节的认知混淆。所以在新版调音台，将两个概念明确区分开，将页面分为画面调节和音效调节两个区域，避免定义和操作不清楚的问题。
3.3.2 简化调音操作
通过对老调音台各模块的数据分析，发现功能堆叠，层级多以及不常用功能占用头部空间两大主要问题。根据用户使用习惯，将功能区域分为常用调音区和拓展区，将功能进行简化，减少用户操作成本。
3.3.3 提升换模版效率
将模板套装用横划的形式进行切换，方便用户快速选择。同时，根据之前的用研结果，将模板重新定义为背景+动效，更符合用户认知。
3.4 拓展更多唱歌玩法，给录唱带来更多可能性
除了基础录唱外，本次录唱改版还拓展了如录唱皮肤、KK秀等创意玩法。后续也将持续运营和创新，敬请期待！
四、结语
全民K歌作为用户逃逸现实世界的小小角落，在8.0的设计中围绕更简洁、更有趣的方向在持续探索。皮肤、KK秀等功能后期迭代持续进行中，有任何想法建议，欢迎在评论区进行留言、讨论和交流哦～
原创设计团队：腾讯音乐娱乐MUX
推 阅
荐 读
探索用Figma做游戏UI设计
重新审视图标中的细节
大屏数字人设计实践【ADT】关于深色模式设计的思考
Colorpod 色彩工具 - 探索之路
《和平精英》机甲主题设计 —— 与高达并肩，披甲上阵！第一届TDW，你还记得吗？第七届TDW 2022即将来袭！