1. 写在前面

经过android QQmusic的洗礼后,我们将战场转到了iOS平台,这是一个更加封闭、竞争更加激烈、要求更为严格的战场。国际版图上,spodify、last.fm、pandora已酣战多时,大陆战场更有摸手、九天、豆瓣fm、虾米早早加入。姗姗来迟的iPhone QQmusic如何后来居上?这是我们继android后在iOS平台上的又一次尝试,我们总结了中间跌跌撞撞、折腾不息的过程,并希望以此积蓄经验和力量。

2. 调整产品定义

“一个可以不断自我完善的解决方案才能真正改善状况并得以更有效地执行。”从android QQmusic开始,我们就已经尝试引入“产品定义描述”(Application definiation statement),鼓励设计团队更早地切入整个产品设计过程。同样是解决移动场景的听歌问题,不同的生态系统会给产品定位与目标受众带来差异,一端是开放的android,一端是封闭的iOS,习惯了磁盘管理思维的中国用户在iTunes中难以适从。“丢掉那根可恶的数据线!”——这是我们整个团队对产品的再一次共鸣。

3. 深入场景 狠抓用户痛点

“细节决定成败。”除了更深入地理解一般性的“听歌”场景,我们还会更多地关注细微的用户痛点,分析用户在iTunes使用过程中遇到的不便:

(1) 家里和公司,iTunes列表难以统一管理;

(2) 追加少量歌曲不得不启动“牛刀“——iTunes;

(3) …

4. iPhone用户使用场景调查

5. iPhone 用户人群分布调查
对用户痛点的精准把握以及行之有效的解决方案,使得这款app在需求层面就切合了用户真实的需要。

6. 餐巾纸式快速原型


“画几笔画比说一千句有效得多。”

经过前面对产品定位的讨论和需求分析,下一步应该是把“想法”表现出来。很多设计师喜欢马上打开各种原型工具,并“单打独斗”地画起图来,其实,要将一个想法转变为实际的产品形态,一支笔和一张白纸(或白板)就足够了。我们鼓励让产品经理一起参与绘制线框图,并即时表达各自的想法。在彼此碰撞中,我们会发现设计对产品的细微影响,这种逐渐培养起来的全局视野能帮助设计师更好地理解产品,当然,产品经理也得以更好地理解设计。

7. 视觉风格提案


交互定稿后正式进入视觉设计阶段。经过几番讨论后我们决定以蓝天白云为主题,打造一个温馨、轻松氛围的界面。

8. 视觉终稿界面展示

根据对于目标用户,属性特征,使用习惯,使用场景,使用时间,使用时的情感诉求,抽象情感的画面化等方面着手分析的两千多份有效问卷中表明:目标用户的教育程度和收入会比较好,爱好音乐的人们在精神上较之会比较感性。用户们在用iphone听歌的时候,80%是在使用耳机,主要使用场景是在路上或是睡前。用音乐作为陪伴,营造出一个自我的空间,在音乐里畅游,从中得获得心灵和情感上的抚慰与放松。因此我们希望,当早上您启动QQ music 的时候,金色阳光洒向云海,就像虽然我不在您身边,但依然在对您说:“ good morning,加油!又是美好一天的开始!”

动态的播放界面,深夜,带您到星辰中去漫步。也可以与您一起去深海里畅游。当悲伤的音乐响起,雨水打在玻璃上,让世界模糊起来。 我们无法触及您所有的感情,但期待与您的感情相会时刹那的交流与感动。(我们对给自己勾勒出的蓝图,也感觉到责任和压力的重大,但我们不畏惧奋起努力。最后做的还不够的地方还请海涵。)

9. 启动ICON

ICON为保持QQMusic一直的视觉识别采用了QQMusic的LOGO为主体配以界面的主色调蓝色。

10. 后记

在整个设计流程中,我们引入了一些细小的变化,成效不错。iPhone QQmusic在上架9个小时后就登上了免费app第一位,评分达到了史无前例的4.5颗星。成绩固然令人欣喜,不过问题同样存在,我们的性能还不够完美,体验还不够流畅,中间还因为对框架缺少深入的理解,导致了一次较大的调整,我们愿以此为鉴,继续前行。

最后,感谢iPhone QQmusic团队,他们为爱音乐的孩子谱写了一首游响停云的乐曲,希望你们喜欢。

(本文出自Tencent CDC Blog,转载时请注明出处)

【转】iPhone QQmusic设计实录相关推荐

  1. Android QQMusic 设计实录

    在android平台上开发音乐播放器是一个全新的挑战.这次通过android QQ music项目实战,总结出一些方法和经验,希望能够对移动平台的设计尤其是多媒体这块提供一些有价值的参考和帮助. 一. ...

  2. 20个优秀的移动(iPhone)网站设计案例

    随着移动互联网的高速发展,越来越多的网站和Web应用程序提供了移动版本.移动网站的设计不仅仅是考虑屏幕尺寸问题,创意也非常重要.因此,今天这篇文章我为大家收集了20个优秀的移动(iPhone)网站设计 ...

  3. 苹果iPhone用户界面设计经验分享

    苹果的iPhone.iPod touch以及iPad等产品为我们带来了许多意想不到的创意和惊喜.认真地咀嚼130页<iPhone Human Interface Guidelines>后, ...

  4. IPhone触摸设计:拇指操作的“热区与死角”

    Part 1 研究背景 1.1 触屏手机界面设计的背景与挑战 挑战1:发展时间短,国内外的研究都尚处在探索阶段,充满未知和不确定. 触屏技术最早被应用到手机上要追溯到1999年(motorola A6 ...

  5. 首次公开,300多页阿里百亿级系统架构设计实录

    高并发系统设计 一年一度的金三银四已经过去了,想必有不少在这个时间段选择跳槽或者入行的朋友都入职了新的公司.对于萌新来说,肯定是增强自己面向业务的编程能力(手动狗头),而对于一些有很多年工作经验的程序 ...

  6. 关于新浪微博iPhone客户端设计与实现硕士论文学习心得

    关于新浪微博iPhone客户端设计与实现硕士论文学习心得 1.SNS系统介绍 SNS(Social Networking Services)即社会性网络服务,主要帮助人们建立社会性网络的互联网应用服务 ...

  7. 苹果获iPhone 4设计和MagSafe电源相关专利-铁石社区-TA云测试平台

    U5384P2T1D7857712F13DT20121205062734.jpg(15.74 K) 2012/12/5 10:29:14 苹果获与iPhone 4设计和MagSafe电源适配器有关的专 ...

  8. Flash 8经典动画设计实录视频教程

    本书由专业动画设计师精心编著,共包括20个经典实例,包括广告Banner.动画片头.MTV.交互游戏等经典动画.在动画的渐进制作过程中,阐述概念与理论.本书在写作方面有两个显著特点:第一,每一章的动画 ...

  9. 为iPhone X设计

    为iPhone X设计 iPhone X(读作:iPhone 10)已经正式发布,并且将在11月3日开始发售. 它拥有一个分辨率为1125×2436像素的超级视网膜全面屏.并且在屏幕顶部有一个切口,在 ...

最新文章

  1. linux系统发送信号的系统调用是,linux系统编程之信号:信号发送函数sigqueue和信号安装函数sigaction...
  2. 计算机组装与维护实例教程,计算机组装与维护案例教学-20210714101609.pdf-原创力文档...
  3. 植物根系微生物组的调控入选中科院科技创新亮点成果筛选
  4. HTTPS配置全记录
  5. AIX学习笔记-第一天简介
  6. SpringBoot 入门篇(二) SpringBoot常用注解以及自动配置
  7. 2.亿级流量的电商网站---Redis
  8. Regularized Gaussian Covariance Estimation
  9. 计算机语言的正交性,什么是“正交性”?
  10. 【快讯通知】江苏省2022年度社会保险有关基数通知
  11. 07,springcloudalibaba_sentinel(流量卫兵)
  12. 《设计模式之禅》观后感
  13. matlab 拟合光滑曲线图,Matlab光滑曲线多项式拟合与样条曲线拟合的两个案例
  14. 从零开始搭建仿抖音短视频APP-开发用户业务模块(3)
  15. 如何删除WhatsApp消息
  16. TCP网络调试助手上提示错误:“1035 未知错误”的有效解决方法,本人实测确实可行
  17. 理解红黑树及代码实现
  18. 小黑屋激活器 提示 设备上还有账户未删除
  19. X.509证书解析程序(C++版)
  20. Delving into Localization Errors for Monocular 3D Object Detection 论文学习

热门文章

  1. 对Django框架架构和Request/Response处理流程的分析 | 疯狂的蚂蚁
  2. win7适合安哪个版本的python?(赠送Python永久使用安装包)
  3. 人脸检测与人脸对齐指标
  4. BBC教学人员谈如何增加英语词汇量
  5. 【STM32】STM32F4开发板简介
  6. YOTA3 开机卡屏 救砖 Fastboot Recovery ROOT权限 2020-0126
  7. 10.1 LED灯实验(A7核和M4核)
  8. 怎么制作出GIF动态图?制作方法其实非常简单
  9. 如何设置企业微信中的微盘中的分享链接的有效期限
  10. 安徽省立法促进信息化健康发展 强化公众信息安全保障