案例背景

醫(yī)療app是一一個提供線上問診、預(yù)約掛號、醫(yī)、患互動、知識分享，健康科普、在線購藥等“互聯(lián)網(wǎng)醫(yī)院"。利用短視頻傳播快的特性普及健康知識，讓用戶提高自身健康意識，通過直播、杜群互動等方式提供醫(yī)患、醫(yī)醫(yī)、患惠互動的聯(lián)系渠道，從而達到共享醫(yī)療，有改善當(dāng)下緊張的醫(yī)惠關(guān)系的目的。

目前就醫(yī)環(huán)節(jié)中存在的“三長-短"現(xiàn)象，即掛號排長隊、就診排長隊、繳費排長隊、看病時間短，對行業(yè)和患者來說是共同的難題醫(yī)療衛(wèi)生資源供需矛盾仍然突出，再加上醫(yī)患之間缺乏信任和理解，醫(yī)患關(guān)系日趨緊張?；ヂ?lián)網(wǎng)技術(shù)賦能的醫(yī)療作為一個獨立賽道，如何利用互聯(lián)網(wǎng)跨時空的優(yōu)勢，解決應(yīng)對線下醫(yī)療日漸突出的現(xiàn)實問題才是關(guān)鍵。

設(shè)計流程

產(chǎn)品分析：根據(jù)產(chǎn)品調(diào)研數(shù)據(jù)，結(jié)合已有的醫(yī)療app以及醫(yī)療數(shù)據(jù)報告進行需求分析

功能梳理：結(jié)合前期產(chǎn)品分析文檔，進行用戶畫像、用戶體驗地圖設(shè)計，從尋求核心功能，再進行頭腦風(fēng)暴，得到相關(guān)功能。

原型設(shè)計：對功能點進行原型設(shè)計，根據(jù)可用性交互流程測試、調(diào)整，得到最警交互原型。

界面設(shè)計：梳理原型，充分理解產(chǎn)品理念再用SWTO法進行竟品分析，結(jié)合設(shè)計情緒版設(shè)計頁面規(guī)范、風(fēng)格。

草圖繪制

草圖做為一種工具和技巧，草圖在設(shè)計過程中扮演著很重要的角色。在大量的時間和精力設(shè)入到某個方案之前,先畫出草圖呈現(xiàn)給客戶，得到方向上的認可。通過草圖快速集成概念設(shè)置基本元素布局用于與客戶交流視覺探索。

功能框架

思維導(dǎo)圖的建立有利于人們對其所思考的問題進行全方位和系統(tǒng)的描述與分析，非常有助于人們對所研究的問題進行深刻的和富有創(chuàng)造性的思考，從而有利于找到解決問題的關(guān)鍵因素或關(guān)鍵環(huán)節(jié)。

設(shè)計分析

形、色、字、構(gòu)、質(zhì)

形、色、字、構(gòu)、質(zhì)是組成一個app視覺語言最基本的五個維度，正確的定義一個產(chǎn)品風(fēng)格以及品牌調(diào)性。

頭腦風(fēng)暴

先利用頭腦風(fēng)暴確定設(shè)計的大方向。

色

根據(jù)設(shè)計關(guān)鍵詞尋找相對應(yīng)的情感化圖片，提取其中的相關(guān)顏色，喚起設(shè)計情感。健康、生命力

根據(jù)情感化圖片提取綠色、黃色、藍色，整體配色比例使用“631”法則，即60%主色、30%輔助色、10%的點綴色。

形

根據(jù)頭腦風(fēng)暴關(guān)鍵詞，提取其中的關(guān)鍵元素確定app的啟動圖標(biāo)。

字

中文用蘋方，數(shù)字用DIN,文字對比采用粗細、大小、顏色對比，在2x的設(shè)計稿上，每個字號的對比至少為4px,使它們層次更明顯 常用子號: 48、40、36、32、28、24、20px。

構(gòu)

卡片的間距以及圓覺都采用d (d=8px)的倍數(shù)，構(gòu)圖都比較簡單，沒有復(fù)雜的內(nèi)容，空間感很強，大留白，大標(biāo)題具有呼吸感、通透感。

質(zhì)

頁面組件質(zhì)感與風(fēng)格、界面風(fēng)格，投影數(shù)值等。

登錄注冊頁

登錄注冊一步完成，減少操作步驟，優(yōu)化交互流程。同時上面增加問候語，讓用戶感到服務(wù)的優(yōu)越感。

在手機號不完整的情況下，按鈕為本科點擊狀態(tài)，按鈕放在中上部位置，防止用戶鍵盤遮擋操作按鈕，方便用戶操作。