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

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

1. Intimate

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

简介:

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

工具:Mockplus、Sketch

评价:

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

2. Listen

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

简介:

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

工具:Mockplus、Sketch

评价:

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

3. Zero Player

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

简介:

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

工具:Mockplus、Photoshop

评价:

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

4. TEMPO

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

简介:

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

工具:MockplusSketch

评价:

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

5. Re/ Machine Learning & AI Music Player

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

简介:

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

工具:Photoshop, Adobe XD, Apple XCode

评价:

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

6. Musician Hub. Design Concept

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

工具:Photoshop、Adobe After Effects、Adobe Illustrator

简介:

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

评价:

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

7. Spotify Redesign | Mobile & Desktop

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

简介:

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

工具:Photoshop,Adobe Illustrator,Adobe After Effects

评价:

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

8. Melody

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

简介:

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

工具:Photoshop,Adobe Illustrator,Adobe After Effects

评价:

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

9. Human Pitch

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

简介:

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

评价:

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

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

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

简介:

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

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

评价:

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

总结

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

“乐”动人心--2017年10款最佳音乐类APP设计盘点的更多相关文章

  1. 10款最佳SQL Server服务器监控工具

    转自:http://server.51cto.com/sSecurity-587355.htm 推荐 | 10款最佳SQL Server服务器监控工具 服务器是网络中最重要的资源之一,SQL Serv ...

  2. Ubuntu 16.04安装网络流量监控工具Netspeed(附带10款最佳的指示器工具)

    安装: sudo add-apt-repository ppa:ferramroberto/linuxfreedomlucid sudo apt-get update sudo apt-get ins ...

  3. 玩家福音:10款最佳Linux免费游戏

    “我能在Linux平台上游戏吗?”这类疑问正困扰游戏玩家,那么答案就是“快去Linux平台吧!”.开源组织一直以来坚持不懈为Linux操作系统开发不同类型的游戏,在Linux平台下的游戏完全不亚于其他 ...

  4. 10款无需编程的App DIY开发工具

    10款无需编程的App DIY开发工具 你有一个很棒的创意但不会编程怎么办?外包.合伙开发还是从零学编程?这里提供另外一种方式--使用无需编程的App  DIY开发工具.DIY开发工具不仅节省了开发时 ...

  5. 最佳运动类APP-Keep设计与欣赏

    运动类APP是大家手机中必备的一款软件.如果说谁手机里没有任何涉及运动类APP,那只能说真的与时代脱轨了.近些年随着物质生活条件的改善,人们开始越来越重视自己的身体,所以也越来越多的人会进行身体锻炼. ...

  6. 技术大众化--10款无需编程的App DIY开发工具

    你有一个很棒的创意但不会编程怎么办?外包.合伙开发还是从零学编程?这里提供另外一种方式--使用无需编程的App DIY开发工具.DIY开发工具不仅节省了开发时间和资金,更为那些创意无限热爱应用的人提供 ...

  7. 分享一下怎么开发一款图片视频类App,秒拍和prisma

    第一步,分解短视频App的功能 我们在秒拍官网看到如此描述: [视频拍摄及导入]支持直接拍摄及导入手机本地的视频 [照片电影]照片专属特效,轻松创作照片电影 [MV特效]10余款全新MV特效,让普通视 ...

  8. GitHub 上 10 款免费开源 Windows 工具

    GitHub 上 10 款免费开源 Windows 工具 GitHub 是如今所有开源事物的中央仓库, 这个网站最近发布了一个叫做<2016 Octoverse  状态报告>,详细列出了从 ...

  9. 推荐15款最佳的 jQuery 分步引导插件

    当用户浏览到一个网站,它可能从不知道如何浏览,如何操作网站或 Web 应用程序的内容和流程.在这篇文章中,我们编制了一些最好的 jQuery 引导插件列表.你会发现这些插件对于提高你的网站的整体用户体 ...

随机推荐

  1. ThinkPHP中处理Layout模板的问题

    ThinkPHP中的模板引擎内置了布局模板功能支持,可以方便实现嵌套. 其中有两种布局方式,一种为以布局模板为入口的布局方式,但是需要开启LAYOUT_ON 参数(默认不开启) 并且设置布局入口文件名 ...

  2. 永中DCS再添喜讯:顺利签约海信集团

    近日,永中DCS与海信集团一起携手,共创文档在线预览新篇章.出于对永中DCS文档在线预览产品的品质与服务的信赖,海信集团选择永中DCS为其提供文档在线预览技术支持,助力移动化办公(EHR系统)发展,提 ...

  3. .bash_profile 加载

    1.Debian默认的shell是Bash, 1.1 命令行 和 ssh 登录 ,首先读入 /etc/profile,这是对所有用户都有效的配置:然后依次寻找下面三个文件,这是针对当前用户的配置. ~ ...

  4. AspNet Core 初步认识

    Core 的出现对我我没有很大的影响,当时在Core要发布的时候听到周围的人再聊再谈,我没有去太多关注,就是一个屌丝开发人员. 直到又一次偶然见到一位特别喜欢.net的老开发人员谈起Core时落泪了, ...

  5. jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法

    原始form表单值获取方式(手动): $.ajax({ type: "POST", url: "ajax.php", data: "Name=摘取天上 ...

  6. cocos2dx-3.0(14)------SpriteBatchNode与SpriteFrameCache加快渲染

    ----我的生活,我的点点滴滴! ! 大家都知道一个游戏里面会有大量的图片.每一个图片渲染是须要时间的,以下分析两个类来加快渲染速度.加快游戏执行速度 一.SpriteBatchNode 1.先说下渲 ...

  7. 编译器 STVD 与 IAR 的差别 个人体验

    编译器 STVD 与 IAR 的一些差别,这些事个人的体验,欢迎扔砖和指点或者补充. 1:全局查找功能: STVD:全局查找功能全局查找功能比較麻烦.有3个动作. IAR:有全局查找功能比較方便.仅仅 ...

  8. JSP具体篇——response对象

    response对象 response对象用于响应client请求,向客户输出信息. 他封装了JSP产生的响应,并发送到client以响应client请求. 1.重定向网页 使用response对象的 ...

  9. vim各种编码设置问题

    vim各种编码设置问题 vim中主要有四个编码相关的设置,详细是~/.vimrc中: 下面是我的设置: set fileencodings=gb18030,utf-8,gb2312,gbk: set ...

  10. python 创建列表和向列表添加元素方法

    今天的学习内容是python中的列表的相关内容. 一.创建列表 1.创建一个普通列表 >>> tabulation1 = ['大圣','天蓬','卷帘'] >>> ...