中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

網(wǎng)頁設(shè)計(jì)中向?qū)Ы缑嫒绾卧O(shè)計(jì)

2022-06-21    分類: 網(wǎng)站建設(shè)

這個(gè)世界上有 10 大經(jīng)典謊言,其中之一就是在注冊或安裝時(shí)的那句「我已閱讀并同意本條款的使用?!?/p>

謊言從何而來?又去何處?今天分享的這篇文章,帶你了解這背后的故事。

我們使用 app 或者網(wǎng)站時(shí),經(jīng)常遇到需要一步一步完成的界面,指引我們完成某項(xiàng)任務(wù)。這個(gè)界面,就是所謂的「向?qū)Ы缑妗埂?/p>

設(shè)計(jì)過程中,到底要不要使用向?qū)Ы缑婺?它能不能當(dāng)作一個(gè)不堪入目的界面的「補(bǔ)丁」呢?讀完這篇文章,你就知道答案了。

一、什么是向?qū)Ы缑?/h2>

在向?qū)Ы缑?,用戶?huì)碰到一系列步驟或條件,不完成這些步驟或條件的話,就無法完成某項(xiàng)任務(wù)(比如開始使用某產(chǎn)品)。

這種模式,最初出現(xiàn)于線下——比如大家熟知的配套各種家電的紙質(zhì)說明書。直到最近幾十年,才被用于線上(比如軟件安裝向?qū)Ы缑?。


傳統(tǒng)桌面軟件應(yīng)用或硬件安裝,都有上圖中的設(shè)置向?qū)Ы缑?。向?qū)Ы缑嬷饾u普及,還要從 Windows 95 說起。

向?qū)Ы缑嬗羞@些優(yōu)勢:

1. 簡化任務(wù)

將某個(gè)復(fù)雜任務(wù)拆分成有序任務(wù)流,你會(huì)發(fā)現(xiàn)之前的復(fù)雜任務(wù)并沒有那么復(fù)雜。

很多人覺得向?qū)Ы缑媛闊?,但在安裝向?qū)Ы缑嫫占爸?,我們安裝軟件要自行拷貝文件,再編輯配置文件,再設(shè)置控制目錄,最后還要檢查軟件是否能正常運(yùn)行。

但向?qū)Ы缑娉霈F(xiàn)后,前述復(fù)雜的條件就轉(zhuǎn)化成了簡單易懂的步驟。向?qū)Ы缑娴男Ч欠浅C黠@的——技術(shù)支持成本和培訓(xùn)成本都大大降低了。

2. 減少?zèng)Q策負(fù)擔(dān),讓人們心曠神怡

在我們?nèi)狈Ρ匾尘爸R(shí)的情況下,向?qū)Ы缑娴膬?yōu)勢就出現(xiàn)了。完成任務(wù)從此變得輕而易舉:人們只需要順著預(yù)先設(shè)計(jì)的、需要逐步完成的路徑,即可完成任務(wù)。「不會(huì)給你時(shí)間去思考,下一步做什么全都告訴你了,超級(jí)簡單?!?/p>

二、向?qū)Ы缑孢m合什么時(shí)候使用

向?qū)Ы缑嬖谝韵虑榫爸刑貏e有用:

1. 人們想要完成某個(gè)多步驟任務(wù)

如果你在設(shè)計(jì)的某個(gè)任務(wù)界面,其實(shí)際上步驟繁多、復(fù)雜,而且無法簡化。通過向?qū)Ы缑妫瑒t可以讓看起來很復(fù)雜的任務(wù)變得更簡單。同時(shí),整個(gè)過程還會(huì)顯得非常地清晰明了。

2. 人們必須按特定順序完成某任務(wù)

這類情境下,通過降低學(xué)習(xí)曲線,向?qū)Ы缑婵梢詤f(xié)助人們完成某任務(wù)。若要求按步驟完成任務(wù),人們就不太可能錯(cuò)過重要的環(huán)節(jié),從而可以降低出錯(cuò)率。


Facebook 通過向?qū)Ы缑鎭碓O(shè)置應(yīng)用。它能確保所有的步驟都按恰當(dāng)?shù)捻樞蛲瓿伞?/p>

三、向?qū)Ы缑嬉灿袥]啥用的時(shí)候

使用此類模式一定要謹(jǐn)慎。將某項(xiàng)任務(wù)拆分成多步驟小任務(wù),并不代表可以提供更友好的用戶體驗(yàn)。比如:

1. 任務(wù)本身不復(fù)雜

如果是不得不使用向?qū)Ы缑?,則可以說明該項(xiàng)任務(wù)的確很復(fù)雜。要是能簡化任務(wù),比如通過簡單表單或者幾次按鈕點(diǎn)擊就能完成的事,那向?qū)Ы缑娲嬖诘囊饬x就不大了。

2. 人們太高端

即便是很復(fù)雜的任務(wù),加入向?qū)Ы缑嬉膊皇窃O(shè)計(jì)好用戶界面的唯一途徑。令不少高級(jí)用戶非常沮喪的是,向?qū)Ы缑娣浅K腊澹矣胁簧倬窒扌?。許多人并不知道每個(gè)步驟到底代表什么,也不知道完成每個(gè)步驟后會(huì)有什么變化。

因此,要說向?qū)Ы缑媸窃凇笌椭刮覀內(nèi)ソ鉀Q那些其本已知道怎么做的事情,就見慣不怪了。這對(duì)支持自主創(chuàng)作(比如搞藝術(shù)或者寫代碼)的軟件來說,就更加貼切。

小提示:我們應(yīng)該讓人們可以選擇他們想完成某項(xiàng)任務(wù)的方式。舉個(gè)例子,Dropbox 的安裝界面中,我們可以自由選擇不同的設(shè)置類型。如果選擇高級(jí)模式,人們則可以自定義軟件的安裝路徑,同步盤的位置等等。


3. 你想要告知信息時(shí)

不要通過向?qū)Ы缑鎭沓尸F(xiàn)某種概念。人們操作向?qū)Ы缑鏁r(shí),很少會(huì)閱讀輔助文字。他們所關(guān)注的,只是去完成核心任務(wù)罷了。

四、向?qū)Ы缑娴暮脤?shí)踐

設(shè)計(jì)下一個(gè)向?qū)Ы缑鏁r(shí),你可能需要注意以下幾點(diǎn),否則它可能就廢了:

1. 盡量減少安裝步驟的數(shù)量

設(shè)計(jì)向?qū)Ы缑孀铍y的部分,是在單一界面內(nèi)容和界面總數(shù)之間找到平衡點(diǎn)。如果向?qū)Ы缑嬷挥?2 個(gè)步驟,那就有點(diǎn)搞笑了,但有 10 個(gè)步驟的向?qū)Ы缑嬗痔^了。

理想狀態(tài)下,向?qū)Ы缑孀詈弥挥?3 到 5 個(gè)步驟。最好能提前進(jìn)行可用性測試,保證向?qū)Ы缑娴牟襟E數(shù)量在可以接受的范圍內(nèi)。

2. 保證向?qū)Ы缑娴哪康那逦?/strong>

在向?qū)Ы缑娴拿恳粋€(gè)步驟界面,人們都需要清晰地知道該界面目的。向?qū)Ы缑鎽?yīng)該為大家提供足夠多的信息,輔助其做決策。如果目的模糊,人們就摸不清方向。基于此,有兩個(gè)方面值得注意:

第一步要將目的簡要闡明。

每個(gè)環(huán)節(jié)的標(biāo)簽都要非常清晰、明了。


反面示范:在 Homesite Home Insurance 網(wǎng)站上,其向?qū)Ы缑娴牡谝豁撝胁]有明確指出安裝目的。如果用戶通過其它站點(diǎn)的鏈接跳轉(zhuǎn)到該頁面,我猜他們肯定會(huì)一臉懵逼。

3. 移除多余的界面元素

多余的鏈接和內(nèi)容往往會(huì)使用戶分心。移除這些元素,可以讓用戶專注于任務(wù)本身,增加成功完成任務(wù)的概率。

4. 清晰顯示進(jìn)度

有了清晰的進(jìn)度信息,人們才能知道何時(shí)可以完成該項(xiàng)任務(wù)。要把向?qū)Ы缑嬖O(shè)計(jì)得非常友好,不要忽略以下幾點(diǎn):

將每個(gè)步驟按順序標(biāo)號(hào)

顯示任務(wù)流的方向(通常情況下,從左到右,或從上到下)

凸顯當(dāng)前步驟,并顯示剩余步驟數(shù)量

完成某步驟后,嵌入成功完成該步驟提示

最后一步完成后的相關(guān)提示


反面示范:上圖示例中,每個(gè)步驟都是獨(dú)立界面,無上下文鋪墊,用戶無法確認(rèn)之前的信息,也無法預(yù)知之后的信息。


推薦示范:在該步驟名稱右處,清晰展示步驟數(shù)量。此外,界面頂部還展示了整個(gè)步驟的流程。原圖來源:Raj Shrestha

5. 加入「取消」按鈕

有時(shí),人們進(jìn)入向?qū)Ы缑婧?,?huì)因?yàn)榉N種原因,而決定退出。為了不讓想要退出、又找不到「出路」的用戶抓狂,在界面上加入「取消」按鈕就行了。

6. 每個(gè)步驟都允許撤銷

給大家留點(diǎn)出路吧,在每個(gè)步驟界面中都加入撤銷功能。如果人們可以重復(fù)之前的步驟,并修改之前輸入的信息,那他們估計(jì)會(huì)很開心吧。

否則的話,你只有讓他們從頭再來。不過話又說回來,如果僅僅是因?yàn)橐惶幮〉母淖?,那真是作死了?/p>

7. 提供所選項(xiàng)回顧,讓人們再次確認(rèn)

建議在向?qū)Ы缑娴淖詈?,提供整個(gè)過程的所選項(xiàng),以方便大家回顧。這可以讓他們再次確認(rèn)已輸入信息,從而無所顧忌地朝「完成」按鈕點(diǎn)過去。

結(jié)束語

雖然向?qū)Ы缑鎽?yīng)該設(shè)計(jì)得簡單易懂,但設(shè)計(jì)師和開發(fā)者深知背后的真相:要設(shè)計(jì)出好的向?qū)Ы缑?,一點(diǎn)都不簡單。

除了一系列的策劃、實(shí)驗(yàn)和再修正,整個(gè)設(shè)計(jì)創(chuàng)作過程中還可能出現(xiàn)讓你意想不到的難題。通過這篇文章,希望能幫助你設(shè)計(jì)出更好的向?qū)Ы缑妗?/p>

文章名稱:網(wǎng)頁設(shè)計(jì)中向?qū)Ы缑嫒绾卧O(shè)計(jì)
文章地址:http://www.rwnh.cn/news22/169872.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站設(shè)計(jì)網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)網(wǎng)站制作、網(wǎng)站營銷關(guān)鍵詞優(yōu)化

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

香港| 义乌市| 石台县| 白银市| 晋江市| 南澳县| 孟津县| 潜山县| 长寿区| 陇南市| 方城县| 黔江区| 西盟| 开化县| 收藏| 汤原县| 莱阳市| 姜堰市| 平顶山市| 万盛区| 红原县| 扶绥县| 贺兰县| 叶城县| 温泉县| 招远市| 华阴市| 木兰县| 高邑县| 渝中区| 聂荣县| 新绛县| 哈密市| 渝北区| 邵武市| 呼伦贝尔市| 清水河县| 多伦县| 尼勒克县| 青浦区| 横山县|