每个人都知道,要养成健康的习惯,如锻炼身体、正确饮食,或者练习正念(mindfulness),是多么困难。Fabulous 背后的团队着手解决这个问题的时候,将行为经济学研究引入应用,巧妙地帮助用户实现他们的目标。通过引入 Material Design,这家公司创建出了一个惹人喜爱的用户界面,围绕基于科学的心理强化策略,激励用户从入门开始,直到完成目标。在该应用按照 Material Design 改版设计之后,它的每日下载量增加了 16 倍,获得了超过 97600 次的五星评论,并在 2016 年获得了旨在表彰 “优雅的互动(Charming Engagement)” 的 Material Design Award 大奖。

巧用叙事手法

Fabulous 将叙事手法注入了每个细节,从文案风格到丰富的插图设计都不例外。每一个练习的旅程(原文在这里用上了 “ritual” 这个词,可见有多重视 “仪式感” 的心理暗示作用)都会在用户的故事中被定义为不同的章节。例如,如果用户想要建立一个晚间行动流程,这个流程就会被称为 “一个神话般的夜晚(A Fabulous Night):(您的姓名)将会掌握如何进行一次极佳睡眠的技巧。” 除了用双关强调了时间段和应用品牌之外,Fabulous 更在这里化身为叙事者兼持续存在的仙女形象,帮助用户养成新的习惯。事实上,应用中普遍使用的古怪图标和插图就直接来自故事书中的隐喻:

“这个应用是一个伴侣,引导用户经历一个故事,并为他们提供所需的支持和信息。我们使用了很多风格化的故事书图片来辅助用户实现目标。” —— Taylor Ling,Fabulous 联合创始人

△ Fabulous 创建了简短而个性化的鼓励信,易于阅读和消化。

快捷且充满吸引力的新手引导流程

Fabulous 通过充满活力、身临其境的非凡用户体验,让用户得以迅速融入到一个个 “旅程” 里。一开始,应用立即引导用户开始培养一个令人充满活力的早晨例行流程,包括喝一杯水、吃早餐和锻炼。向左移动的多种元素,沿着弧形轨迹在天空中移动的太阳插图,快速的画面切换,营造出一种实体感极强的活动惯性。该应用专门为用户设计了自选式的新手引导模型,要求用户选中所有三个早间例行目标。但它与常见的自选自定义用户体验有所不同,设置这个操作的用意完全在于激发心理效果 —— 让用户产生出控制感和投入感,类似于向朋友作出承诺。Fabulous 通过保持快速的节奏并让用户有意识地主动做出承诺,从而引导新手用户采取行动,并专注于养成习惯。 Fabulous 联合创始人 Taylor Ling 告诉我们,团队花了几个月的时间来迭代这个新手引导序列,让它尽可能地吸引人:

“我们发现,要求用户按照自己的惯例选择复选框会让他们想:‘没错。我能做到这个。’这个过程会让您感受到这个决定的重要性,就像您即将踏上旅途一般。” —— Taylor Ling,Fabulous 联合创始人

△ 新手引导流程:驱使用户选择一个早间习惯(比如喝一杯水)并用勾选的形式记录完成情况。

使用通知进行操作,而不是骚扰

相关和及时的通知是 Fabulous 让人们改变习惯的关键部分。这些提示并不是不必要的,而是被设计成友好且正能量的提醒。三个元素 —— 一首歌、一张插图和一个倒计时钟 —— 成为执行所需动作的视觉和听觉触发器,有效地为每个用户划出时间和心理空间。在精神层面上,这就相当于有人递给您一双跑鞋,并把您带上跑道。它的工作原理是这样的:铃声用来充当听觉提示,引导用户养成习惯。提示音响起后,最初的屏幕提醒会扩展成为一个设计精美的自定义对话窗口,并带有一个颤动着的浮动操作按钮(FAB)。按下 FAB 即可播放与例行流程相关的歌曲(对于饮水目标而言,这意味着圆润柔和的音调和滴水的音效),在屏幕上显示与目标有关的插图,并在上面覆盖一只倒计时钟。时钟会计算用户完成这一小段旅程 / 仪式所需的时间。

“我们尽量让通知为用户带来身临其境的感觉,所以当您看到您的旅程/仪式的插图时,您会想:‘就这么做吧。’它很温柔,但仍然会为您带来一种责任感。” —— Taylor Ling,Fabulous 联合创始人

△ 点击提示的播放按钮,即可打开一个带插图的对话框,其中带有倒计时时钟,显示完成仪式应该花费的时间。

积极运用 Material 进行设计

在 2015 年使用 Material 对应用进行再设计之后,纷至沓来的积极回应让 Fabulous 联合创始人兼设计师 Taylor Ling 感到 “非常震惊”,每日下载量从 300 增加到 5000,累计获得了超过 97600 个五星评分。Fabulous 还入围了 Google Play 最具创新力应用的决赛圈,同时获得了 Google Play Store 的编辑推荐和顶级开发者身份。从通知和插图,到音效和铃声,Fabulous 凭借着令人愉悦、沉浸式的高效设计风格,一举斩获 Material Design 设计大奖,持续向它不断增长的用户社区散发出无穷的魅力。

看到这里,您也许已经发现了,Material Design 其实并不是一定要那么 “素”。相反,只要您想要给用户带来一段多彩的旅程,Material 也能非常 “出彩”。我们期待着大家能做出更多这样漂亮的设计~

推荐阅读:

【视频】Material Design设计规范的诞生

使用新的 Material Design 工具拓展调色板

Material Design 设计师分享如何快速入门 UX 设计 | Google Play 开发者 FAQ 特别篇

想要赢回玩家, 头十分钟至关重要!

EmojiCompact 表情兼容库

聊设计 | Fabulous 是如何抓牢用户的?相关推荐

  1. 京东末位淘汰 10% 高管 ;聊天宝惊现大 Bug:用户可提现百万;斗鱼回应“人去楼空” | 极客头条...

    「CSDN 极客头条」,是从 CSDN 网站延伸至官方微信公众号的特别栏目,专注于一天业界事报道.风里雨里,我们将每天为朋友们,播报最新鲜有料的新闻资讯,让所有技术人,时刻紧跟业界潮流. 快讯速知 京 ...

  2. 如何设计一个能够扩展到百万用户的系统?

    作者 | Trung Anh Dang 译者 | 弯月 出品 | CSDN(ID:CSDNnews) 设计一个能够支持数亿用户的系统并非易事,对软件架构师来说是一个很大的挑战. 以下是本文涵盖的一些主 ...

  3. 数据库设计——将用户名和密码与用户其他信息分成两张表

    数据库设计--将用户名和密码与用户其他信息分成两张表 好处 (1)面向对象方面考虑用户信息就是用户本身,用户名和密码只是登陆钥匙. (2)性能方面考虑登陆验证的时候列较少,查询速度快. (3)安全性考 ...

  4. 交互设计笔记(4)——理解用户:定性研究

    定性研究 只有定性的研究方法才能发掘更深层次的信息 定性研究与定量研究 定性研究的价值 与定量研究相比,定性研究是以一种更有用的更有用的方式帮助我们理解产品的问题领域.情景和约束条件. 他也能很快的帮 ...

  5. 产品经理 demo html,18个UI demo设计实例,深挖让用户愉悦的小惊喜

    文章分享了对话框及模态窗口.注册与登录页面.导航及菜单.滑动条和切换开关等UI设计实例,希望对大家有所启发. CodePen网站已成为开发者的游乐场.那是一个你可以驰骋想象.开发创造的沙盘.里面既有实 ...

  6. 移动医疗应用遍地开花,却抓不住用户的核心需求

    互联网风口最为强劲的细分市场,无疑是移动医疗.政府利好消息助推医疗O2O孵化,资本催生热潮,这片互联网医疗蓝海,闯进去了,谁说不能造一个财富神话.然而,整个行业在呈现井喷式发展的同时,也有大批医疗O2 ...

  7. 互联网产品设计进阶(12)描绘用户心中的海市蜃楼

    <修炼之道:互联网产品从设计到运营>抢鲜评品! 在我们的身边,经常会有这样的现象.某个项目经过千百遍论证之后,终于可以开始做了.这个时候,老板最关心的是进度,一旦论证通过,马上要在某年某月 ...

  8. 短视频如何涨粉引流?三个小技巧来帮你,人设、细节都要抓牢

    短视频如何涨粉引流?三个小技巧来帮你,人设.细节都要抓牢 做短视频看起来简单,但是如果想要真正的做起来,涨粉引流,其实还是有些难度的.一个成熟的短视频运营者,总是会掌握很多的小技巧,来帮助自己达到目的 ...

  9. 互联网产品设计进阶(5)关于用户体验(边思考边完善)

    首先看一个比较倒霉的用户体验: 早晨起来,发现闹钟没有按照原先设定的响起来. 一边煲水,一边穿衣服,临走前去取水却发现水没有煲好! 到了地铁站,一卡通没有钱了. 却发现机器充值无法识别你的一卡通,必须 ...

最新文章

  1. 视频监控系统供电方式及选择方法
  2. Xamarin iOS教程之进度条和滚动视图
  3. 【人工智能实战2019-何峥】第1次作业
  4. C语言 ##运算符 - C语言零基础入门教程
  5. vue如何把数组转为json数组_vue.js,_vuejs Ajax取得一个数据json数组,vue.js - phpStudy...
  6. 支付系统设计:对账处理(二)
  7. DOM(四)——事件、事件模型(冒泡)与事件对象的功能
  8. matlab meshc函数_MATLAB三维图形
  9. ProGuard正确下载网址
  10. 如何用 Nginx 禁止国外 IP 访问网站?
  11. ssm+共享图书管理系统 毕业设计-附源码151121
  12. html英文特殊字体代码,字体_中英文字体等(示例代码)
  13. 计算机绘图中常用指令,【CAD快捷键运用】CAD常用命令汇总
  14. java 数据库异常,数据库常见异常
  15. 模块七:mixer模块
  16. 微信小程序账号注册和APPID申请
  17. 8K摄像机研发之路有多难?一起了解你不知道的首款国产8K小型化广播级摄像机背后的故事
  18. 腾讯云主机学生版 修改主机名
  19. 揭穿微信朋友圈卖东西月入几万的真相
  20. 华为云,用科技开启智慧化生活

热门文章

  1. 赛灵思的block memory generator用户手册pg058翻译和学习(AXI4 Interface Block Memory Generator Feature Summary)
  2. html5 雨滴特效,canvas雨滴特效
  3. OWL Ontology
  4. Java内存占用过高问题分析
  5. 卷烟流水线工人超30%是研究生
  6. 就在今晚!技术如何赋能跨境电商?微软研发专家与你分享!
  7. c语言 字符映射表,字符集编码与 C/C++ 源文件字符编译乱弹(收集转载)
  8. python绘制热度图(heatmap)
  9. 淘宝获取购买到的商品订单详情PHP展示
  10. oracle中的all_objects,oracle查看所有表all_objects和all_tables的区别