下面是如何設(shè)計(jì)更好用的web應(yīng)用程序的10個(gè)建議!

技巧1:注意選項(xiàng)卡

選項(xiàng)卡在內(nèi)容組織上具有很好的視覺(jué)表達(dá)概念。其功能直觀,每個(gè)人都知道如何使用它們。不幸的是,選項(xiàng)卡允許偷懶的設(shè)計(jì)師讓表單失控,變得混亂無(wú)序。

不要使用選項(xiàng)卡來(lái)處理過(guò)于復(fù)雜的表單。把精力放在降低過(guò)于復(fù)雜的表單上。如果全放在在單個(gè)頁(yè)面會(huì)變得太雜亂,請(qǐng)把它們分解成一個(gè)向?qū)А?/P>

技巧2:讓保存行為一致

不要將自動(dòng)提交和手動(dòng)保存行為混雜在一起。如果有save按鈕,用戶(hù)將不再信任自動(dòng)提交的行為。同樣的道理,在其他類(lèi)型的輸入時(shí)他們可能認(rèn)為自動(dòng)提交會(huì)處理，從而忽視save按鈕。不管你選擇哪種方法,堅(jiān)持下去,保證一致性。

技巧3:考慮刪除按鈕的位置

除非用戶(hù)需要頻繁地刪除東西,否則你應(yīng)該在表單中把刪除按鈕放到一個(gè)次要的地方。在搜索結(jié)果中提供刪除按鈕可能增加不必要的復(fù)雜性,從而過(guò)多地強(qiáng)調(diào)了可能不希望用戶(hù)頻繁地使用的行為。

技巧4:總是提供輸入域的標(biāo)簽

在web應(yīng)用中使用空白提示符而不是輸入框標(biāo)簽已成為一個(gè)流行趨勢(shì),因?yàn)閼?yīng)用看起來(lái)很簡(jiǎn)潔清晰。不幸的是當(dāng)用戶(hù)輸入一些內(nèi)容后,空白提示消失了,用戶(hù)想知道哪個(gè)輸入框是什么數(shù)據(jù)怎么辦呢?

浮動(dòng)標(biāo)簽已經(jīng)成為一種新流行的解決方案,在區(qū)分用戶(hù)占位符的簡(jiǎn)潔和使用固定的標(biāo)簽之間。

技巧5:當(dāng)有新需求時(shí)做出正確的調(diào)研

大多數(shù)用戶(hù)并不知道如何設(shè)計(jì)軟件,但他們經(jīng)常對(duì)軟件設(shè)計(jì)提出要求。詢(xún)問(wèn)他們需要一個(gè)新東西的原因,理解他們真正想要的完成的是什么。為潛在的需求提供一個(gè)更好的解決方案，而不是盲目地交付新功能。

技巧6:平衡界面直觀性與效率

當(dāng)用戶(hù)首次使用您的應(yīng)用時(shí),他們需要盡量快速地上手。用戶(hù)永遠(yuǎn)不會(huì)查閱文檔,在大多數(shù)情況下也不會(huì)得到任何培訓(xùn)。也就是說(shuō),隨著時(shí)間的推移,用戶(hù)將從努力學(xué)習(xí)如何使用轉(zhuǎn)變到需要非常高效地在一天八個(gè)小時(shí)內(nèi)用它完成工作。

讓?xiě)?yīng)用容易上手并保持屏幕簡(jiǎn)潔,與高效快捷的使用之間有一種微妙的平衡。

技巧7:保存后會(huì)發(fā)生什么?

總是考慮用戶(hù)在單擊保存并提交后會(huì)發(fā)生什么。結(jié)果必須是一致的,用戶(hù)需要在某個(gè)位置知道響應(yīng)信息。如果您的應(yīng)用程序有典型的search-edit-save概念,正確的做法是顯示在搜索結(jié)果頁(yè)面,因?yàn)樗麄兛赡苷郎?zhǔn)備繼續(xù)列表中的下一項(xiàng)。

如果用戶(hù)已經(jīng)在一個(gè)向?qū)Ы缑嬷型瓿啥鄠€(gè)步驟的過(guò)程,則需要一個(gè)完成頁(yè)面顯示保存了什么東西,并提供下一步可選的選項(xiàng)。在向?qū)У拇_認(rèn)頁(yè)面上如果沒(méi)有下一步行動(dòng)或建議可能會(huì)使新用戶(hù)感到困惑。

技巧8:當(dāng)前所處位置?

在一個(gè)較大的web應(yīng)用中,可能有幾十甚至上百個(gè)界面。用戶(hù)總是需要有個(gè)一致的方式知道他們處于應(yīng)用程序的那個(gè)位置以及當(dāng)前正在編輯什么東西。這可以通過(guò)導(dǎo)航條來(lái)高亮顯示顯示用戶(hù)在應(yīng)用程序的哪個(gè)位置。

您還可以面包屑導(dǎo)航來(lái)描述用戶(hù)在應(yīng)用程序中位置。Breadcrumbs(面包屑導(dǎo)航)還可以顯示用戶(hù)選定的每個(gè)地方,可以單擊其中一個(gè)回到他們上次瀏覽的界面。

技巧9:不要糾結(jié)于滾動(dòng)條

在桌面應(yīng)用程序時(shí)代的典型UI設(shè)計(jì)是適配屏幕,沒(méi)有滾動(dòng)條。在web應(yīng)用中垂直滾動(dòng)條并不是一件壞事,只要它可見(jiàn)并且清晰地顯示。當(dāng)用戶(hù)點(diǎn)擊表單選項(xiàng)卡,根據(jù)瀏覽器的行為,甚至?xí)詣?dòng)滾動(dòng)到適當(dāng)?shù)奈恢谩?/P>

技巧10:不要害怕空白

有一種自然傾向,試圖填滿(mǎn)一切。隨著需求的增長(zhǎng),開(kāi)發(fā)人員將越來(lái)越多的功能硬塞進(jìn)一個(gè)有限的空間。剩下的是一個(gè)過(guò)于復(fù)雜的應(yīng)用程序,看起來(lái)相當(dāng)復(fù)雜和混亂。留下適量的空白可以讓您的應(yīng)用程序看起來(lái)簡(jiǎn)單,平易近人。

結(jié)論

用戶(hù)對(duì)應(yīng)用好壞的評(píng)判標(biāo)準(zhǔn)更多在于界面而不是功能。如果用戶(hù)認(rèn)為應(yīng)用程序易于使用,使他們感覺(jué)很好那就會(huì)使用您的應(yīng)用程序,否則即便功能再?gòu)?qiáng)大也難以得到好評(píng)。在設(shè)計(jì)你的下一個(gè)web應(yīng)用程序時(shí)記住這十條提示,用戶(hù)會(huì)感激你的!

更多信息請(qǐng)查看IT技術(shù)專(zhuān)欄