這個幫你改善睡眠的APP，是這樣設計出來的

2018-05-31 14:08:45 閱讀 246567 本文來源：Tubik Studio

分享至：

現代人對于健康越來越重視，而移動端APP 在這方面為用戶提供了多種多樣的幫助。無論是系統化的健身應用，還是卡路里計算器，飲食日記，運動提醒，用戶可以借由多種不同的渠道和方式來保持健康的生活和良好的體型。今天，我們想分享一個全新的UI設計實戰：幫助用戶更好睡眠的應用 Slumber 的UI設計的過程。這個項目被分配給我們的主力UI/UX設計師 Ernest Asanov，之前他還負責過 Vinny’s Bakery 和 Home Budget 兩個著名的設計案例，想必你還記得。

項目概述

為了幫助用戶獲得更好的睡眠，設計一個移動端應用和相應的UI界面。

處理過程

Slumber 這個應用其實是多個功能的集合，能夠幫助用戶通過聆聽和冥想等多種方法緩解睡眠和放松等多方面的問題。應用中的睡眠音軌收集了一系列幫助用戶在完善放松和提升睡眠質量的音頻素材。在這個項目當中，設計師的任務也很清晰：

·設計清晰直觀的導航：APP 的目標是讓用戶得到放松，而不是花上幾個小時從一屏切到另外一屏來回翻看。

·界面要足夠視覺化，讓用戶保持愉悅的心情。

·可讀性要高，動畫要引人入勝，交互要簡單直觀。

主界面

主界面的色彩和背景主要是基于功能和用戶的使用場景來設計的，由于多數情況下用戶是在晚上使用這一應用，所以需要傳遞出夜晚柔和的氛圍。所以在 UI界面要使用深沉的色彩，時尚的風格和圖形化的元素能夠讓人感到愉悅。

主界面將會包含最新的助眠音軌和最流行的播放列表。底部的標簽欄會將用戶導向到 APP 的核心功能區域，也就是主頁、資源庫和個人頁面。由于這款 APP 的目標受眾非常廣泛，其中許多用戶不乏技術素養相對比較低的普通用戶，因此設計師需要將應用的易用性和可理解性提升到一個非常高的層面，通過明確的導航和簡單的界面讓每個用戶都能夠輕松使用。