用戶故事:UI設(shè)計(jì)的基石
在整體設(shè)計(jì)流程中,用戶故事可以說(shuō)是點(diǎn)亮應(yīng)用絕對(duì)目標(biāo)的那一點(diǎn)星光。該片文章的作者將給我們講解為什么哪怕是小范圍的采用用戶故事也能給整體UI設(shè)計(jì)流程帶來(lái)巨大的好處
一支設(shè)計(jì)團(tuán)隊(duì)坐下來(lái)討論為一家新客戶所設(shè)計(jì)的應(yīng)用的第一輪模型情況。隨著團(tuán)隊(duì)成員不斷提出想法,我們發(fā)現(xiàn)大家對(duì)于這個(gè)應(yīng)用是什么?其功能應(yīng)該是什么樣有著截然不同的看法。后來(lái),會(huì)議迅速變成了“誰(shuí)對(duì)誰(shuí)錯(cuò)”而不是“什么對(duì)什么錯(cuò)”的爭(zhēng)論。大家紛紛為自己的設(shè)計(jì)辯護(hù),但沒(méi)有一個(gè)人站在用戶角度說(shuō)話。聽(tīng)著耳熟嗎?正是在這種時(shí)刻,我們迫切需要描繪用戶故事。
今時(shí)今日,很多UI/UX專業(yè)人士都開(kāi)始意識(shí)到自己工作的環(huán)境進(jìn)入了Agile狀態(tài)。Agile開(kāi)發(fā)(和設(shè)計(jì))流程需要快速推進(jìn),相應(yīng)地,我們也需要能夠?qū)崿F(xiàn)快速、高效協(xié)作的工具。這個(gè)聽(tīng)起來(lái)像是個(gè)矛盾,但實(shí)際上確實(shí)有很多工具能夠幫助我們?cè)诓辉黾禹?xiàng)目時(shí)間的情況下有效合作。用戶故事就是針對(duì)“Agile法”的工具,在運(yùn)用到UI設(shè)計(jì)流程時(shí),其能夠?yàn)楹罄m(xù)的設(shè)計(jì)階段提供堅(jiān)定的基石。簡(jiǎn)約版的用戶故事操作起來(lái)幾乎不用時(shí)間,但卻能對(duì)保證項(xiàng)目按軌道運(yùn)行帶來(lái)奇跡般的效果。
我們的UI設(shè)計(jì)團(tuán)隊(duì)會(huì)在流程中運(yùn)用用戶故事,而在運(yùn)用過(guò)程中我們發(fā)現(xiàn),用戶故事幫我們做到了三件事。
1.用戶故事可以讓產(chǎn)品以用戶為核心。
2.用戶故事可以促進(jìn)團(tuán)隊(duì)成員之間的合作。
3.用戶故事可以防止出現(xiàn)功能蔓延以及設(shè)計(jì)死胡同。
什么是用戶故事?
從根本上說(shuō),用戶故事的用途是描述用戶通過(guò)使用軟件產(chǎn)品想要實(shí)現(xiàn)的任務(wù)。用戶故事起源于Agile和Scrum開(kāi)發(fā)策略,但是對(duì)于設(shè)計(jì)師來(lái)說(shuō),用戶故事主要用來(lái)提醒用戶目標(biāo)以及對(duì)各個(gè)界面設(shè)計(jì)進(jìn)行整理和排序。
一個(gè)用戶故事就是簡(jiǎn)單的一句話??梢杂眠@句作為模板:“作為用戶我需要(基本用戶目標(biāo))”。因?yàn)楣适露己芎?jiǎn)短而且有針對(duì)性,所以需要多個(gè)不同的故事來(lái)覆蓋所有可能的用戶案例。事實(shí)上,我們會(huì)想辦法把每個(gè)故事進(jìn)行細(xì)化。
舉個(gè)例子,一個(gè)用戶故事剛開(kāi)始時(shí)是:
“作為用戶我需要?jiǎng)?chuàng)建一個(gè)新帳戶?!?/p>
但是新建帳戶的過(guò)程中又涉及到哪些步驟呢?用戶需要提供用戶名、密碼以及其他相關(guān)信息。其中每個(gè)操作都需要有相對(duì)應(yīng)的用戶故事,故事越具體,到后期對(duì)設(shè)計(jì)師和開(kāi)發(fā)來(lái)說(shuō)就會(huì)越方便。那么,“創(chuàng)建新帳戶”就可以進(jìn)一步細(xì)化為:
“作為用戶我需要輸入一個(gè)新用戶名?!?/p>
“作為用戶我需要輸入密碼。”
“作為用戶我需要再次輸入密碼進(jìn)行確認(rèn)。”
“作為用戶我需要提交信息,創(chuàng)建帳戶?!?/p>
這樣繼續(xù)下去,最后就會(huì)得到一大長(zhǎng)串用戶故事,其中大部分都需要加入到最終產(chǎn)品內(nèi)。
我們最近為Quiksilver服裝設(shè)計(jì)了一款iPad應(yīng)用,可以讓銷售其貨物的店鋪跟蹤當(dāng)前存活狀態(tài),以便輕松下單訂新貨。就是這么一款看似非常簡(jiǎn)單明了的應(yīng)用,我們想出了266個(gè)用戶故事(剛開(kāi)始時(shí))。你們都沒(méi)想到細(xì)節(jié)能夠細(xì)到這種程度吧!
以用戶為中心
作為設(shè)計(jì)師,我在第一次和項(xiàng)目相關(guān)人員開(kāi)會(huì)的時(shí)候就會(huì)開(kāi)始考慮布局和配色方案。在聽(tīng)他們說(shuō)目標(biāo)以及了解終端用戶情況的同時(shí),我就能想象出這款應(yīng)用應(yīng)該是什么樣的。但關(guān)鍵在于不能本末倒置——我們要先確定用戶故事,讓用戶故事道出設(shè)計(jì),而不能倒過(guò)來(lái)搞。
在對(duì)應(yīng)用的所有用戶故事做完腦暴之后,我們會(huì)把故事放到Google的合作電子表格上,以便客戶在想到有其他用戶故事時(shí)隨時(shí)添加。在客戶和團(tuán)隊(duì)感覺(jué)已經(jīng)窮盡所有內(nèi)容之后,我們會(huì)給每個(gè)故事一個(gè)編號(hào)。這些編號(hào)到項(xiàng)目后期會(huì)派上大用場(chǎng),我們會(huì)用編號(hào)作為一個(gè)簡(jiǎn)明的標(biāo)簽來(lái)表示哪些故事需要在哪個(gè)時(shí)間段處理。
這個(gè)表格的功能不僅是提醒我們應(yīng)用的功能,還能讓我們?cè)谡麄€(gè)流程中與用戶緊密相聯(lián)。每個(gè)用戶故事都是針對(duì)于我們終端用戶的,以便保證始終照顧到他們的需求。這一點(diǎn)在一個(gè)有關(guān)約會(huì)應(yīng)用的項(xiàng)目中表現(xiàn)的尤其明顯。
關(guān)于這個(gè)應(yīng)用,我在給“用戶資料”頁(yè)面做線框圖的時(shí)候,最開(kāi)始以為需要添加一個(gè)“保存用戶”功能按鈕。但是,我不經(jīng)意瞟了一眼“用戶資料”部分,突然想起來(lái)用戶故事中的一個(gè)細(xì)節(jié):“作為用戶我需要收藏其他用戶?!?/p>
把“保存”一詞改成“收藏”這個(gè)決定雖小但很關(guān)鍵,因?yàn)椤氨4妗庇脩袈?tīng)起來(lái)冷冰冰的,而“收藏”則契合了用戶有關(guān)約會(huì)的心態(tài)。設(shè)計(jì)師容易陷入到技術(shù)的陷阱中,特別是在對(duì)功能投入了大量時(shí)間之后。而用戶故事可以提醒我們時(shí)刻以用戶體驗(yàn)為核心,因?yàn)橛脩趔w驗(yàn)是最終決定應(yīng)用性格的東西。
促進(jìn)合作
UI的設(shè)計(jì)通常涉及到的人不止一個(gè)。其中還可能包括客戶、設(shè)計(jì)師、程序員以及一大堆的其他職位工作人員,具體要取決于公司的規(guī)模大小。從很多方面說(shuō),這就類似于一隊(duì)人劃船。要贏得比賽,團(tuán)隊(duì)的每個(gè)成員都要以相同的速度朝著相同的方向一齊劃槳。這并不是說(shuō)所有人的意見(jiàn)都要始終統(tǒng)一,而是說(shuō)所有人都要有統(tǒng)一的目標(biāo)并且清楚自己在團(tuán)隊(duì)中的角色。
雖然我們?cè)贑itrusBits所采用的流程遠(yuǎn)算不上完美,但是我們卻發(fā)現(xiàn)用戶故事能夠保證船上的人勁都往一處使。以用戶故事為基準(zhǔn)做出決策讓我們得以明確定義出應(yīng)用的目標(biāo)。這樣一來(lái)就大大降低了團(tuán)隊(duì)合作時(shí)的障礙,因?yàn)槲覀冇煤?jiǎn)短、有針對(duì)性的詞句明確定義出了共同的目標(biāo)。
另外,用戶故事還能讓身處不同地理位置的團(tuán)隊(duì)更加輕松的合作。我們?cè)跒橐患遗f金山客戶開(kāi)發(fā)一款問(wèn)答類應(yīng)用時(shí),我們?cè)诤车貐^(qū)的團(tuán)隊(duì)會(huì)時(shí)不常的和客戶碰面討論應(yīng)用要求。他們寫(xiě)出了用戶故事(但并沒(méi)有在項(xiàng)目期間進(jìn)行其他修改)然后放到了Google Drive。而我們身處洛杉磯的團(tuán)隊(duì)則可以在畫(huà)線框圖的同時(shí)隨時(shí)參考用戶故事,并進(jìn)行必要的改動(dòng)。要不是有了這個(gè)步驟,這個(gè)項(xiàng)目所花費(fèi)的時(shí)間會(huì)長(zhǎng)的很多,而且還會(huì)需要通過(guò)大量漫長(zhǎng)的解釋工作來(lái)解決這些簡(jiǎn)短用戶故事幾分鐘就能解決的問(wèn)題。
防止出現(xiàn)功能蔓延以及設(shè)計(jì)死胡同
“功能蔓延”是一個(gè)UI設(shè)計(jì)中常見(jiàn)的詞。它是指相關(guān)人員會(huì)不自覺(jué)地不斷增加新功能,擴(kuò)展項(xiàng)目范圍,這既包括硬件也包括軟件方面。
這幅漫畫(huà)完美地詮釋了功能蔓延。
當(dāng)然,在項(xiàng)目進(jìn)展期間我們是不反對(duì)更改要求的。但是,除非有明確的用戶故事告訴我們?cè)?,我們?huì)拒絕哪怕添加一個(gè)簡(jiǎn)單的文本框。我們之所以在這方面這么強(qiáng)硬,是因?yàn)橹翱吹竭^(guò)有的項(xiàng)目超出控制、丟掉中心最后無(wú)法實(shí)現(xiàn)最初設(shè)定的目標(biāo)。
舉個(gè)例子,不久之前,我們有個(gè)客戶忽略了用戶故事這回事。當(dāng)時(shí)我們正在給一家處理保密資產(chǎn)的公司搭建應(yīng)用,客戶想要做一款能夠管理員工之間通訊的應(yīng)用。主要的通訊手段是一個(gè)使用文字信息和圖片的公司內(nèi)部對(duì)話平臺(tái)(這一點(diǎn)我們都認(rèn)可了),這個(gè)我們記錄到了用戶故事里。后來(lái),客戶又要求增加視頻、語(yǔ)音信息和位置分享。為了保持我們“靈活”的形象,我們想辦法把這些內(nèi)容加入了新的通訊系統(tǒng),也因此擴(kuò)大了項(xiàng)目范圍,推遲了時(shí)限,在做完了全部工作之后我們卻發(fā)現(xiàn)添加的內(nèi)容其實(shí)對(duì)終端用戶沒(méi)用。
盡管新增的功能也很屌,但我們最開(kāi)始的初衷是做一款盡量簡(jiǎn)化通訊的應(yīng)用以便促進(jìn)團(tuán)隊(duì)建設(shè)和協(xié)作,不讓他變成一個(gè)公司內(nèi)部的Facebook。于是,我們又回到了用戶故事并重新提醒了客戶做應(yīng)用的初衷,最后成功組織了功能蔓延,回到了正軌。多方面的實(shí)驗(yàn)盡管能帶來(lái)很多很棒的成果,但是如果產(chǎn)品無(wú)法滿足根本要求,再精巧也沒(méi)意義。
通過(guò)這次教訓(xùn),我們?cè)陂_(kāi)發(fā)Quicksilver這個(gè)針對(duì)B2B公司的銷售類應(yīng)用時(shí)嚴(yán)格遵照用戶故事開(kāi)展流程。最后,最終產(chǎn)品一絲不茍地遵守了最初設(shè)計(jì),這主要?dú)w功于我們?cè)谇捌诜e累了一套全面的用戶故事。以用戶故事為基石為后期節(jié)省了大量工作,同時(shí)也讓我們的工作更加有序、更加以用戶為中心。盡管產(chǎn)品的每次迭代都帶來(lái)了更多的用戶和客戶反饋,但產(chǎn)品理念的核心一直屹立不倒。
產(chǎn)品從最初設(shè)計(jì)到最終成品變化非常小
每個(gè)用戶故事對(duì)于設(shè)計(jì)團(tuán)隊(duì)和開(kāi)發(fā)團(tuán)隊(duì)來(lái)說(shuō)都有自己的一套意義。時(shí)刻思考技術(shù)限制雖然說(shuō)是好的,但是畢竟我們說(shuō)的是“用戶故事”,不是“開(kāi)發(fā)的故事”也不是“設(shè)計(jì)師的故事”。正因?yàn)槲覀兺ㄟ^(guò)用戶故事對(duì)用戶的觀點(diǎn)進(jìn)行了排序整理,我們才能更輕松地了解所面臨的問(wèn)題進(jìn)而創(chuàng)造出一款真正有用的最終產(chǎn)品。
后續(xù)
下面是幾條大家做UI設(shè)計(jì)時(shí)思考用戶故事的提示:
在開(kāi)始視覺(jué)設(shè)計(jì)之前確定出完整的一套用戶故事。抑制住自己直接跳入設(shè)計(jì)的沖動(dòng)可以節(jié)省時(shí)間,避免不必要的頭痛和無(wú)用功。
對(duì)于每個(gè)用戶故事,看看是否能繼續(xù)細(xì)化成更具體的故事。長(zhǎng)篇大論適合于從宏觀角度概括所需功能,但是細(xì)枝末節(jié)的地方也不能忽略。在早期深入細(xì)節(jié),從一開(kāi)始就解決實(shí)用性問(wèn)題。
不要把設(shè)計(jì)元素放到?jīng)]有對(duì)應(yīng)用戶故事的界面上。對(duì)每個(gè)元素的內(nèi)容和產(chǎn)生原因進(jìn)行記錄可以讓條理更清晰,在向開(kāi)發(fā)團(tuán)隊(duì)移交時(shí)會(huì)更加順利。
譯者:蔣燦
來(lái)源:網(wǎng)秦UEC
原文地址:uxbooth
先編寫(xiě)UserStory后面再做設(shè)計(jì)師明智之舉!避免不必要的跑偏和無(wú)用功!