2015-6-12 藍(lán)藍(lán)設(shè)計(jì)的小編
藍(lán)藍(lán)設(shè)計(jì)( m.qdjdjx.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
每一個(gè)扁平化界面設(shè)計(jì)，都是我們的心靈碰撞致力于最棒的 metro ui 設(shè)計(jì)
來(lái)源：http://www.woshipm.com/ucd/160170.html
一個(gè)好的用戶界面具有較高的轉(zhuǎn)化率和易用性。換句話說(shuō)，它既能滿足商業(yè)用途也便于使用。以下是我們發(fā)現(xiàn)的一些想法清單。
1. 嘗試使用一列布局代替多列
一列布局會(huì)讓你對(duì)全局有更好的掌控。它也能讓你的用戶預(yù)先對(duì)整體的內(nèi)容從上到下有一個(gè)大致的了解。然而多列布局則會(huì)讓用戶從頁(yè)面的核心內(nèi)容上分散注意力從而增加額外的風(fēng)險(xiǎn)。最好的方法是用一個(gè)有邏輯的敘述然后在文末加上一個(gè)行動(dòng)的口號(hào)來(lái)引導(dǎo)用戶。 
2. 嘗試用禮物代替直接銷售
為客戶提供一份禮物是一種友好的方式。然而，更深層次來(lái)說(shuō)，禮物也是基于互惠原則的一種有效的說(shuō)服策略。這聽起來(lái)顯而易見，給別人提供優(yōu)惠，你在將來(lái)的活動(dòng)中也能從中受益。
3. 嘗試合并相似的功能，而不是支離破碎的UI
在產(chǎn)品開發(fā)期間，我們很容易在無(wú)意中創(chuàng)建多個(gè)功能一樣的模塊，元素及專題。隨著時(shí)間的推移，界面變得支離破碎。留意相同的功能以多種方式展示，因?yàn)樗菀捉o你的客戶帶來(lái)壓力。通常，UI碎片越多，你的客戶的學(xué)習(xí)成本就越高。偶爾考慮通過(guò)合并相似的功能來(lái)重構(gòu)你的UI。
4. 嘗試用客戶評(píng)價(jià)來(lái)代替自吹自擂
客戶評(píng)價(jià)是直接提高轉(zhuǎn)化率的另一個(gè)強(qiáng)有力的說(shuō)服策略。別人對(duì)你產(chǎn)品的支持和好評(píng)，是一種很好地號(hào)召客戶行動(dòng)的方式。所以試著提供一些證據(jù)來(lái)證明這些好評(píng)是真實(shí)可信的。
5. 嘗試多次重復(fù)您的主旨，而不是只展示一次
重復(fù)你的行動(dòng)口號(hào)是一種更適用于長(zhǎng)頁(yè)面的策略，或者是在多個(gè)頁(yè)面進(jìn)行重復(fù)。當(dāng)然你也不想讓同樣的信息在同一屏幕里重復(fù)上10次，這會(huì)讓客戶很沮喪。然而，長(zhǎng)頁(yè)面越來(lái)越普遍，將所有東西都展現(xiàn)“在一屏”上的想法也過(guò)時(shí)了。所以將一個(gè)不太顯眼的行動(dòng)列表放在頂部，另一個(gè)突出的行動(dòng)口號(hào)放在底部并沒有什么不妥。當(dāng)用戶到達(dá)頁(yè)面底部，停頓并思考接下來(lái)改做什么的時(shí)候——一個(gè)潛在的區(qū)域或許就能完成一次報(bào)價(jià)或成交一筆交易。
6. 嘗試將可點(diǎn)擊/可選擇的樣式區(qū)分開來(lái)，而不是將其模糊
視覺上的樣式，例如顏色、層次和對(duì)比，可以用來(lái)幫助用戶理解你最基礎(chǔ)的界面導(dǎo)航語(yǔ)言：我在哪里，我可以到哪里去。為了與你的用戶清楚地溝通，你的可點(diǎn)擊行為（鏈接，按鈕）、可選元素（可選項(xiàng)），以及單純的文本應(yīng)該清楚地區(qū)分開來(lái)，然后在這一套界面中保持一致性。在下面的例子中，我選擇藍(lán)色標(biāo)識(shí)能被點(diǎn)擊的元素，黑色標(biāo)識(shí)已被選中的元素或表明當(dāng)前所在的位置。正確運(yùn)用這些標(biāo)記，更便于用戶學(xué)習(xí)和使用這些線索來(lái)導(dǎo)航界面。不要模糊這三種功能樣式使產(chǎn)品使用困難。
7. 嘗試用推薦來(lái)代替羅列相同的選項(xiàng)
當(dāng)展示多種服務(wù)時(shí)，一個(gè)強(qiáng)力的推薦或許是個(gè)好主意，因?yàn)橛脩粲袝r(shí)候需要一點(diǎn)推動(dòng)。一些心理學(xué)的研究表明，選擇性越多，用戶將想法付諸實(shí)踐并行動(dòng)起來(lái)的概率就越低。為了消除這種選擇障礙，試著強(qiáng)調(diào)和突出顯示某些選項(xiàng)。
8. 嘗試用撤銷操作來(lái)代替提示確認(rèn)
想象一下，你只是按下了一個(gè)操作按鈕或者鏈接，撤銷能讓操作更流暢自然。另一方面，提示操作則在暗示用戶不清楚用戶在干什么，并一直質(zhì)疑用戶的意圖。大部分情況下我會(huì)假設(shè)用戶是明白自己的意圖的，誤操作只是偶然發(fā)生的。當(dāng)提示窗口彈出時(shí)，用戶必須重復(fù)地進(jìn)行確認(rèn)操作，一次又一次的提示其實(shí)是一種非常不人性化的設(shè)計(jì)。所以考慮讓用戶執(zhí)行撤銷操作來(lái)提高產(chǎn)品的友好度而不是一直提醒用戶確認(rèn)。
9. 嘗試寫明產(chǎn)品使用人群而不是所有人
你的產(chǎn)品是面向所有人還是有地指明受眾群體？明確指明你的產(chǎn)品或者服務(wù)的受眾群是明智的。通過(guò)不斷了解目標(biāo)客戶的需求及標(biāo)準(zhǔn)，你能獲得更多與客戶交流的機(jī)會(huì)，并且讓客戶覺得享受了產(chǎn)品的專屬服務(wù)。這種策略的風(fēng)險(xiǎn)是你可能精簡(jiǎn)了自身，并縮小了潛在客戶的范圍。然而，透明建立信任，你可能因此獲得客戶更多的信任。
10. 嘗試直截了當(dāng)而不是猶豫不決
你可以用不確定的帶著顫抖的聲音傳達(dá)你的信息，也可以滿懷自信地說(shuō)出來(lái)。如果你經(jīng)常用類似“也許”、“可能”、“感興趣？”、“想要嗎？”這樣的疑問(wèn)語(yǔ)氣來(lái)結(jié)束信息的傳達(dá)，或許你可以嘗試用更權(quán)威的語(yǔ)氣來(lái)表達(dá)。誰(shuí)知道呢，或許更為舒緩的措辭來(lái)告訴用戶接下來(lái)該怎么做也可以給用戶留下更多思考的余地。
11. 嘗試用鮮明的對(duì)比代替相似性
將你的行動(dòng)口號(hào)與周圍的元素區(qū)分開來(lái)，使其更顯眼一點(diǎn)，能讓你的UI表達(dá)更強(qiáng)烈。你能輕易地通過(guò)多種方式讓你的主旨口號(hào)更醒目。你能采用明暗色調(diào)的對(duì)比來(lái)凸顯。你還能采用投影和漸變來(lái)實(shí)現(xiàn)層次上的對(duì)比。最后，你還可以從色輪上選取互補(bǔ)色（例如：黃色和紫色）來(lái)進(jìn)一步提高對(duì)比度。綜上所述，你應(yīng)該考慮將你的行動(dòng)口號(hào)與頁(yè)面上其它元素明顯區(qū)分開來(lái)。
12. 嘗試指明原產(chǎn)地
指明你的原產(chǎn)地，你的產(chǎn)品或者服務(wù)從哪里來(lái)的，可以將你與客戶的關(guān)系拉得更近。具體提到產(chǎn)品的原產(chǎn)地的國(guó)家、州或者城市，就像人與人溝通時(shí)自我介紹一樣。如果你在產(chǎn)品介紹時(shí)做到這點(diǎn)，你的界面顯得更友好。通常，說(shuō)明你的產(chǎn)品的產(chǎn)地也能讓客戶感覺產(chǎn)品的質(zhì)量更有保證。這是一種雙贏的方法。
13. 嘗試精簡(jiǎn)表單
人類天生就抗拒密集型勞動(dòng)，并且這也體現(xiàn)在表單填寫上。你要求用戶填寫的每一個(gè)字段都有讓用戶轉(zhuǎn)身放棄的風(fēng)險(xiǎn)。每個(gè)人打字的速度都是不一樣的，況且在移動(dòng)設(shè)備端輸入更是一件苦差事。確定是否每一個(gè)字段都是必需的，盡量刪掉不必要的字段。如果你確實(shí)有大量的信息需要用戶填寫，考慮將它們分開到不同的頁(yè)面填寫，或者在提交之后還能繼續(xù)補(bǔ)充。過(guò)多的字段會(huì)讓你的表單臃腫，要想精簡(jiǎn)也很容易，減少字段就行了。
14. 嘗試暴露選項(xiàng)而不是隱藏它們
你使用的每一個(gè)下拉菜單隱藏的信息，都需要用戶用額外的操作才能顯示。假如那些隱藏選項(xiàng)對(duì)用戶來(lái)說(shuō)是貫穿整個(gè)操作的，你可能會(huì)希望它們展示得更明顯一些。保留那些約定俗成的下拉菜單，比如說(shuō)日期和時(shí)間（例如：日歷）或者地理位置的選擇。有時(shí)候下拉菜單在用戶重復(fù)使用的地方也是可以使用的（例如：操作菜單）。在你需要進(jìn)行頁(yè)面跳轉(zhuǎn)的地方，盡量避免為主要功能使用下拉菜單。
15. 嘗試分模塊有條理地?cái)⑹龆皇情L(zhǎng)篇大論的平鋪直敘
長(zhǎng)篇大論的平鋪直敘是很容易失去客戶的。是的，很長(zhǎng)的滾動(dòng)頁(yè)面是很帥，但是要小心給客戶這樣一種感覺——在頁(yè)面還沒有結(jié)束的時(shí)候誤以為內(nèi)容已經(jīng)結(jié)束。假如你的頁(yè)面需要滾動(dòng)，嘗試設(shè)置一個(gè)可見的標(biāo)識(shí)，讓用戶遵循這個(gè)規(guī)律看下去。其次，內(nèi)容間的間隙也不能過(guò)大（當(dāng)然我指的是一個(gè)區(qū)間范圍，況且有這么多的設(shè)備尺寸）。
16. 嘗試保持焦點(diǎn)而不是濫用鏈接
為了盡可能滿足更多客戶的需求，很容易在一個(gè)頁(yè)面上創(chuàng)建得到處都是鏈接。如果我們的重點(diǎn)是長(zhǎng)文本底部那個(gè)行動(dòng)口號(hào)的話，那就得三思了。其它任何鏈接都有可能使用戶離開頁(yè)面。注意你頁(yè)面上鏈接的數(shù)量，盡可能平衡導(dǎo)航頁(yè)面上的風(fēng)格（更少的鏈接以及更高的轉(zhuǎn)化率）。刪除無(wú)關(guān)的鏈接更有可能讓用戶點(diǎn)擊那個(gè)最重要按鈕。
17. 嘗試顯示進(jìn)度狀態(tài)
在用戶界面上我們經(jīng)常顯示有不同狀態(tài)的元素。郵件有已讀、未讀狀態(tài)，發(fā)票有已付、未付的狀態(tài)，等等。通知用戶每一條記錄的特殊狀態(tài)，是提供信息反饋的好方法。界面狀態(tài)能幫助用戶很好地理解他們之前的操作是否成功執(zhí)行，以及接下來(lái)的操作怎么處理。
18. 顯示對(duì)用戶有利的按鈕信息，而不是讓用戶覺得自己只是在完成任務(wù)
試想一下界面上有兩個(gè)簡(jiǎn)單的按鈕。一個(gè)按鈕告訴你它將會(huì)“為你省錢”，而另一個(gè)要求你“立即注冊(cè)”。我敢打賭，第一個(gè)按鈕被點(diǎn)擊的幾率更大，因?yàn)樽?cè)沒有自己內(nèi)在的價(jià)值。而且，注冊(cè)讓人想到填不完的表單，過(guò)程特別費(fèi)勁。假設(shè)表明，讓用戶感到有利可圖的按鈕更有可能被點(diǎn)擊。另外，將好處寫在操作按鈕附近可以提醒用戶這樣操作的原因。當(dāng)然，現(xiàn)在仍有為基于任務(wù)的操作按鈕保留的空間，不過(guò)，這是預(yù)留給那些轉(zhuǎn)化率不高但使用率很高的操作元素。
19. 嘗試直接操作而不是無(wú)上下文的菜單
有時(shí)候，直接在元素上進(jìn)行操作比無(wú)相關(guān)的菜單羅列要更有用。舉個(gè)例子來(lái)說(shuō)，當(dāng)展示數(shù)據(jù)列表的時(shí)候，我們通常允許用戶在列表的項(xiàng)上進(jìn)行相關(guān)的操作。在列表項(xiàng)上點(diǎn)擊，或者是鼠標(biāo)滑過(guò)都能被用來(lái)表達(dá)一種特定的操作（刪除，重命名，等等）。直接操作的另一個(gè)例子是點(diǎn)擊一個(gè)數(shù)據(jù)項(xiàng)（例如說(shuō)一串文本地址）后，然后文本框變成可編輯的狀態(tài)。使用這樣的交互，減少了一些不必要的步驟。不過(guò)對(duì)于一些一般性的操作（比如說(shuō)前進(jìn)、后退），使用無(wú)上下文的菜單是沒有錯(cuò)的。
20. 盡量顯示全部?jī)?nèi)容而不是創(chuàng)建額外的頁(yè)面
當(dāng)創(chuàng)建登錄頁(yè)面時(shí)，在轉(zhuǎn)換頁(yè)面上顯示全部表單字段會(huì)更好。與單獨(dú)創(chuàng)建額外的注冊(cè)頁(yè)相比，將注冊(cè)表單與登錄頁(yè)合并有更多的好處。首先，我們減少了流程操作中的額外步驟，這樣操作將花費(fèi)更少的時(shí)間。其次，通過(guò)顯示表單字段的數(shù)量，我們也向客戶展示了注冊(cè)表單的實(shí)際長(zhǎng)度。當(dāng)然，前提是我們的表單比較短（當(dāng)然表單也應(yīng)該盡量簡(jiǎn)短）。
本文為@謝爾魚 翻譯并授權(quán)人人都是產(chǎn)品經(jīng)理社區(qū)發(fā)布，轉(zhuǎn)載請(qǐng)注明來(lái)自人人都是產(chǎn)品經(jīng)理社區(qū)并保留作者信息。
原文地址：http://goodui.org/
未完待續(xù)...原文比較長(zhǎng)，共65條，分三次翻譯完，這是1-20條。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.qdjdjx.cn