@NeilYoung_ixd?：接觸交互設(shè)計(jì)時(shí)間不短了，一直沒有機(jī)會(huì)說說自己的方案設(shè)計(jì)的流程。當(dāng)一個(gè)方案設(shè)計(jì)完成后，如果不細(xì)細(xì)打磨，難免有一些被忽略的地方。所以大家在設(shè)計(jì)時(shí)候，一定要打起十二分精神，盡量做到方案思路清晰，方案完善，這次借由“登錄頁面的優(yōu)化設(shè)計(jì)項(xiàng)目”給大家分享一下設(shè)計(jì)流程的個(gè)人心得 ?>>>

背景概述

登錄頁面是移動(dòng)端產(chǎn)品的常規(guī)頁面之一，相信大家并不陌生。這次迭代中，我們?cè)噲D將單點(diǎn)登錄這個(gè)功能應(yīng)用在客戶端中。

方案流程

本次方案的總結(jié)從以下四個(gè)方面來闡述。這也是筆者方案設(shè)計(jì)的常規(guī)步驟。命名為梳理-分析-定義-驗(yàn)證四步法。

流程梳理

這里的流程指的便是用戶在使用過程中完成登錄任務(wù)的主要流程。因?yàn)橛袉吸c(diǎn)登錄的存在，所以在流程中可以優(yōu)先考慮這種最便捷的登錄方式。

設(shè)計(jì)分析

對(duì)于一個(gè)現(xiàn)有功能的優(yōu)化，可以采用小范圍討論來找出用戶的場(chǎng)景和痛點(diǎn)。進(jìn)而結(jié)合數(shù)據(jù)來完成方案設(shè)計(jì)的注意事項(xiàng)。

在上述分析總結(jié)中，有一點(diǎn)值得玩味。雖然數(shù)據(jù)表明用戶登出自己帳號(hào)的需求很小，但是大家依然希望有個(gè)記住帳號(hào)密碼功能。然而繼續(xù)詢問，用戶更多是希望卸載應(yīng)用安裝后依然可以免登錄。其實(shí)當(dāng)前應(yīng)用登出帳號(hào)功能，更多是滿足換帳號(hào)兌換禮品或者換小號(hào)寫跟貼的需求。鑒于這種情況的考慮，并不需要當(dāng)前應(yīng)用“登出依然記住帳號(hào)密碼”功能。然而，我們可以采用iOS系統(tǒng)的鑰匙串功能來滿足卸載應(yīng)用重裝免登錄的需求(因?yàn)樯婕暗絺€(gè)人隱私安全問題，最終還是建議不做)?？梢娫谠O(shè)計(jì)中，需求需要進(jìn)一步驗(yàn)證確認(rèn)，而不是用戶說什么就去做什么，更多還是需要深入了解，看清需求真相。

方案定義

對(duì)于頁面信息布局的設(shè)計(jì)，一般會(huì)涉及到元素有哪些，優(yōu)先級(jí)是怎么樣。依此來設(shè)計(jì)和輸出方案。

在設(shè)計(jì)時(shí)候，一直糾結(jié)于是否需要明確表達(dá)單點(diǎn)登錄中的帳號(hào)來源，因此采用了A，B方案設(shè)計(jì)。A方案特點(diǎn)是界面簡(jiǎn)潔，理解成本低。B方案特點(diǎn)是完整描述了帳號(hào)來源，給予用戶信任感。

測(cè)試驗(yàn)證

方案設(shè)計(jì)完畢后，為了驗(yàn)證哪種方案更加符合用戶使用。因此進(jìn)行了小范圍測(cè)試驗(yàn)證。

從上圖可知大家對(duì)方案A,B各有傾向。并且在實(shí)際討論中，大家表達(dá)了各個(gè)方案的可取之處，因此又經(jīng)過細(xì)細(xì)斟酌，并結(jié)合了可以料想到的各種特殊情況，輸出了如下方案。

在此方案得到大家的一致認(rèn)可后，開始做一些交互細(xì)節(jié)。交互細(xì)節(jié)主要是從操作反饋整理，文案梳理，數(shù)據(jù)統(tǒng)計(jì)需求方面完善。

寫在最后

在工作中抽出時(shí)間總結(jié)經(jīng)驗(yàn)，是筆者一直想做，也是正在做的。只有這樣才能不斷激發(fā)新想法，推著自己往前走。更多關(guān)于交互設(shè)計(jì)流程的探討，可以加我個(gè)人微信xixuyoung，歡迎大家交流指正。

【超贊的取色工具大合集】

除了找現(xiàn)成的圖片來配色之外，你還可以試試「彩通配色」：
《大開眼界！那些巧用「彩通配色」的醒目設(shè)計(jì)》

取色工具多不勝數(shù)，不過Kuler應(yīng)該還是口碑最好的幾個(gè)取色工具之一：
《VC教程！教你使用最受歡迎的配色小工具KULER》

當(dāng)然，行走江湖怎么可以沒有備用方案！所以，這個(gè)時(shí)候不妨看看：
《碉堡！配色神器第二代！COLOR CUBE免費(fèi)開放下載》

投稿者：@NeilYoung_ixd?（ME網(wǎng)易移動(dòng)設(shè)計(jì)）
微信公眾號(hào)：ME網(wǎng)易移動(dòng)設(shè)計(jì)

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專注分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量93萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁設(shè)計(jì) 微信號(hào)：【youshege】?jī)?yōu)設(shè)哥的全拼
您也可以通過掃描下方二維碼快速添加：