交互案例分享-Spring音乐播放器


设计流程的过程中,我们往往会把流程设计的越短越好,最好一步完成,这样用户在流程中停留的时间越短,流程的转化率越高。

最近在试用一款叫「Spring」的音乐播放 App,它根据要你要进行的运动类型,节奏频率,偏好歌手来给你推荐歌曲,同时还集成了运动数据的监控功能,很强大吧?但在开始播放音乐前需要先进行 6 个步骤,好像有点夸张,但是体验下来觉得步骤并不算多,反而会让我感受到 App 的清晰和细节,我们来看看这个的交互吧。

在 Spring 播放音乐之前有设置音乐的流程,共有 6 步:

1. 进入设定
2. 设定运动类型
3. 设定运动场地
4. 选择想要的节奏
5. 选择歌手/风格
6. 正式播放

1. 开始设定

打开 App 后看到的界面,很干净,中间的最大的黄色按钮是点击后就可以进入设定,左上角点击可以打开抽屉。

交互案例分享-Spring音乐播放器0

2. 设定运动类型

选择你等会进行的运动,每个运动都有 icon+文字来告诉你,左右划动切换运动类型。

0 (1)

3. 设定运动场地

在室内骑车还是在室外骑车?这个会影响到运动检测的数据,同时也会给予一些安全小贴士。

0 (2)

4. 选择想要的节奏

进入这一步后和之前2步差不多,整个界面仍然保持着一致的风格,在这里自己想要的节奏,同样是左右滑动切换

0 (3)

5. 选择歌手/风格

从前一步进入到这个页面后,会看到界面变成了 iOS 标准的风格布局。也是为了更好的显示这一步要进行的歌手偏好设定,选择你喜欢的歌手,往右拖动是「Play A Lot」,往左是「Don’t Play」,中间是「Play A Little」,操作和理解都非常符合用户的心智模型。

0 (4)

6. 正式播放

最终就进入了最后的播放界面,界面除了音乐播放之外,还有运动数据的检测,有运动时间,公里数,卡路里,地图位置信息等,非常全。运动结束就点击暂停结束。

0 (5)

如果觉得界面中的太小,点击小地图后,地图会投射在「暂停」和「下一首」的下面,很巧妙。

0 (6)
至此,整个播放设置的交互就完成了。

来简单总结一下:

1. 虽然 Spring 的音乐播放流程中有 6 个设定步骤,但「短任务」+「为移动优化的交互」的设计让原本复杂的操作变成了「刚刚好」的感觉,也成为了 App 的特色。

2. 「短任务」在减少用户焦虑同时也帮助快速理解操作,提高效率,每次完成都有 Done 的感觉。

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/669/

(0)
iouedioued
上一篇 2014-09-14
下一篇 2014-09-17

相关推荐

  • Axure手机多屏幕滑动原型案例下载

    网络中有价值的Axure原型案例不多,给客户做的原型或者自己公司内部的几乎没有人愿意共享出来,这很正常。建议刚刚学习Axure的小伙伴儿们不要到找人索要原型,换位思考一下,你付出劳动制作好的成品也不会随意送给…

    2015-01-04
  • 华润创业、建信融通、便利蜂等4家名企春招

    求职奶爸华南最活跃的大学生求职平台旗下公号求职奶爸、校园宣讲会V、名企校招实习,50W+粉丝企业合作请加 QQ 3527488757 或微信 naibabd01(添加请备注公司名称)学生求职请加创始人微信 qiuzhinaiba101全国 | 华润创业全国 | 建信融通全国 | 便利蜂广州 | 卡宾服饰华润创业/ 公司介绍 /华润(集团)有限公司是一家在香港注册和运营的多元化控股企业集团,其前身是 1938 年于香港成立的联和行,194...

    2018-04-08
  • 交互设计基础课

    这个地方都是艾欧的原创课程,你也可以回复评论说你需要的课程由苦逼的艾欧来帮你制作课程,同一类型问题只做一次课程演示。 第一阶段的计划是先做交互设计理论的学习 第二阶段是交互设计的工具篇 第三阶段是交互设…

    2014-09-03
  • 产品设计中关于表格设计的一些经验分享

    由于长时间主导后台产品的设计服务,表格的大量应用,总结了些许经验,通过半个月的断断续续的整理归纳,希望对你有所帮助,欢迎阅读!

    2017-05-18
  • 那些经典交互设计流程与方法,真的足够好吗?

    在传统的交互设计 流程中,比较看重从设计目标建立到最终方案推导过程的逻辑性、终端用户体验与用户心理认知模型的匹配性等,相关的 UCD 设计方法 很多,而基本框架则是大同小异。在规模较大的公司与设计团队里,作为交互设计 师的我们也习惯了运用这种按部就班、环环紧扣的推导方式,帮助自己有理有据地应对各种「为什么这么做」的挑战。

    2017-05-25
  • 你的网站用户体验为什么比竞争对手差

    网站SEO优化用户体验,又是用户体验!总是有一些站长弄不明白他的网站到底哪里做的不好,明明也做了蛮多的网站优化工作,但是与竞争对手的网站相比的时候,优化数据始终差一截。总是有窗口自动弹出不管是广告窗口,还是在线咨询窗口,如果不是用户主动点开,就自动频繁的弹出来,用户关掉一遍两遍,还是弹出来,那么这种设置明显是在撵用户离开你的网站。存在死链或错误链接第一种情况是用户通过搜索目标关键词找到你的网站,想点击进入却发现是无法打开的;第二种情况是...

    2018-02-16
  • 用户至上——何为用户体验

    在这边学习笔记中,主要将讲用户体验是什么、UCD的设计原则、设计原则在项目中的应用和市场、商业、用户不同需求的区分这四个方面。第一:何为用户体验用户体验设计协会将用户体验定义为“用户与产品、服务和系统交互过程中感知到的全部要素。用户体验设计包含构成界面的全部要素,例如页面布局、视觉设计、文字、品牌、声音和交互等。可用性工程协调各个要素之间的关系,并为用户提供最佳的交互体验。”另一个虽然可能不是最佳答案,但是简单有效的回答——就是让技术变...

    2018-04-24
  • UED网站“新视界新体验”运营设计的思考

    2018年3月20号,我们UED网站(ued.z6.gldcg.com)开始首次运营,推送了我们的第一篇文章“新视界新体验——广联达集中采购平台新版设计”,在朋友圈,小火了一把。21号的时候,我对这个事情,又有了新的思考:第一次发文的目的是什么:1、推广我们产品全新界面,新体验;2、推广我们UED的网站;事实上,我们达到了我们的目的,微信群中得到了大家的认可,点赞;朋友圈大家转发和分享;朋友圈留言,要体验我们产品;老客户看到后要求升级产...

    2018-03-22
  • 如何运用预置的内容和默认设置,创造更好的用户体验

    首先出现的数值和设置内容就是默认项。它们的作用似乎微乎其微,但默认项(和它们的设计者)掌握着强大的力量——替用户做决策。本文中,我们会讨论如何运用预置的内容和默认设置,创造更好的用户体验。只有不到5%的用户会修改默认设置用户会假设你已经掌握了他们所有的偏好

    2017-05-02
  • 两个交互设计鸿沟:评估与执行

    通过每次交互,用户都必须克服理解系统当前状态和了解如何改变系统当前状态的双重挑战。设计师可以通过意识到这些鸿沟并用透明的概念模型来消除这些鸿沟,从而为他们提供支持。上周,我买了一款很棒的新蓝牙耳机 ; 但遗憾的是,我花了一个多小时才把它连接到我的电脑上。尽管耳机手册和电脑支持网站作出了承诺,但耳机并未自动与计算机连接。我在重新阅读说明书之后,检查了耳机和电脑,确保它们都已打开,并且翻查了耳机评论以确认耳机与我的电脑兼容,甚至通过将耳机同...

    2018-03-13