揭开“QQ音乐”交互设计的面纱
体验版本:9.7 体验机型:Huawei Mate20 Pro
一、登录界面
QQ音乐界面清新、沉浸感十足,一个“9”的大logo,以唱片的形状作为元素,很好的体现出其音乐APP的特点
登录页面
1. 此页面中交互方式的特点
优:在登陆方式上,QQ音乐只提供QQ和微信两个登录方式,而网易云音乐则是采取多渠道方式登录,QQ音乐这样的登录方式无需其他多余操作,可以给用户流畅的体验感。
优:同时也在登录方式上标注了上次登录的记录操作,方便用户想起之前的操作。
缺:但这样也可能会造成用户隐私泄露。
2. 与网易云音乐的登录页面比较
登陆页面对比
在登录注册界面中,两者都很能体现自家APP的主题风格:
QQ音乐的界面设计特别的清新,采用了多种颜色,同时也富有设计感,向用户传达着自家公司的理念——年轻有活力,让人眼前一亮。
网易云音乐则采用红色为自己的主色调,一片红色汪洋让用户产生极强视觉冲击效果,第一次就能给用户留下很深刻的印象,让用户记住网易云音乐的“红色”。
在登陆方式上,QQ音乐只提供QQ和微信两个登录方式,网易云音乐则采用多渠道登录;QQ音乐的做法是基于腾讯强大的社交网络资源,他们对自己的用户使用量充满信心,网易云音乐则采用多渠道登录的方式,能够吸引到更多平台的用户以及新用户,绑定手机号的方式能够让用户更好的管理自己的账号安全。
但是对于绑定手机号的方式,对于怕麻烦的用户可能在这一步就拒绝再继续往下操作,有可能会造成用户流失。
二、音乐播放界面
QQ音乐的播放页有三个部分,分别为歌曲、推荐与歌词,通过左右滑动的方式进行切换。
播放页详情
1. 此页面中交互方式的特点
优:当对歌曲播放页面截图时,页面就会跳转至如下——分享音乐卡片,方便用户对歌曲的分享。
音乐分享卡片
缺:当用户单击音乐播放页面时,页面会自动弹出如下窗口,QQ音乐的左右滑动不易上手,且用户单击也会触发误操作 (可能是自己网易云音乐用久了,一时没切换回来)。
跳出的菜单页面
优:播放界面最常规的操作是播放/暂停、切歌、循环模式,QQ音乐将这一栏功能置底,放在用户最容易操作的地方,按用户操作频率布局,逻辑清晰,用户体验感好。
底部功能栏
2. 与网易云音乐的播放页面比较
播放页面对比
从整体布局上看,QQ音乐按钮布局就显的比较拥挤,给人一种莫名压迫感,影响听歌体验;网易云音乐的播放界面更简单整洁,图标logo更加精致小巧,将整个界面空间映衬的更空旷大方。
在歌词显示界面上,QQ音乐在原有基础之上更加上弹幕和k歌功能,占据歌词页面,显示的歌词更少,亦是给人紧张的压迫感。而且k歌功能需要用户二次下载,可能会影响用户的体验(但是对最近喜欢上k歌的我而言,这也慢慢变成一个惊喜的地方,相信能吸引一类典型的用户)。
网易云音乐则省去个性功能一栏,尽可能多的将歌词显示给用户,欣赏歌词时应该是很放松的,给用户足够的空旷空间,更有呼吸感。
在播放界面之间的切换方式上,QQ音乐选择左右滑屏切换,满足用户的习惯性左右切屏的操作,而且操作简单易懂,但是个人觉着不容易上手(可能是一种先入为主的观念)。而网易云音乐采取的是点击式切屏方式,操作更加简单,更加给用户一种清爽的感觉。
三、我的界面
我的页面集成了账号信息与自己的听歌记录,布局简洁清新,结合绿色图标给人特别清新舒爽的感觉,更贴近自然。
我的 界面
1. 此页面中交互方式的特点
优:类似于其他影音播放软件,QQ音乐也有自己的最近播放列表,相较其他,这里多了一个“最近播放设置”,可以设置列表内记录歌曲的数量,最多是200首 。
最近播放设置
优:在播放列表里面,会在歌曲后面显示听歌的总次数,记录用户自己的数据,方便用户查看自己的历史数据,给用户一种数据透明感。
播放列表
优:点击个人信息页,系统会记录并计算用户的音乐口味,能将数据反馈给用户,同时也能记录那年今日听歌的记录,能给用户带来惊喜。
个人信息页
2. 与网易云音乐的个人页面比较
个人页面对比
在此界面,QQ音乐以灰白搭配打底,结合绿色图标给人特别清新舒爽的感觉,更贴近自然。网易云音乐主要以白色打底(夜间模式下为黑色),结合经典网易红,形成视觉反差,抓住用户眼球,但也容易造成断层的感觉。
QQ音乐将个人信息入口、会员入口、签到入口等等放在这个界面,这些功能入口都是与用户个人信息息息相关的。这些功能的布局也刚刚好符合“我的”这个词的定位,让用户有归属感。而网易云音乐(安卓端)则是将这些功能隐藏在了侧边栏,用户不大容易找到相关的功能界面。
关于导航栏,QQ音乐和网易云音乐的布局完全相反,前者在顶部栏,后者在底部栏。在一般情况下,用户的操作空间是手机的下半部分,而QQ音乐选择把导航栏放在底部,更加限制了用户的操作空间。相反网易云音乐(安卓端)将导航栏置顶,虽然可能不容易点击切换界面,但是滑屏切换方式很完美的解决这个问题,为用户空出更多自由操作空间。
四、搜索界面
QQ音乐拥有强大的搜索引擎,在搜索栏很显示的告诉用户可搜索的范围、条件(音乐、视频、歌单……)等等信息,简单明了。
搜索页面
1. 此页面中交互方式的特点
优:在输入方式中,QQ音乐可以在键盘输入的基础上进行语音输入,用户可以切换交互方式。
语音输入入口
优:搜索栏里输入内容时,系统会自动进行推荐,并且讲关键词进行标绿,干净整洁。
搜索内容标绿
2. 与网易云音乐的搜索页面比较
搜索页面比较
在“搜索”界面,两者的布局相差无几,主要是在一些小交互细节上的差异。
QQ音乐拥有强大的搜索引擎,在搜索栏很显示的告诉用户可搜索的范围、条件(音乐、视频、歌单……)等等信息,简单明了。网易云音乐则是直接提供用户示例,根据大数据算法算出近期搜索较多的内容作为搜索栏默认内容,用户可直接搜索默认内容也可自行选择搜索内容,更加人性化。
在输入方式中,QQ音乐在数字键盘上增加一个麦克风图标,用户可以使用这个功能进行语音输入,同时也可以坚持键盘输入,给了用户更大的选择空间。网易云音乐则只有键盘输入的方式。
在搜索栏里输入内容时,两者都会自动显示与搜索内容相关的信息,但是信息展现的形式不一样, QQ音乐则是直接以一个新页面展示相关信息,并为每一条相关内容里的搜索关键字标绿,界面更加的清晰;而网易云音乐在一个独立的覆盖在主界面之上的小界面显示,使得界面富有层次感。
五、其他部分
优:当页面下拉时,会出现如下的动态加载图标,可以在提示数据缓存的同时,带来一定程度上的趣味性与灵活。
音乐馆页面
优:底部的推荐icon是会随着日期的改变而改变,如今天是12月23日,icon内的数字就会变成“23”,这一个细节可以加深用户的时间观念。
推荐页面
缺:没有独立的视频模块,视频内容是集成在社交页面与音乐播放页面,如果用户想要看音乐视频的话上手不是很方便。
动态界面
优:听歌识曲模块中的识别效果会动态显示,中部波浪变化动态显示声波效果,很有拟物化特点,对用户做出反馈。同时也有哼唱识别的功能切换,增加了用户友好度,同时也包含识别的历史记录。
听歌识曲页面
优:此页面是我的页面的子页面,增设了两个特别模式模块,分别为跑步电台和亲子模式两种,增加了场景模式的多样性。
更多页面
六、思考与总结
目前中国国内的音乐市场已然相对成熟,QQ音乐作为起步最早的一款音乐类产品之一,在早期凭借着QQ和微信社交平台提供的庞大用户群体,建立了一片天下。
发展至今,QQ音乐已经涵盖了极其庞大的功能体系,包括各种风格的音乐曲库、个性化电台服务。在后期也逐渐搭建起了音乐交流社区,以明星IP带动粉丝用户消费和置入评论互动,不断提高平台的用户活跃度
在前几个版本的QQ音乐的使用过程中,并没有对我产生很好的印象,功能结构复杂,框架不明显,使用体验极差,但是最近几个版本更新过后,使我对它的印象焕然一新。
这一版本的感觉是:大方、简洁、干净,视觉上秉承了简洁和轻薄的扁平化设计,白色的默认主题颜色,大方自然,不显压抑厚重和累赘感。功能的布局上,比之前几个版本更加自然化,板块划分明确、功能结构清晰,更加符合人们使用的思维习惯。
后续迭代开发上也有较大的潜力,其强大的版权和乐库资源也将成为其未来最具有竞争力的优势。
第一篇网络文章请多指教,在此平台上希望能记录自己的成长,也希望大佬们能多多赐教~
作者:SlowStep,产品小白一名,目前正在找实习ing……
本文作者 @SlowStep 。
版权声明
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!