交互案例分享-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

相关推荐

  • 为什么产品与交互你都要懂?

    今天老大给交互设计师和部分视觉设计师上了一堂产品经理的培训课,从实际的项目需求出发,十分受益匪浅,确实有些事情值得去考虑。 老大先抛出了一个问题(据说的某厂的一道面试题):一辆卡车载着货物过桥洞,货物…

    2016-02-29
  • 能够带来更好体验的“浅交互设计”,是对人机交互设计方式的全新思考

    原文地址:https://www.smashingmagazine.com/2016/03/getting-disconnected-shallow-interaction-design-deeper-human-experiences/本文由设计夹设计研究小组 成员杨梦龙翻译校对我们的一切都被连接起来了。我的手…

    2017-08-02
  • 交互设计| 谁说只有APP这一亩三分地儿?上天入地都有它!

    ▽什么是交互设计?APP呗!NONONO,太狭隘!人家已经上天啦!大到航天科技,小到手机APP,都会涉及到交互设计,真可谓是“上天入地”,无所不及。小编通过“四个了解、一个目的、一个原则、一个步骤、一个标准、一个区别”告诉你到底什么是交互设计。▽【交互设计专业概述】“四个了解”交互设计又称互动设计,英文Interaction Design, 缩写 IxD 或者 IaD。它是定义、设计人造系统行为的设计领域。交互设计是一种如何让产品易用、...

    2018-02-08
  • 02案例:用户体验和结婚教练

    用产品经理的视角来看人今天我想讲一个结婚教练的故事。她是我的一个朋友,现在做的工作就是指导30多岁下定决心要结婚的女生,如何能够在一年半之内搞定结婚。她的方法已经帮助了30多个30多岁的女生完成了结婚。这个结婚教练以前是干什么的呢?她以前是一个互联网公司的产品经理。她的这一套结婚的体系内容挺多的,这堂课我想把她最重要的一个环节拿出来分享。这个环节就是如何观察和判断一个人。因为结婚也好,创业找合伙人也罢,都是非常重要的长期关系。改变一个人...

    2018-04-04
  • 移动端搜索功能设计:3个阶段解析搜索流程设计要点

    这篇文章笔者想和大家聊一聊有关搜索功能的设计,搜索功能是每个内容型APP的核心,它的易用性决定了用户是否能从APP里快速找到自己想找的内容,那么决定搜索体验好坏的关键点又是什么呢?这里我总结了两点,“操作的易用性”和“结果的准确性”。看似简单的两点却有很多的学问,笔者把搜索的交互流程划分成三个关键阶段,“搜索前、搜索中及搜索后”,接下来将从这三个阶段逐一分析整个搜索流程中的相关设计。

    2017-05-11
  • 7种方式玩转信息可视化中的时间线设计

    时间常常被认为是一种主观的体验,然而在可视化的表达中,时间却成为了结构化维度。时间帮助我们构建稳健而直观的框架,使我们更好地建立事件间的联系。 按照时间线的方式阐述信息已经广泛应用于企业传播、营销的各…

    交互设计 2015-08-27
  • 全面提升用户体验,海尔卫玺首个智慧浴室体验店盛大开业!

    随着“智慧家庭”的概念不断深入人心。在智慧浴室空间领域,与以往用户单一追求产品的实用性相比,如今用户更倾向于将浴室打造成一个智能化、人性化的空间。基于用户对美好智慧生活的需求,海尔卫玺首个智慧浴室体验店于4月28日在上海盛大开业。开业地址:上海市浦东新区浦三路1515号同福易家丽6号楼2-108海尔卫浴专卖店卫玺智慧浴室体验店咨询热线:(021)50102530海尔卫玺智能马桶盖全系列闪耀亮相自上市以来,海尔卫玺智能马桶盖以高水准的品质...

    2018-05-04
  • Smartisan OS v3.1.0 功能列表(M1 / M1L),创新交互设计“One Step”与“Big Bang”变革安卓阵营。

    本次更新主要增加了两大重磅功能“One Step”与“Big Bang”,前者将常用的点击与分享操作放置于边栏,快捷切换与分享,快人岂止一步;后者可以将大面积按压下的文字区域,智能拆成字和词,你可以自由选择与搭配,同时…

    2016-10-19
  • 产品经理、交互设计、UI设计师工作内容到底是什么?

    |沙龙精选自公众号交互笔记后台经常会有人留言问我一些问题,有的我回复了,有的没有回复,不是我故意无视,而是因为探讨那些问题需要需要些时间,而我当时正好比较忙,等闲下来的时候,这些留言已经被后台定期清空…

    2017-08-02
  • 交互进阶!如何扫除交互设计路上的3大障碍?

    Echo  :目前网上基本没有对做交互设计 师的难点进行系统的归纳和总结。基于这个原因我总结交互设计 师的三大障碍以及如何扫除交互设计 师路上的3大障碍。

    2017-09-14