close

如何設計一個良好體驗的用戶界面(上) - 網頁設計

http://webdesign.zoapcon.com

當設計一個web應用程序或項目時,功能往往是首先要被考慮的。在大多數情況下,這是一件好事。

大部分人在使用的應用程序時,是因為它們是有用的,而不是因為它們看起來很漂亮。
但是,這并不意味著你可以忽略良好的界面設計。
良好的用戶界面設計可以增加用戶對于Web應用程序的用滿意度。

良好的用戶界面設計與良好的網頁設計在許多方面類似。
色彩理論,空間,布局原則等在界面設計中仍然適用。
但是,用戶界面設計中,由于需要更多的交互性,需要考慮的內容更多。

游客將不只是在看你的網站,他們將與它進行互動,可能設計師會忽略其中某些互動可能。
這就是說你必須花時間去思考和探索用戶界面的交互方法和類型。

下面是一些界面設計的原則和理念,雖然比較像教科書,但道理十分有用。

設計的一致性是至關重要的

在用戶界面設計和網頁設計中,功能與界面的一致性是至關重要的。
因為用戶在使用你的web程序時,如果從一個頁面風格突然轉換到另一個風格,這將造成很大的困惑和沮喪。

為了保持一致性,需要注意界面的配色方案和總體布局,以及鏈接是否正確。

您的用戶會犯錯誤

不管你的web程序設計的多好,都很難避免用戶犯一些錯誤,所以在考慮界面設計時,需要關注用戶在發生錯誤后如何進行回復。

最常見的例子就是google的web應用程序,我們會發現在很多地方google都放置了撤銷功能鍵或按鈕,因此既然無法避免用戶犯錯,那么我們就要盡量讓用戶可以自己修復這個錯誤,讓程序變得可以撤銷或返回上一步就十分必要了。

突出web應用程序的顯示功能

顯示內容是web應用程序的基本功能,比如在很多情況下我們希望用戶看到的內容是最新的,那么如何突出新舊內容的區別人。

下面的一個實例界面給了我們一種思考,將老內容的標題背景使用灰色,而新內容則使用綠色,這樣用戶可以很容易分辨出這些現實內容的區別。

當然此類方法還有很多,根本方法就是利用不同的顯示效果讓用戶使用和閱讀起來更方便


TitanPad使用顏色編碼來表示每個用戶造成的更改,類似圖圖網。


啟用鍵盤快捷鍵

并不是每個用戶都會需要使用鍵盤快捷鍵,但有些用戶確實有使用快捷鍵的習慣,一個好的web界面要盡量滿足不同用戶的需求,對于快捷鍵一般可以提供一些常用的組合。

最常見的鍵盤快捷鍵比如:CTRL + Z撤消或Ctrl + V粘貼。

可以根據web程序的功能和相關用戶的使用經驗來進行合理的快捷鍵搭配

使用熟悉的標準和約定

應用程序的功能很多都是互通的,比如我們在使用文本編輯工具時,經常會使用到一些word的功能,這樣設計的作用就是為了使用標準和約定的功能來減少用戶的學習時間。

例如,人們都習慣看到一個“打開”,或為“粘貼”剪貼板文件夾圖標。

提供個性化的選擇

很多的web應用允許用戶進行自定義他們的帳戶。 有些網站讓你調整配色方案或上傳自定義圖形。
還有一些可以讓你重新布局或在您登錄后顯示你創建的自定義頁面或類似內容,顯示你關心的信息。

可以在你的web應用中加入這些自定義功能,讓您的web應用具有更好的用戶體驗。

雖然并不是自定義功能越多越好,但一些常用的功能可以提高使用體驗,比如允許用戶上傳他們自己的徽標或更改配色方案或字體,以適應他們的個人喜好,這些都是很簡單的事情。


允許用戶定制自己的導航條的配色方案。
這樣的小的定制選項可以大大增加用戶滿意度。

使用工具提示和幫助信息
當涉及到一些復雜的步驟,發生錯誤等事件時,友好的提示與幫助功能可以大大增強用戶的好感

使用標簽式導航操作和按鈕
標簽導航已經在很多界面中被廣泛使用,至今依然是最有效的導航菜單之一。好處這里不一一闡述,相信很多設計師都會首選這種導航條樣式

遮罩背后效果的彈出窗口

遮罩背景,并彈出功能窗口,這種設計的好處可以減少不必要的視覺干擾,同時讓用戶停留在一個頁面中,這樣操作起來更有連貫性。

 



利用相關的圖標和標簽

每個圖標都有自己的含義,圖標可以增加界面的美觀,但更多時候圖標代表了功能。因此選擇一套統一風格并容易識別的圖標是很重要的。

相反錯誤的圖標很容易讓人產生混亂,所以圖標選擇是界面設計中很重要的一環。

讓界面簡單一些

為了花哨而添加的元素盡量減少,沒必要用圖標的地方盡量用文字代替。去掉沒必要的框框與線條。總之減少一切沒必要的元素,這樣你的web應用將更受用戶歡迎,以為用戶會經常使用,所以簡單的更容易讓他們產生好感

要記住用戶使用的功能,而不是你的設計。

高效的工作流程

流程是所有程序必不可少的,這里要遵循的設計原則是:盡量用一些人們預定的流程模式。比如注冊,登錄等這些常用功能都可以采用大眾化的流程。

對于一些特殊有特殊需要的流程盡量減少每個步驟中的內容元素,當然也不能增加太多的步驟,總體上要找到用戶能接受的方案。

原文鏈接:http://bbs.tutu001.com/thread-72-1-1.html


arrow
arrow
    文章標籤
    網頁設計 web design
    全站熱搜

    imarketin 發表在 痞客邦 留言(0) 人氣()