2017-4-11 資深UI設(shè)計(jì)者
引導(dǎo)新用戶(hù)熟悉產(chǎn)品的方式多種多樣，向?qū)С绦蚴瞧渲凶罱?jīng)典也是最常用的一種。今天的文章，我們來(lái)聊聊向?qū)С绦虻脑O(shè)計(jì)模式。
向?qū)С绦蛲ǔ?huì)提供一系列的步驟或者目標(biāo)，讓用戶(hù)在完成步驟達(dá)成目標(biāo)的過(guò)程中，逐步熟悉這個(gè)平臺(tái)或者產(chǎn)品。向?qū)С绦颍╓izerd），或者說(shuō)是新手向?qū)ё畛跏歉綆г趯?shí)物產(chǎn)品的說(shuō)明書(shū)當(dāng)中，告訴用戶(hù)如何起步，怎么使用產(chǎn)品。在此之后不就，隨著互聯(lián)網(wǎng)的和數(shù)字產(chǎn)品的發(fā)展，它也引入到數(shù)字產(chǎn)品當(dāng)中。最典型的，就是各種軟件的安裝向?qū)А?
許多傳統(tǒng)的桌面端軟件在安裝的時(shí)候，是有安裝向?qū)С绦騺?lái)引導(dǎo)用戶(hù)完成這個(gè)步驟的，直到今天也是如此。這種設(shè)計(jì)模式是隨著Windows 95的大規(guī)模普及而得到了推廣。
向?qū)С绦虻暮锰幉⒉簧伲?
將復(fù)雜的任務(wù)分解成為一系列簡(jiǎn)單易行的小步驟，幫你進(jìn)行精簡(jiǎn)。
分割處理，各個(gè)擊破。
正如同之前所說(shuō)的，桌面端軟件安裝的向?qū)Ь褪欠浅５湫偷睦?。在安裝向?qū)У闹敢拢脩?hù)需要自己復(fù)制文件，編輯配置文件，選取安裝目錄，并檢查軟件是否正常運(yùn)行。安裝向?qū)?fù)雜的條件轉(zhuǎn)化為可理解可執(zhí)行的步驟，它所帶來(lái)的回報(bào)也是明顯的：減少了培訓(xùn)和客戶(hù)服務(wù)上的成本。
許多操作和決策是需要專(zhuān)業(yè)知識(shí)支撐的，但是向?qū)С绦蚝芎玫慕鉀Q這個(gè)問(wèn)題，幫用戶(hù)合理的規(guī)避了這些障礙。用戶(hù)只需要按照預(yù)設(shè)的路徑一步步完成整個(gè)初始化過(guò)程：“不要讓我想，只需要告訴我下一步要怎么做。”
向?qū)С绦蚩梢栽谙旅媲闆r下發(fā)揮作用：
1、用戶(hù)想要達(dá)成一個(gè)需要多個(gè)步驟才能完成的目標(biāo)
你正在設(shè)計(jì)的UI牽涉到一個(gè)超長(zhǎng)的任務(wù)或者是一個(gè)無(wú)法直接簡(jiǎn)化流程的任務(wù)，而向?qū)С绦蚰軌蜃屵@個(gè)任務(wù)的復(fù)雜性看起來(lái)降低了，而可行性和易用性提高了。
2、用戶(hù)必須按照特定的順序來(lái)完成的任務(wù)
對(duì)于必須按照特定順序來(lái)執(zhí)行的任務(wù)，是需要學(xué)習(xí)的，而向?qū)С绦蚰軌蚪档蛯W(xué)習(xí)曲線(xiàn)，同時(shí)，細(xì)分的流程讓用戶(hù)不會(huì)錯(cuò)過(guò)重要的步驟，降低出錯(cuò)的機(jī)率。
向?qū)С绦蚩隙ú皇侨f(wàn)能的，甚至可以說(shuō)它是需要謹(jǐn)慎使用的。將任務(wù)分解成小步驟，并不是每次都能給人帶來(lái)良好的體驗(yàn)：
1、當(dāng)任務(wù)本身并不復(fù)雜的時(shí)候
當(dāng)一個(gè)任務(wù)只需要一個(gè)簡(jiǎn)單的表單，或者點(diǎn)擊幾下按鈕就能完成的話(huà)，那么它并不需要使用向?qū)С绦騺?lái)引導(dǎo)用戶(hù)。
2、當(dāng)用戶(hù)本身就是進(jìn)階用戶(hù)之時(shí)
向?qū)С绦蛲ǔ?huì)將復(fù)雜的問(wèn)題簡(jiǎn)化來(lái)處理，但是這種解決方案并不能應(yīng)對(duì)所有的用戶(hù)需求。對(duì)于進(jìn)階用戶(hù)，或者說(shuō)重度用戶(hù)而言，向?qū)С绦虺３?huì)顯得僵化，他們會(huì)覺(jué)得受限。向?qū)С绦蚴怯脕?lái)幫助用戶(hù)的，但是重度用戶(hù)所追求的自由和定制性常常無(wú)法從向?qū)С绦蛑蝎@得。對(duì)于創(chuàng)意工作者和程序員而言，尤其是如此。
小貼士：最好是在向?qū)С绦蛞酝馓峁╊~外的選項(xiàng)。
3、當(dāng)你想要指引用戶(hù)的時(shí)候
不要使用向?qū)С绦騺?lái)闡述概念。用戶(hù)在向?qū)н^(guò)程中閱讀大量的補(bǔ)充文本，他們會(huì)更加專(zhuān)注于任務(wù)本身。
當(dāng)你在設(shè)計(jì)你的下一個(gè)產(chǎn)品的向?qū)С绦虻臅r(shí)候，可以參考下面的最佳實(shí)踐，來(lái)確保它的有效性：
向?qū)С绦虻腢I設(shè)計(jì)難度在于分割步驟的大小和數(shù)量之間的平衡。只有一兩個(gè)步驟的向?qū)С绦蚋緵](méi)有存在的意義，而超過(guò)10個(gè)步驟的向?qū)С绦騽t會(huì)讓人覺(jué)得過(guò)長(zhǎng)。最理想的設(shè)計(jì)是將向?qū)С绦蚩刂圃?~5個(gè)步驟。之后，將你所設(shè)計(jì)的向?qū)脕?lái)做可用性測(cè)試，確保它能為用戶(hù)所接受。
在每個(gè)步驟當(dāng)中，你需要讓用戶(hù)明白這個(gè)步驟的功能和存在的意義。同時(shí)，每個(gè)步驟當(dāng)中，你應(yīng)該給予用戶(hù)足夠的信息來(lái)確保他們能作出正確的決定。想要每個(gè)步驟都有明確的目標(biāo)，這兩個(gè)東西是關(guān)鍵：
·清晰而簡(jiǎn)潔的向?qū)?biāo)簽
·每個(gè)步驟都有簡(jiǎn)要的目的說(shuō)明
反例：Homesite 這個(gè)網(wǎng)站在第一屏上并未對(duì)目標(biāo)作出陳述，如果用戶(hù)從其他的頁(yè)面直接跳轉(zhuǎn)過(guò)來(lái)，很難立刻弄明白要干啥。
不必要的界面元素在用戶(hù)完成任務(wù)的過(guò)程中，會(huì)分散他們的注意力。刪除這些元素能夠讓用戶(hù)更加專(zhuān)注。
你應(yīng)該搞清楚向?qū)С绦虻倪吔缭谀睦铮@樣才能確保用戶(hù)明白何時(shí)完成。為了讓你的向?qū)С绦蚋玫囊龑?dǎo)用戶(hù)，你應(yīng)該讓它的這些功能有所體現(xiàn)：
·將步驟編號(hào)
·表明這些步驟推進(jìn)的方向（從上到下還是從左到右）
·區(qū)分正在執(zhí)行的步驟的和待完成的步驟
·指示已經(jīng)成功完成的步驟
·完成之后給予用戶(hù)以確認(rèn)信息
反例：不要讓每一個(gè)步驟都是孤立的，最好讓它和前后步驟聯(lián)系起來(lái)，讓用戶(hù)看到。
范例：清楚地在步驟旁邊標(biāo)上步驟數(shù)字，此外，從UI上體現(xiàn)所有步驟的概述。
默認(rèn)值，或者說(shuō)默認(rèn)設(shè)定是非常有用的。無(wú)論你如何安排步驟，用戶(hù)始終還是希望擁有控制權(quán)的，而默認(rèn)值能給用戶(hù)作為參考。比如程序的安裝位置。
有的時(shí)候，由于種種原因用戶(hù)決定放棄執(zhí)行當(dāng)前步驟，而取消按鈕讓用戶(hù)在決定放棄的時(shí)候，有安全的退出路徑。
如果用戶(hù)有新的想法，或者有新的主意，那么用戶(hù)可能會(huì)撤銷(xiāo)已完成的步驟，重新開(kāi)始，修改數(shù)據(jù)，或者完全放棄。讓用戶(hù)可以回到上一個(gè)步驟，撤銷(xiāo)已經(jīng)執(zhí)行的步驟，則能夠重新開(kāi)始引導(dǎo)，按照新的想法來(lái)重新設(shè)置。
在即將完成整個(gè)向?qū)С绦虻臅r(shí)候，將用戶(hù)完成過(guò)程中所執(zhí)行的選擇總結(jié)成為摘要，讓用戶(hù)可以在完成前確認(rèn)所有的信息。
設(shè)計(jì)一個(gè)良好的向?qū)С绦虿⒉蝗菀祝阈枰龀龃罅康囊?guī)劃，通過(guò)試錯(cuò)來(lái)驗(yàn)證設(shè)計(jì)。希望今天所列舉出的最佳實(shí)踐能夠幫你完成向?qū)С绦虻脑O(shè)計(jì)。
藍(lán)藍(lán)設(shè)計(jì)( tweetduck.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://tweetduck.com