一個(gè)成功的項(xiàng)目是優(yōu)秀設(shè)計(jì)，殺手內(nèi)容和一點(diǎn)點(diǎn)運(yùn)氣的結(jié)合。很多時(shí)候，設(shè)計(jì)被簡(jiǎn)單的用戶(hù)體驗(yàn)錯(cuò)誤所破壞，這些錯(cuò)誤會(huì)破壞內(nèi)容并混淆接口的預(yù)期行為。

用戶(hù)可能很容易失去原因以及他們應(yīng)該做什么的蹤跡。值得慶幸的是，許多這些設(shè)計(jì)錯(cuò)誤很容易識(shí)別和糾正。（作為獎(jiǎng)勵(lì)，這篇文章中的例子是正確的;用它們作為指導(dǎo)！）

1.不可讀的字體

有一個(gè)短暫的階段，其中設(shè)計(jì)包裝了新穎的字體。雖然這本身并不是一個(gè)問(wèn)題，但當(dāng)文字難以閱讀時(shí)確實(shí)存在問(wèn)題。（如果用戶(hù)無(wú)法弄清楚他們說(shuō)了什么，那么設(shè)計(jì)中的詞有什么意義？）

在查看新穎的選項(xiàng)時(shí)，請(qǐng)注意字母的外觀與您使用的詞語(yǔ)的相似程度。一些組合可能在字體上比其他組合更好地工作。注意所使用字符的字距和數(shù)量，特別是使用新穎的字體。（專(zhuān)業(yè)顯示排版通常字體越少越好。）

你怎么知道這很難讀？警惕極端傾斜的字體，緊湊和濃縮的字體，過(guò)于復(fù)雜的花紋，尾巴或連字，或似乎一起運(yùn)行或具有不同形狀的字母。

 

2.不良對(duì)齊

左，右，上下，不對(duì)齊？

我們不會(huì)在此討論這種類(lèi)型的優(yōu)點(diǎn)。最重要的是：一致性是真正重要的。類(lèi)型和元素應(yīng)該舒適地放在網(wǎng)格中。應(yīng)避免鋸齒邊緣。

對(duì)齊方式不良的問(wèn)題在于它破壞了視覺(jué)流，使用戶(hù)很難在設(shè)計(jì)中從一個(gè)元素移動(dòng)到另一個(gè)元素。他們可能迷失在亂七八糟的事情中，可能會(huì)錯(cuò)過(guò)最重要的內(nèi)容。

立即修復(fù)：為元素設(shè)置對(duì)齊方式。照片居中還是與左邊的文字保持一致？制定一套指導(dǎo)方針，調(diào)整設(shè)計(jì)并堅(jiān)持前進(jìn)的規(guī)則。

 

3.不恰當(dāng)?shù)膱D像

不適當(dāng)?shù)膱D像是內(nèi)容殺手。它可以創(chuàng)建與文本脫節(jié)的視覺(jué)連接或讓用戶(hù)撓頭。

雖然短暫的圖像經(jīng)常出現(xiàn)“當(dāng)你看到它時(shí)才知道”的時(shí)尚，但在你的項(xiàng)目中還是會(huì)有一些紅旗。

傻或過(guò)度使用的圖片：如果照片看起來(lái)不真實(shí)（商務(wù)人士無(wú)聊地微笑）或者如果您在其他類(lèi)似的網(wǎng)站上看到過(guò)，請(qǐng)避開(kāi)它??。

質(zhì)量差的圖像：如果照片焦點(diǎn)不對(duì)，黑暗或組合不好，請(qǐng)不要使用它。沒(méi)有照片比壞照片好。

低分辨率圖像：像素化圖像總是不好。由于高分辨率屏幕的優(yōu)勢(shì)和普及，許多作為設(shè)計(jì)工作流程一部分的照片規(guī)則需要修改。

絨毛圖像不會(huì)增強(qiáng)內(nèi)容：即使與內(nèi)容沒(méi)有關(guān)系，也不要因?yàn)榭梢园掌ㄗ　D像應(yīng)該增強(qiáng)內(nèi)容，而不是渾濁它。

立即修復(fù)：進(jìn)行照片審核。瀏覽您的設(shè)計(jì)并刪除上面包含紅色標(biāo)記的圖像。如果您沒(méi)有合適的東西，則不必更換圖像。

 

4.忽略移動(dòng)細(xì)節(jié)

眾所周知，網(wǎng)站應(yīng)該設(shè)計(jì)在響應(yīng)式框架上。很難找到會(huì)否認(rèn)的設(shè)計(jì)師或開(kāi)發(fā)者。但是響應(yīng)模板并非一站式解決方案。設(shè)計(jì)必須針對(duì)不同的屏幕尺寸進(jìn)行調(diào)整。

這些細(xì)節(jié)往往被忽視。該網(wǎng)站在移動(dòng)設(shè)備上運(yùn)行，但字體大小有點(diǎn)過(guò)小，或者圖像的大小是響應(yīng)式的，并且與移動(dòng)設(shè)備的不同寬高比成比例。這些小細(xì)節(jié)可能會(huì)嚴(yán)重影響用戶(hù)。

立即修復(fù)：花點(diǎn)時(shí)間與您的移動(dòng)設(shè)計(jì)。記下所有看起來(lái)不合時(shí)宜的事情，并引起沮喪。檢查文字大小，圖像，加載時(shí)間，按鈕位置并進(jìn)行必要的調(diào)整以提供更加無(wú)縫的體驗(yàn)。

 

5.瘋狂的顏色

一個(gè)無(wú)聊的設(shè)計(jì)師將創(chuàng)造一個(gè)脫節(jié)的設(shè)計(jì)。這常常表現(xiàn)出的一種方式是瘋狂的顏色和缺乏定義的調(diào)色板。

過(guò)多的顏色可能會(huì)分散注意力，并且往往具有業(yè)余感。對(duì)于每一個(gè)拉開(kāi)彩虹風(fēng)格調(diào)色板的項(xiàng)目，另有1,000個(gè)項(xiàng)目都會(huì)失敗。除非您的品牌指導(dǎo)方針要求使用這種配色方案，否則請(qǐng)避免。（如果你的品牌有這樣的指導(dǎo)方針，鼓勵(lì)刷新。）

立即修復(fù)：創(chuàng)建一個(gè)強(qiáng)大的調(diào)色板。從主色和一個(gè)或兩個(gè)輔助選項(xiàng)開(kāi)始。如果您需要更多方差，請(qǐng)使用該調(diào)色板中的色調(diào)和色調(diào)（并為這些調(diào)色板創(chuàng)建規(guī)則）。不要開(kāi)始添加更多顏色。

 

6.不給用戶(hù)操作提示

想象一下登陸一個(gè)美麗的網(wǎng)頁(yè)，但不知道下一步該做什么。你滾動(dòng)嗎？你點(diǎn)擊了嗎？是否有下一步找到更多內(nèi)容？

應(yīng)該有。

一個(gè)好的網(wǎng)站設(shè)計(jì)是一個(gè)網(wǎng)頁(yè)，包括一個(gè)頁(yè)面到另一頁(yè)的動(dòng)作，交互和動(dòng)作。我們的目標(biāo)是讓訪問(wèn)者盡可能多地連接到期望的操作路徑上。

立即修復(fù)：設(shè)計(jì)中的每個(gè)頁(yè)面都應(yīng)包含一個(gè)號(hào)召性用語(yǔ)。用戶(hù)應(yīng)該確切地知道每個(gè)頁(yè)面的目標(biāo)是什么，并且想要點(diǎn)擊按鈕，填寫(xiě)表單，玩游戲或購(gòu)買(mǎi)產(chǎn)品。設(shè)計(jì)結(jié)構(gòu)應(yīng)該包含大膽的用戶(hù)界面元素，以鼓勵(lì)從按鈕樣式到可操作指令的點(diǎn)擊或點(diǎn)擊。

 

7.太好的東西

不要過(guò)度使用超酷元素。

有一個(gè)很好的插圖？用它。使用它很大，甚至。但是不要用很多稀釋圖像的其他插圖弄亂它。

圖標(biāo)或其他技術(shù)也是如此，這是您吸引用戶(hù)的鉤子。你要離開(kāi)他們想要更多，而不是體積不堪重負(fù)。這聽(tīng)起來(lái)很容易，但實(shí)際上可能很難。（想想你買(mǎi)的那個(gè)圖標(biāo)包，并覺(jué)得需要使用每件商品來(lái)獲得你的錢(qián)的價(jià)值。）

立即修復(fù)：采用更少的策略。只使用你需要的元素來(lái)增強(qiáng)內(nèi)容。不要壓倒它。仔細(xì)閱讀當(dāng)前的設(shè)計(jì)，并想象從每個(gè)頁(yè)面上取走一個(gè)元素。它會(huì)是什么？它的設(shè)計(jì)更好嗎？

 

結(jié)論

每個(gè)設(shè)計(jì)師都會(huì)在這里和那里設(shè)計(jì)一個(gè)錯(cuò)誤。（我們中有些人做得比我們想的要多。）但是，你能找出問(wèn)題并恢復(fù)嗎？

現(xiàn)在你應(yīng)該在這個(gè)方向上有一個(gè)良好的開(kāi)始，并列出錯(cuò)誤和糾正錯(cuò)誤的方法。當(dāng)你犯了設(shè)計(jì)罪，調(diào)整和繼續(xù)前進(jìn)時(shí)，不要感到羞恥。

意派Coolsite360交互式線網(wǎng)頁(yè)編輯系統(tǒng)

“創(chuàng)意不該受技術(shù)束縛，交互可以變得簡(jiǎn)單有趣”