你一個網(wǎng)頁設(shè)計師嗎？如果是的，那么你也是一個用戶界面設(shè)計師，在不久的將來，這個角色將變得更加重要。雖然現(xiàn)在的網(wǎng)頁有簡單用戶界面，沒有了復(fù)雜的導(dǎo)航欄和表格，不過，新技術(shù)的崛起和標(biāo)準(zhǔn)將創(chuàng)建一個更動態(tài)和需求定制的體驗。

這也預(yù)示著更多的用戶界面設(shè)計工作，那么，接下來，我們看看，作為設(shè)計師的你，應(yīng)該要記住些什么？

法則一：清晰法則

用戶會避開沒有明確意義的界面元素

你使用Gmail嗎？在最新一次更新前，我在使用。Gmail頂部有非常清晰的文本導(dǎo)航頁面——Calendar, Drive, Sheets以及其他谷歌服務(wù)按鈕。不過，google想簡化他們，把他們換成了抽象圖標(biāo)。

結(jié)果呢？很多用戶不再使用這些圖標(biāo)按鈕，Gmail收到了一大堆來自用戶的技術(shù)請求。

出于人的天性，人們避免，也常常忽視他們不能理解的東西。避免用戶界面設(shè)計中出現(xiàn)讓他們疑惑如何往下操作的元素，因為沒有人會愿意費力去尋找出來。

法則二：首選行動法則

當(dāng)用戶知道什么可以作為他們的首要操作項目，他們會感覺到更加友好。

看看 Twitter 的個人半島外圍網(wǎng)上直營吧。你覺得用戶會首先想做什么？

很明顯，他們會想要第一時間發(fā)一條消息。但是編寫信息的按鈕（"Compose new tweet"）在右上角，并不明顯（見法則一）。不過，左邊輸入欄就比較符合場景了。從設(shè)計的角度來看,Twitter想要用戶在左邊導(dǎo)航欄搜索或進(jìn)行其他操作。

用戶并不知道下一步該做什么——所以首選行動就會是他們的首要操作。

法則三：內(nèi)容法則

用戶更喜歡界面組件和對應(yīng)操作內(nèi)容緊挨在一起。

你如何編輯Facebook昵稱？"設(shè)置》賬戶設(shè)置"然后點擊編輯，LinkedIn呢？只需要點擊昵稱旁邊的鉛筆圖標(biāo)即可修改。

用戶更喜歡界面組件和對應(yīng)操作內(nèi)容緊挨在一起，這是一個自然習(xí)慣，在生活中也如此。

讓操作更加順手——如果你的界面上有東西可以被編輯、改變、控制等，請把操作組件放在其旁邊。

法則四：默認(rèn)設(shè)置法則

大多數(shù)用戶幾乎從不改變默認(rèn)設(shè)置。

還記得諾基亞手機(jī)的默認(rèn)鈴聲嗎？它曾經(jīng)是這個星球最流行的鈴聲，他就是默認(rèn)設(shè)置，而大多數(shù)人們從未改變過他。

默認(rèn)設(shè)置的強(qiáng)大力量：

• 大多數(shù)人的手機(jī)都有設(shè)置默認(rèn)背景和鈴聲
• 大多數(shù)人（包括你）從來不改變電視的出廠設(shè)置（默認(rèn)設(shè)置）
• 大多數(shù)人從來不改變冰箱溫度設(shè)置。

盡可能確保默認(rèn)設(shè)置值的實用性和適用性——因為很多人從來不會改變他。

法則五：指導(dǎo)行為法則

用戶如果被要求跟隨做某事，很可能會去做。

用戶自己做某事和引導(dǎo)用戶做某事有很大度區(qū)別，例如，LinkedIn介紹 Endorsements功能，他不會告訴用戶怎么做，而是用可視化的引導(dǎo)操作告訴你，你可以在右上角找到這個功能。而且，實時證明，這樣做很成功。

如果你想要讓用戶做些什么，不要猶豫，告訴他們?nèi)プ觥?/p>

法則六：反饋法則

用戶會覺得更加有信心操作，如果你提供清晰和持續(xù)的反饋信息。

一個很簡單的邏輯——你的界面反映出是一個相互交流的行為，用戶會更加有信心。

Gmail就是一個很好的例子，用戶的每一步操作，都會得到清楚的通知。這樣，用戶會覺得一切在掌控之中，也更加有信心繼續(xù)操作。

法則七：輕松法則

將復(fù)雜的步驟分解成小步驟，用戶會更加愿意操作。

可以對比上面左右兩圖，差不多的內(nèi)容，但是右邊的更加易于填寫。

我們都討厭又長有復(fù)雜的表格。不過，把它分成幾個小步驟，就非常好操作了。

這就是輕松法則——人們寧愿填寫10個小步驟，也不愿意填寫一個內(nèi)容多的大步驟。小任務(wù)更受用戶歡迎，也可以給用戶完成的成就感。

推薦閱讀：

• 成為優(yōu)秀的Web移動開發(fā)者：網(wǎng)站設(shè)計資源大全
• 超級實用的響應(yīng)式網(wǎng)站設(shè)計工具匯總
• 八個面向移動開發(fā)的免費扁平化UI設(shè)計工具
• 2014年十大最佳網(wǎng)站創(chuàng)建工具（網(wǎng)站）推薦
• 軟件界面設(shè)計三大流程
• 界面設(shè)計基礎(chǔ)原則總結(jié)
• 10款最佳用戶界面設(shè)計/網(wǎng)站線框圖工具介紹和比較
• 20個經(jīng)典iOS界面設(shè)計案例激發(fā)iPhone應(yīng)用UI設(shè)計靈感