建站常識
如何精簡用戶界面
2010-04-07 21:41:00
簡潔、易用、友好、直觀。這些詞語經(jīng)常被提及,但在執(zhí)行過程中經(jīng)常被遺忘。這是因?yàn)檐浖δ艿膹?fù)雜性所導(dǎo)致的。如何處理好軟件的復(fù)雜功能往就可以決定它的命運(yùn)。一個復(fù)雜的界面會讓用戶不知如何操作。如果,減少復(fù)雜的操作過程并精簡操作界面,那該軟件的用戶體驗(yàn)就大大的提升了。
去除無用的功能
研究發(fā)現(xiàn):80%的用戶僅僅使用軟件20%的功能。而那些沒用的功能不僅浪費(fèi)開發(fā)時間,也使得軟件更加難以使用(這些功能對用戶的阻礙作用大于有用價值)。軟件試圖盡力可以把任何事都做好。而一個成功的軟件應(yīng)是簡練精干的,可單獨(dú)智能化的解決單個問題。
精簡的軟件可通過削減功能得到。通過默認(rèn)去除的方法判斷一個功能是否有必要保留。將軟件所有的功能進(jìn)行真正的篩選。如果該功能不能幫助大多數(shù)用戶完成日常的任務(wù),那么可以將其排除在外。刪除功能是艱難的,當(dāng)整理完畢后看到用戶順暢的使用軟件。你就會知道多么值得去做這件事情了。
隱藏復(fù)雜部分
如果實(shí)在無法去除某個復(fù)雜功能,那么就將其隱藏。通常情況下,不常使用的功能要比經(jīng)常使用的功能占據(jù)更多的屏幕空間。而優(yōu)秀的界面應(yīng)該確保最常用的功能在最顯著的位置,將不常用的功能隱藏。
當(dāng)我們重新設(shè)計CMS系統(tǒng)時,我們無法去除一個復(fù)雜的功能:批量編輯功能。在之前的版本里,在主屏幕上有一整排的批量編輯按鈕。約占據(jù)了屏幕30%的區(qū)域,但我們發(fā)覺很少有人會用到此功能。我們的解決方法是,放置一個小圖標(biāo)并在旁邊顯示數(shù)值以示下拉列表里有幾個選項(xiàng)。點(diǎn)擊圖標(biāo)或數(shù)字則顯示下拉列表。通過這種方式節(jié)省了大量的空間,也不會干擾用戶使用那些最基本的功能。
最小化視覺干擾
我們已經(jīng)討論了通過去除與隱藏的方式降低界面復(fù)雜性的方法。但減少“視覺感知”的復(fù)雜性也是很重要的。最小化視覺干擾將使得界面看上去易于使用。減少視覺干擾的兩個方法是:空白與對比。
空白,是指介于各個元素之間的間隙。它應(yīng)是你默認(rèn)的布局工具。經(jīng)典法則之一:如果可以使用空白就不要放置其他設(shè)計元素。如果用這種方式布局,你會很驚訝調(diào)整界面的空白就可以完成布局了。
雖然使用空白多多益善,但也要盡可能的保證有對比感。設(shè)計理論家“ddd”說:設(shè)計師應(yīng)使用最小的視覺變化來表達(dá)想法。事實(shí)上這就是意味著元素之間要有主次感。
你可以看到修改過的版本有很重的黑線,與之前的邊框不同。那個版本視覺干擾更小呢?(當(dāng)然是原來的更好)大量的空白區(qū)域減少視覺干擾并讓人覺得更舒適。
做減法、重復(fù)使用,循環(huán)利用
當(dāng)軟件成形后,問題經(jīng)常發(fā)生在程序的各個結(jié)合部分。存在的問題往往可以通過相同方法加以解決。界面中應(yīng)使用相同的組件。使用相同組件的兩個好處:減少開發(fā)所需時間;給人一致的使用體驗(yàn),如果用戶學(xué)會使用一個操作,他們就可以把相同的操作行為運(yùn)用到進(jìn)行其他操作中去。
在設(shè)計CMS過程中,我們在表單驗(yàn)證上花費(fèi)了大量的時間。我們用紅色框出無效的區(qū)域,甚至增加紅色的提示框來說明每個填寫表單的環(huán)節(jié)有多少錯誤。
在之后的開發(fā)過程中,我們在需求列表中增加了版本比較的功能。與其創(chuàng)建全新的框架,不如使用在已有的框架上進(jìn)行改進(jìn)。我們用藍(lán)框標(biāo)出已修改的表單,并使用藍(lán)色提示框標(biāo)注該區(qū)域。通過這種方法我們快速部署到用戶已經(jīng)熟悉的界面上。
重復(fù)使用元素是另一種可以減少界面復(fù)雜的方法,因?yàn)橛脩艨梢匝杆俚氖煜ぼ浖?BR>
#p#空白狀態(tài)不應(yīng)空白空白狀態(tài)是指界面無數(shù)據(jù)時的樣子,如用戶初次使用軟件。作為設(shè)計師,我們花費(fèi)大部分精力用來設(shè)計如何最好的展示內(nèi)容,但時常忘記如何展示無數(shù)據(jù)的樣子。
如何建立合理的默認(rèn)值是很重要的。軟件的空白狀態(tài)通常是給用戶的第一印象,用戶通過第一印象來考慮是否來使用軟件。好的空白狀態(tài)可有助于用戶學(xué)習(xí)使用軟件的途徑,幫助用戶學(xué)會初次使用軟件的基礎(chǔ)操作。
Versions的mac版本顯然在程序的空白狀態(tài)投入了很多心思。在首次運(yùn)行的時候,程序突出了兩大人們可能會用得到的功能。
再次重復(fù):不要忘記空白狀態(tài)!
相關(guān)展示
我們已經(jīng)見過大量界面混亂,復(fù)雜的軟件。然而,有效的減少程序的復(fù)雜性有點(diǎn)難度。
Invoice Machine 的界面十分的簡約。示例顯示它非常節(jié)約擴(kuò)展部分并注重細(xì)節(jié)。
Freckle只是確保你可以跟蹤自己的時間。簡潔的界面閃現(xiàn)活力,將例行任務(wù)變得有趣。
Image Spark黑白色的漸變。界面幾乎沒視覺干擾,易于使用。
Ballpark有簡潔的界面,用色不跳。
Krop,其核心就兩個表單:地址與關(guān)鍵詞。
Fever網(wǎng)站的整個目的就是減少你與感興趣博客之間的距離。它通過非常簡單獨(dú)特的方式來實(shí)現(xiàn)。
Screenr 是個驚人的簡單截屏并發(fā)布到Twitter的軟件。值得注意的是沒有的功能它有,但其他類似軟件有的功能它都沒有。
Squarespace 在隱藏復(fù)雜功能方面做得很好。雖然它是網(wǎng)絡(luò)的發(fā)布平臺,它把功能隱藏在一個簡潔的界面中。
總結(jié)
減掉不必要的功能;
然后隱藏那些不能減掉的功能;
減少視覺噪音并重復(fù)利用元素;
使用空白幫助用戶;
中文地址:http://blog.uxredesign.com/interactive-design/minimizing-complexity-in-user-interfaces/
原文地址:http://www.smashingmagazine.com/2009/10/07/minimizing-complexity-in-user-interfaces/
近期更新
- [2023-06-25 23:22:29] 優(yōu)秀網(wǎng)站設(shè)計的五大特點(diǎn)
- [2023-04-27 14:05:55] Html 5 響應(yīng)式網(wǎng)站設(shè)計制作
- [2023-04-10 11:07:30] 網(wǎng)站建設(shè)制作流程知多少
- [2022-10-14 10:11:30] 做網(wǎng)站設(shè)計應(yīng)該更看重框架搭建還是視覺觀感?
- [2022-08-09 15:57:48] 以“產(chǎn)品”思維搭建網(wǎng)站!
- [2022-08-08 09:12:57] 一家公司的網(wǎng)站應(yīng)該有哪些板塊內(nèi)容?
- [2022-08-05 09:28:06] 企業(yè)網(wǎng)站建設(shè)為什么要設(shè)置新聞板塊?
- [2022-07-04 15:58:06] 網(wǎng)站首頁設(shè)計的好看,這個網(wǎng)站就成功了一大半!
- [2022-05-20 09:34:19] 網(wǎng)站后臺管理系統(tǒng)是什么?有什么作用?
- [2022-05-17 11:29:32] 作為消費(fèi)者,應(yīng)該如何選擇一家水平高的網(wǎng)站建設(shè)公司
- [2022-05-17 11:27:01] 高端網(wǎng)站定制與模板化網(wǎng)站應(yīng)該怎么選擇?
- [2022-04-22 16:00:41] 現(xiàn)在高端的網(wǎng)站設(shè)計都有哪些新的趨勢?
延伸閱讀
- [2010-11-08 08:18:00] 用戶界面設(shè)計中“狀態(tài)”和“動作”的表達(dá)
- [2010-03-22 15:08:00] 會猜用戶心的界面
- [2009-10-09 08:13:00] 社會化網(wǎng)絡(luò)用戶界面(UI)的9個重要特征
- [2010-11-03 08:16:00] 如何設(shè)計一個良好體驗(yàn)的用戶界面(上)
- [2006-01-06 21:55:00] 網(wǎng)站設(shè)計和圖形用戶界面(GUI)設(shè)計的不同
- [2009-07-13 07:48:00] 良好的用戶界面設(shè)計
- [2010-06-10 16:14:00] 網(wǎng)頁設(shè)計(web design)和用戶界面設(shè)計(UI design)
- [2009-09-15 22:23:00] 用戶界面設(shè)計10原則
- [2009-04-20 08:33:00] 成功的用戶界面的八個特性
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計解決方案 科技企業(yè)網(wǎng)站設(shè)計解決方案 電子家電網(wǎng)站設(shè)計解決方案 食品行業(yè)網(wǎng)站設(shè)計解決方案 集團(tuán)公司網(wǎng)站設(shè)計解決方案 企事業(yè)單位網(wǎng)站設(shè)計解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計解決方案 健身運(yùn)動網(wǎng)站設(shè)計解決方案 美容與化妝品網(wǎng)站設(shè)計解決方案 建筑設(shè)計行業(yè)網(wǎng)站設(shè)計解決方案 物流行業(yè)網(wǎng)站設(shè)計解決方案
TAGS關(guān)鍵字
青島輪胎網(wǎng)站設(shè)計公司 程序開發(fā) 新的元素 色彩心理學(xué) 網(wǎng)頁設(shè)計 視覺靈感 網(wǎng)站開發(fā) IT資訊 網(wǎng)站策劃 用戶界面 交互設(shè)計 高端輪胎網(wǎng)站設(shè)計 青島網(wǎng)站建設(shè)公司哪家好 網(wǎng)站品牌 官網(wǎng)網(wǎng)站建設(shè) 青島高端網(wǎng)站建設(shè)公司哪家好 外貿(mào)網(wǎng)站設(shè)計 青島網(wǎng)站SEO html和css 扁平化設(shè)計 青島網(wǎng)頁設(shè)計 營銷策略 建站常識 微信開發(fā) 企業(yè)建站 網(wǎng)站改版 膠南網(wǎng)站建設(shè)公司 如何做網(wǎng)站優(yōu)化 手機(jī)網(wǎng)站建設(shè) 搜索引擎蜘蛛