恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
QQ音乐主题设计
0.0°
2015-09-29 原创作品 APP 举报 10967 28 40 4

因为工作原因,一直没有机会做app界面,刚好这次有个契机,就做了几张界面,整个过程下来觉得很有趣,便纪录下来跟大家分享~

首先,我这次主题的设计限定在QQ音乐的主题设计(不要问我为什么,任性><),这也意味着我不会去改它原有的信息架构。
然后在做这次设计前,我下载了几个同类app,分别看了一下各自的设计、体验了操作的顺畅度和整体的视觉感受。

 自己入互联网这行一年以来的感受是这样:
一个产品的好坏 最大程度取决于其内容(如 有没有干货、用户想看到的与推荐的是否有一致性、是否能准确搜索)即能不能满足用户需求?
其次是功能,操作过程中是否流畅合理?是否人性化?
在功能相近的情况下,设计的重要性就凸显出来了,用户会选设计好的。
这也是我对设计的定义——成就产品

所以在同类几个音乐app的体验下,我对QQ音乐的感觉是:
1.默认主题的设计很酷炫;
2.荧光绿的配色很和谐;
3.感觉这是一个重应用,有很多的功能,加上可能有运营任务,banner很多;
4.最大的一个感受是,界面满满的,有很多可以点的地方,但没有聚焦点,用着用着可能会忘记自己本来想听的部分;
5.操作并不是特别顺畅,可能是想让用户更多维度的发现新歌,所以我在导航栏——“我的/音乐馆/发现”点下来,觉得没有完整的属于自己的界面,一直都是“别人的推荐”;
6.每个相近操作界面的操作手势都不一样,比如推荐里“新歌速递”横向展示,相邻“排行”是上下滑动,而“电台”又是新的 左右都可上下滑动~弱弱的感觉逻辑不够清晰,有点不统一;
7.“发现”里的歌手”和“音乐馆”里的“歌手”是完全一样的,感觉重复了;

接下来我整理了一下qq音乐的信息架构,并且把自己觉得可能会干扰用户的地方去掉,设计了新的线框图。

设计思路&逻辑:
1.首先,一级架构的“我的/音乐馆/发现”的三个改为位于底部,原因:自己感觉国内用户的习惯还是倾向于把底部作为主要操作栏,在talkingdata上看应用排行前十的app都是把状态栏置于底部~(有时间的话,是想设计状态栏在底部和播放音乐在底部两个版本,由于时间并不宽裕就先设计状态栏在底部~)
2.状态栏:用户在听歌过程中,搜索是一个很重要的功能,所以把它置于状态栏中间,不管在哪一part都可以直接搜索;状态栏左边是汉堡,右边是在播歌曲,方便用户在任何时候都可以点进去看正在收听的歌;
3. 想要把“我的/音乐馆/发现”区分开来,每一板块有明显的区别,所以:
a.音乐馆——“多维度,推荐/排行/歌单/电台/MV”,给用户推荐尽可能多的歌;“歌手/分类/专辑”作为下一级,都放在音乐馆里,就是旨在让“音乐馆”具有“发现一切音乐”的感觉;
b.我的——私人歌单,这一屏重点在体验,让用户觉得私人性很强;
c.发现——轻社交,这一屏是让用户更多知道身边人/身边好友在听什么歌,所以我把“歌手”去掉(音乐馆里也有了),然后把“好友热播/好友在场/音乐圈/好友在唱”统一到一个维度上,让接下来的hover与界面产生连动效果;总之,这一屏就是“好友状态与个人状态”;
4.播放器:QQ音乐和网易云都是光碟旋转,在这里我尝试做了一个新的设计,每一首歌,打开光碟->再播放,后面有动效展示;最下栏只有“喜欢、下载、转发”三个功能,是对歌曲听后的体验,把“循环模式”与之区分 放在上面的位置,因为循环模式是对听歌过程中的体验;

配色&设计:
QQ音乐的slogan是“听我想听的歌”,对于我来说,音乐是让我探索未知的世界,去到世界的各个地方,所以我这次设计的主色调是最简单的黑白,就是想让音乐本身简单又纯粹,听我想听的歌,去你能带给我的世界各个角落;
小细节设计:
1.头像采用方形,跟专辑方形统一;
2.顶部状态栏的“在播歌曲”有歌播放时,会做一个旋转的动效;
3.“音乐馆”-> “推荐”下“新歌速度”“热门歌单”等都可以左右滑动,不仅限于三首歌;
4.“我的”里把“猜你喜欢”移到个人信息那一部分,一方面视觉上突出,另一方面不做中间的分割干扰;同时把“开通绿钻”移到名字下面;
5.“发现”里把“好友热播”里右边哪些好友在听的头像去掉,我个人觉得有视觉干扰,我会想点右边好友的头像,但点击效果是歌曲播放而不是放大用户头像,所以直接弱化这一概念,听歌就好;
6.背景为白色,始终感觉白底更耐看,让用户看久了不会疲劳,并给其安全感;

这次设计也算是自己真正意义上第一次做ui界面设计,可能有很多考虑得不周到的地方。但是,这次设计的理念就是:给大众听的任何歌,简单而流畅。

更新:2015-09-29

收藏

28人已收藏

LoriHere

love&amp;peace

  • 11

    作品

  • 31

    粉丝

  • 51

    关注

  • 发布会开场视频
  • 二维码设计
  • DSP信息图
  • 综艺特效

    猜你喜欢

      2015-09-29 原创作品 APP 举报 10967 28 40 4

      QQ音乐主题设计

      0.0°

      你确定要举报QQ音乐主题设计

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2015年09月29日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      40
      28
      4

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录