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

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

提交需求

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

0/20
0/200

设计大赛

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

提交完成
感谢您对UI中国的支持和信赖!
“乐”动人心--2017年10款最佳音乐类APP设计盘点
0.0°
2017-12-12 原创文章 教程 举报 1712 7 6 2

借此时机,为大家整理和分享10款优秀的音乐APP设计,满足你视觉、听觉上的完美体验。

在上下班的路上,听几首自己喜欢的音乐来打发无聊的等公交车和地铁的时间是现代年轻人的常态。音乐作为最能鼓动人心的“语言”,也成为了人们在互联网生活里占比例最高的消费活动之一,一款好看,功能又全面的音乐APP往往最打动用户的心。


在当下的互联网音乐服务中,真正算得上是音乐管理软件的是Apple Music。视觉设计精致,全平台统一,在欧美和古典音乐上资源非常丰富,是一流的音乐流媒体服务产品,也是笔者最常用的软件之一。最近也正好关注到,国民原型设计工具Mockplus举办了一场以音乐APP为主题的原型设计大赛,其中也不乏有许多出众的设计作品。借此时机,为大家整理和分享10款优秀的音乐APP设计,满足你视觉、听觉上的完美体验。


1.Intimate


Image title


浏览地址:https://run.mockplus.cn/AzuXw/index.html


简介:


Intimate是一款非常轻量的APP,去除繁杂的功能,打造专业化、个性化、年轻化。打开APP时,会亲切的询问用户当前的心情状态,来自动筛选符合当前心情的音乐,实现智能推送,成为你用户真正懂你的密友。


工具:Mockplus、Sketch


评价:


这款播放器非常简洁,去除了繁杂的功能,操作简单易用,满足基本诉求的基础上,交互方式新颖,整体流程清晰。配色上明艳大气,颇具国际范儿。


2.Listen


Image title


浏览地址:https://run.mockplus.cn/AVmsj/index.html


简介:


Listen是一种潮流音乐生活方式。为沉溺在劳碌中的上班族带来新的轻松与潮流。更具独特的交互体验,让歌曲更能贴近心灵的深处。通过场景、情感等,智能推荐适合当下的专属歌曲,让用户不用在歌海中苦苦寻觅自己的归处。


工具:MockplusSketch


评价:


这款原型的时候会让人眼前一亮,风格非常一致,界面整齐,颜色非常靓丽。同时,界面切换采用上下切换的模式也是与众不同。该原型可以根据用户选择的心情来推荐音乐。产品基于情绪和场景定义产品并进行信息架构搭建,具有新意,视觉写实风与绘画风混搭,交互上不落窠臼,聚焦于用户体验。


3.Zero Player


Image title


浏览地址:https://run.mockplus.cn/HnCNS/index.html


简介:


Zero player是一款能够根据个人喜好,暗号时代,类型等个性化标签,去提供定制化音乐服务的音乐应用。一切从一个问题开始:“什么是好的音乐服务”,作者认为好的音乐服务是用自己最喜欢的音乐装点你的生活。摒除复杂,让一切从Zero开始吧。


工具:Mockplus、Photoshop


评价:


配色舒心,简练大方。个性化的界面设置,别具一格的格局,贯彻整个APP的呼吸按钮升华了体验,呈现给用户强烈的生命力。


4.TEMPO


Image title


浏览地址:https://run.mockplus.cn/mhKpd/index.html


简介:


TEMPO是一款基于运动场景的音乐App,每个人运动时都有自己的节奏,每段音乐也有自己的节奏,使用者可以在40-180BPM范围选择音乐来适应当下运动的速度,或者某一运动对应的适宜节奏速度,当他们调整好合适的节奏速度时,可以在界面内任意切换同速率不同的艺术家的音乐,避免了传统听歌方式速度不统一而影响运动的尴尬情形,解决运动时听音乐不好选的痛点,在一定程度上激励和提升运动表现,不同于一般的音乐播放器的分类方式,TEMPO的音乐是按照运动的种类及音乐的节奏速度划分的,曲库是精准筛选的运动音乐。


工具:Mockplus、Sketch


评价:


TEMPO 最创新的地方,是在健身这个场景进行了深入挖掘,针对特定的 BPM 匹配特定节奏的音乐,提升体验和健身效果。此外 TEMPO 的基础部分也做得不错,首页展示了热搜词、运营 banner 和推荐曲目信息流,保证了内容丰富程度和分发效率。UI 上采用深色主题,蓝绿渐变的品牌色贯穿各处,有自己的特色。


5. Re/ Machine Learning & AI Music Player


Image title


浏览地址:https://www.behance.net/gallery/59378095/Re-Machine-Learning-AI-Music-Player


简介:


电子音乐改变了用户欣赏音乐的方式,纯粹逐利贩卖订阅的音乐APP捆绑了用户的选择,静态的播放列表一成不变。Re是一款机器自动学习,利用人工智能技术的音乐播放器,能够智能地推送让你惊喜的音乐。


工具:Photoshop, Adobe XD, Apple XCode


评价:


这款音乐播放器背后有一套完整的智能识别引擎,设计纯粹澄净,尽力降低用户在使用中的干扰因素,使用中机器还会进一步学习,深层次了解用户需求。


6.Musician Hub. Design Concept


Image title


浏览地址:https://www.behance.net/gallery/59026917/Musician-Hub-Design-Concept


工具:Photoshop、Adobe After Effects、Adobe Illustrator


简介:


这款APP功能聚焦于音乐人寻找自己想要的乐队,建立账号后就会在首页呈现完整的乐手信息,通过内置的乐器筛选器还能精准寻找自己喜好的不同对应流派。


评价:


整体信息架构简单清晰,仍然保持了完整的功能性。


7.Spotify Redesign | Mobile & Desktop


Image title


浏览地址:https://www.behance.net/gallery/48938545/Spotify-Redesign-Mobile-Desktop


简介:


作者对Spotify进行了出色的再设计,整体色系采用红灰两色,增强了现代感和高贵感。后台也会通过你的使用习惯智能推送用户的偏好音乐。


工具:Photoshop,Adobe Illustrator,Adobe After Effects


评价:


风格大胆,在一款成熟的音乐APP下仍然做出了突破和创新。


8.Melody


Image title


浏览地址:https://www.behance.net/gallery/56387011/Melody-Music-app


简介:


作者设计这款APP的宗旨是让用户能够在忙碌的生活中,能够碎片化地欣赏音乐。


工具:Photoshop,Adobe Illustrator,Adobe After Effects


评价:


界面清新洁净,风格化突出。


9.Human Pitch


Image title


浏览地址:https://www.behance.net/gallery/37918137/The-Human-Pitch-Mobile-App


简介:


这是一款概念性的音乐社交APP,用户可以结交和参加跟自己志趣相同的社群,参考巴纳姆效应,能够通过声线识别你所对应的特性,从而加入符合你特性的群组。


评价:


这款APP立意十分有深度,作者关注于种族隔离的社会问题,用这种基于音乐和声线的方式成为了隔离种族的新形式。作者希望通过这样一个设计,以轻松而讽刺的方式。呼吁人们相互理解包容,和谐共存。


10.韩熙载夜宴图-故宫出品


Image title


浏览地址:https://www.behance.net/gallery/22662667/-The-Night-Revels-of-Han-Xizai


简介:


南唐末年,朝廷重臣韩熙载为避免陷入政治的泥潭,故意沉溺于夜宴笙歌、不问世事。后主李煜心生疑问,派宫廷画师顾闳中深夜潜入韩府,目识心记,画下了不朽名作《夜宴图》。


根据这幅院藏珍品,故宫博物院以专业的学术资料、丰富的媒体内容及创新的交互美学,精心研发了《韩熙载夜宴图》App。


评价:


整个app的设计希望是一种沉浸式的,让观者能够多角度解读了解这幅名作,采用了手势操作的方式进行一些页面切换。设计用心,交互赏画模式独创极致。


总结


以上的10款音乐类APP设计风格各异,各具特色,包括播放器、音乐社交和音乐艺术鉴赏等形式。伯牙鼓琴,游鱼出听。音乐类APP迷人之处在于,可以将艺术、科技和体验自然结合,从而将人文精神和技术达到和谐而统一。希望以上的作品带给你灵感和启发。

更新:2017-12-12

收藏

7人已收藏

mo311

一名PM,分享个人与设计(UI/UX等)相关的经验与教程。

  • 205

    作品

  • 271

    粉丝

  • 5

    关注

  • B端和C端产品设计有哪些差异?
  • 用户体验之如何设计一个完美的新手引导流程?(附带案例)
  • UI设计、交互设计、UI交互设计的联系和区别是什么?
  • 前方高能!15个外挂级别的设计插件, 助你效率逆天

    猜你喜欢

      2017-12-12 原创文章 教程 举报 1712 7 6 2

      “乐”动人心--2017年10款最佳音乐类APP设计盘点

      0.0°

      你确定要举报“乐”动人心--2017年10款最佳音乐类APP设计盘点

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

      0/200

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

      点击上传附件

      对谁可见:

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

      您确认要推荐?

      该作品发布时间:2017年12月12日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      6
      7
      2

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

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

      登录

      手机号

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

      登录
      第三方账号登录