这个帮你改善睡眠的APP，是这样设计出来的

2018-05-31 14:08:45 阅读 225072 本文来源：Tubik Studio

分享至：

现代人对于健康越来越重视，而移动端APP 在这方面为用户提供了多种多样的帮助。无论是系统化的健身应用，还是卡路里计算器，饮食日记，运动提醒，用户可以借由多种不同的渠道和方式来保持健康的生活和良好的体型。今天，我们想分享一个全新的UI设计实战：帮助用户更好睡眠的应用 Slumber 的UI设计的过程。这个项目被分配给我们的主力UI/UX设计师 Ernest Asanov，之前他还负责过 Vinny’s Bakery 和 Home Budget 两个著名的设计案例，想必你还记得。

项目概述

为了帮助用户获得更好的睡眠，设计一个移动端应用和相应的UI界面。

处理过程

Slumber 这个应用其实是多个功能的集合，能够帮助用户通过聆听和冥想等多种方法缓解睡眠和放松等多方面的问题。应用中的睡眠音轨收集了一系列帮助用户在完善放松和提升睡眠质量的音频素材。在这个项目当中，设计师的任务也很清晰：

·设计清晰直观的导航：APP 的目标是让用户得到放松，而不是花上几个小时从一屏切到另外一屏来回翻看。

·界面要足够视觉化，让用户保持愉悦的心情。

·可读性要高，动画要引人入胜，交互要简单直观。

主界面

主界面的色彩和背景主要是基于功能和用户的使用场景来设计的，由于多数情况下用户是在晚上使用这一应用，所以需要传递出夜晚柔和的氛围。所以在 UI界面要使用深沉的色彩，时尚的风格和图形化的元素能够让人感到愉悦。

主界面将会包含最新的助眠音轨和最流行的播放列表。底部的标签栏会将用户导向到 APP 的核心功能区域，也就是主页、资源库和个人页面。由于这款 APP 的目标受众非常广泛，其中许多用户不乏技术素养相对比较低的普通用户，因此设计师需要将应用的易用性和可理解性提升到一个非常高的层面，通过明确的导航和简单的界面让每个用户都能够轻松使用。