這個(gè)幫你改善睡眠的APP，是這樣設(shè)計(jì)出來(lái)的

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

項(xiàng)目概述

為了幫助用戶獲得更好的睡眠，設(shè)計(jì)一個(gè)移動(dòng)端應(yīng)用和相應(yīng)的UI界面。

處理過(guò)程

Slumber 這個(gè)應(yīng)用其實(shí)是多個(gè)功能的集合，能夠幫助用戶通過(guò)聆聽(tīng)和冥想等多種方法緩解睡眠和放松等多方面的問(wèn)題。應(yīng)用中的睡眠音軌收集了一系列幫助用戶在完善放松和提升睡眠質(zhì)量的音頻素材。在這個(gè)項(xiàng)目當(dāng)中，設(shè)計(jì)師的任務(wù)也很清晰：

·設(shè)計(jì)清晰直觀的導(dǎo)航：APP 的目標(biāo)是讓用戶得到放松，而不是花上幾個(gè)小時(shí)從一屏切到另外一屏來(lái)回翻看。

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

·可讀性要高，動(dòng)畫(huà)要引人入勝，交互要簡(jiǎn)單直觀。

主界面

主界面的色彩和背景主要是基于功能和用戶的使用場(chǎng)景來(lái)設(shè)計(jì)的，由于多數(shù)情況下用戶是在晚上使用這一應(yīng)用，所以需要傳遞出夜晚柔和的氛圍。所以在 UI界面要使用深沉的色彩，時(shí)尚的風(fēng)格和圖形化的元素能夠讓人感到愉悅。

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

另外一個(gè)頗為有吸引力的設(shè)計(jì)，是可以自定義的封面圖，以及預(yù)加載好的動(dòng)畫(huà)，這使得 APP 的界面不會(huì)顯得乏味或者缺乏吸引力。

資源庫(kù)

APP 中包含了大量的用來(lái)促眠的音頻素材，用戶可以在資源庫(kù)中尋找自己覺(jué)得不錯(cuò)的音軌。

簡(jiǎn)約而清晰的過(guò)濾系統(tǒng)能夠幫助用戶找到最舒適的聲音組合，幫助用戶進(jìn)行冥想或者睡眠。用戶可以通過(guò)調(diào)整背景音效來(lái)尋求個(gè)性化的組合，找到最適合自己的。背景圖片將會(huì)始終顯示，并不會(huì)在調(diào)整過(guò)程中消失，確保整個(gè)流程不會(huì)斷掉。

微妙的動(dòng)效將會(huì)在用戶的整個(gè)交互過(guò)程中提升體驗(yàn)的愉悅度，又不會(huì)影響操作。選擇了可讀性優(yōu)良的字體，結(jié)合清晰的層次結(jié)構(gòu)，用戶可以在短時(shí)間內(nèi)快速獲取屏幕中的信息。

高質(zhì)量的圖片是素材庫(kù)中內(nèi)容的重要支撐，它們確保整個(gè)視覺(jué)足夠優(yōu)秀，并且讓用戶在視覺(jué)上享受到了良好的氛圍支撐。

個(gè)人頁(yè)面

個(gè)人頁(yè)面中包含了用戶自身相關(guān)的關(guān)鍵信息，以及一些相關(guān)的交互，比如睡前提醒，耳機(jī)模式以及相關(guān)的一些設(shè)置。用戶還可以選擇包含更多功能和服務(wù)的進(jìn)階模式。同樣的，個(gè)人頁(yè)面也采用了深色系設(shè)計(jì)，沉穩(wěn)優(yōu)雅。

這個(gè)項(xiàng)目是個(gè)有趣的挑戰(zhàn)，相對(duì)獨(dú)特的需求和小眾的主題需要設(shè)計(jì)師在設(shè)計(jì)過(guò)程中仔細(xì)衡量，作出更加深思熟慮的設(shè)計(jì)決策。