Human 是我最常使用的运动记录应用。与同类应用不同，Human 主要记录的不是步数或卡路里，而是运动时间。当每天的运动时间超过 30 分钟，用户就会得到一个勋章；如果超额完成，勋章也会以不同的颜色进行区分。通过这样一个简单的任务，Human 希望让用户养成每天坚持运动的习惯。
Human
Human 的功能不多，因此页面也相对少，除了运动记录外只有个人页和 Club 页面。在主页中，用户可以进行分享和更新照片主题，此外便是进入日期详情页、运动详情页。虽然 Human 的层级较少，但我认为在目前的交互框架下可以有进一步优化。
Human 交互框架
Human 的个人页、Club 页和主页的层级是相同的，但个人页、Club 页却有不一样的切换方式。在主页左划，便会进入 Club 页；而点击左上角的图标，则进入个人页，并带以页面翻转的效果。相信这是功能发布时间有先后导致的切换方式不一致——Club 在近几个月的版本中才推出。
如果将个人页、Club 页的切换方式统一起来，我更倾向于页面划动。原因有两个：
- 左右划动的切换方式更能体现它们拥有相同的功能层级；
- 目前主页左上角是个人页的打开按钮，而右上角是分享和更新照片主题的功能按钮。它们性质不同。
改进后的主页、个人页和 Club 页，通过左右划动屏幕切换
在运动记录页面下，还有次级页面——日期详情页、三级页面——运动详情页。这是一个典型的「T 型」功能产品。
最具亮点的主页是「T 型」的横竖交接点，个人页、Club 页是与它并列的，而日期详情页、运动详情页是可以往下继续探索的。因此在交互操作上，我让日期详情页、运动详情页也采取了「T 型」的逻辑。
在主页，除了点击日期圆圈外，通过向上滑动也能进入日期详情页。同样地，在日期详情页中向下拖拽也能回到主页。并且，在标题下方添加的几个小圆点，也喻示了可左右划动来切换日期。
日期详情页，左：改进后，右：改进前
在日期详情页，点击某项运动会进入运动详情页，页面原先从右侧弹出，现在改为从底部弹出。由于地图可以自由拖拽，原先的界面中，部分右划返回上级页面的操作会与此冲突；而改进后的运动详情页采用卡片式的设计风格展示地图，保留右划关闭页面的操作、并不会出现操作冲突。
运动详情页，左：改进后，右：改进前
从主页到日期详情页再到运动详情页，每个层级既有鲜明的风格又有联系之处。主页是全屏显示的风景照片，日期详情页在深色背景上展示运动数据，其上方的导航栏是将主页照片作为背景；活动详情页以卡片设计风格展示地图、运动指标，其深色背景延续了日期详情页，而卡片又是一种不同的设计语言并给人以棣属于上级页面的感觉。
鲜明的视觉风格
顺带一提的是，我将原先采用的系统字体全部换掉，主页、日期详情页中主要的数据数字选用了 Futura Condensed Medium，而其它字体选用了 Proxima Nova，并根据信息的主次来选用 Regular 和 Semibold 两种字重。我认为这会让应用变得更吸引人眼球。
本文系 Weekly Design Challenge 系列，第九周
Click here to see the English Version.
网友评论