拖动浏览,滚动或双指缩放。打开帮助查看键盘操作。

Yan
开放
合作
聊聊吧
Yan Fontão Boring view
All work

Case 028移动应用设计

Heartbeat

一个健康应用的概念,源于一位虚构用户的一个烦恼:原始数据很多,却没有任何说明告诉他这些数据是什么意思。它把他的体验地图,和把读数变成简单状态的页面配在一起。

我的职责
产品流程与界面设计
项目状态
移动应用概念 · Figma 存档
heartbeat 样机,为这面项目墙用项目的真实页面合成。
为这面项目墙用项目真实页面合成的样机。

01

我的贡献

Heartbeat 是一个移动健康应用概念。文件里的描述要求录入的数据要少,要清楚呈现一个人的健康状态,还要对新冠症状发出提醒。

我围绕虚构用户 John 设计了这些页面,所有读数都是示例数据。

录自 Figma 原型。圆形表盘:先是心率,然后是一次简短的症状检查。

02

从原始数据到简单的答案

这个概念从一张 John 的体验地图开始,分六个阶段,从搜索应用到把某个应用分享出去。他的低谷出现在试用现有应用的时候:他发现这些应用面向的是记录运动、心跳和血压的健康人群,对数字意味着什么没有任何反馈。

这个缺口决定了页面的信息层级。首页开头是心率,旁边是只有一个词的健康状态,再往下是一条时间线,用表情而不是数值来标记每个点。

首页,向 John 问好,心率 126 bpm,旁边是 Neutral 健康状态,还有一条绿色的时间线曲线,上面标着 emoji 表情。
My health 页面,有一个状态摘要,以及血压和咳嗽两张深色卡片,每张都把用户的数值和正常范围做对比,并链接到 Details。
首页:一个读数、一个词的状态,以及一条由表情组成的时间线。示例数据。 My health:每个健康问题都把用户的数值和正常范围做对比。示例数据。

03

当某个读数需要关注时

My health 列出每个健康问题,把用户的数值放在正常范围旁边,所以对比就在卡片上,Details 只需点一下。

一张表格,跟随一位虚构用户走过六个阶段,行分别是描述、渠道、目标、情绪和想法,还有一条从失望升到开心的曲线。
虚构用户 John 的体验地图。其中的引语是用户画像的一部分。
000

使用说明

Yan Fontão
轻点
打开一个屏幕
点击
打开一个屏幕
拖动
浏览项目墙
滚轮
鼠标缩放,触控板移动,双指缩放
− +
拉远查看整面项目墙,或拉近
方向键
在案例中:↑↓ 切换案例,←→ 切换媒体。在项目墙上:移动
空格
打开或返回
Enter
打开
Esc Backspace
返回
Home
回到中心,再回到开场
PgUp PgDn
上一个或下一个频道
Tab
依次浏览项目和链接
R
随机项目
0–9
输入频道号,1–61
?
本页
快捷键

项目墙背景音乐

文件已为网页压缩并统一音量。

开放
合作
聊聊吧

给 Yan 发消息

告诉我你是谁,我会尽快回复。

000

关于 Yan

你好,我是 Yan

产品设计师/ 设计工程师

大多数产品都会在设计和代码之间丢掉一些东西。我的不会:我研究问题、设计产品,并亲手把界面上线,所以你批准的,正是用户最终拿到的。

  • 2018开始软件开发
  • UI + code设计与实现

合作过 Motorola · Ambev Tech · Rei do Pitaco · OneTool · CESAR

巴西 · 可远程、混合或驻场

Yan Fontão 的坐姿肖像:穿绿色毛衣、戴眼镜,手持麦克风。
开放
合作
聊聊吧
开放
合作
聊聊吧
000

加密频道

受保密协议约束

请输入访问码

向 Yan 索取访问码 ↗
开放
合作
聊聊吧
YAN FONTÃO 完整案例