視覺吸引力的影響交互設(shè)計(jì)不可否認(rèn)，視覺效果是交互設(shè)計(jì)的重要，但究竟如何，重要的也許會(huì)讓你吃驚。

作為網(wǎng)站視覺媒介，主要在視覺交流的網(wǎng)站和應(yīng)用程序，甚至是書面語(yǔ)言必須仔細(xì)選擇字體，大小，對(duì)齊方式等，也許更重要的是，為基于視覺的生物，人類習(xí)慣于在出現(xiàn)一瞬間的決定。這些瞬時(shí)響應(yīng)的深入與情緒有關(guān)，所以你的界面的外觀直接影響你的用戶感受的網(wǎng)站。

在一個(gè)大開眼界的TED演講，對(duì)我們的大腦有數(shù)據(jù)的記者和信息圖表專家戴維McCandless指出純粹的深度的視覺效果，其中大部分是潛意識(shí)的。他將自己的觀點(diǎn)與類比計(jì)算機(jī)處理，采用下圖：

“你的視線是最快的。它具有相同的帶寬作為計(jì)算機(jī)網(wǎng)絡(luò)。然后你的觸摸，這是關(guān)于一個(gè)USB密鑰的速度。然后你的聽覺和嗅覺，它有一個(gè)硬盤的吞吐量。然后你可憐的老味道，這幾乎就像一個(gè)袖珍計(jì)算器的吞吐量。一只在角落里，那個(gè)小廣場(chǎng)。百分之7，這實(shí)際上是我們意識(shí)到的金額。所以很多你的視野--它的大部分是視覺，它倒在它是無(wú)意識(shí)的。”

認(rèn)為這將影響交互設(shè)計(jì)。你的用戶通知當(dāng)然吸引眼球的元素，但每一個(gè)選擇的顏色，字體，圖標(biāo)符號(hào)，布局位置–每個(gè)像素在屏幕上–是一種潛意識(shí)的心理互動(dòng)。

我們描述我們的免費(fèi)電子書人眼的網(wǎng)站設(shè)計(jì)外觀，甚至影響用戶的感知如何以及產(chǎn)品的功能。

當(dāng)它來(lái)進(jìn)入我們的網(wǎng)站上的信用卡信息，信任總是成為一個(gè)因素。用戶如何訪問網(wǎng)站的信譽(yù)一個(gè)迷人的斯坦福研究顯示，幾乎一半的用戶確定如果一個(gè)網(wǎng)站是值得信賴的基礎(chǔ)上看起來(lái)就。的布局，字體，字體大小等視覺特征，甚至配色方案都是關(guān)鍵因素。

美學(xué)的作用遠(yuǎn)遠(yuǎn)超出了“好看”。形式影響用戶感知的功能，這是比功能本身更重要。

在交互設(shè)計(jì)中，我們可以把視覺吸引力的影響分為5類：

第一印象，建立信任，創(chuàng)造的身份，鼓勵(lì)用戶的寬恕，并通過(guò)松弛改善可用性。

1。第一印象是持久的印象

在開始的時(shí)候，我們提到了一定的可用性研究確定的外觀（A）的主要因素是大多數(shù)用戶決定時(shí)考慮信任，和（B）用戶感知更美觀的產(chǎn)品為更多的功能。這些都是一個(gè)產(chǎn)品的外觀形成第一印象的結(jié)果。

因?yàn)槲覀兊谋灸芤呀?jīng)進(jìn)化，我們基于我們所看到的快速?zèng)Q策，第一印象可以使或打破一個(gè)網(wǎng)站或應(yīng)用程序。

研究表明，用戶會(huì)判斷網(wǎng)站最關(guān)鍵的在第一個(gè)10秒的價(jià)值。這樣，獨(dú)自一人，證明了第一印象的重要性。為了保持你的用戶的注意力，證明你的價(jià)值，你必須在視覺上建立情感聯(lián)系，呼吁他們的直覺反應(yīng)。

讓我們?cè)谌绾翁岣咭曈X設(shè)計(jì)的波蘭設(shè)計(jì)機(jī)構(gòu)的交互設(shè)計(jì)一看huncwot。

四導(dǎo)航選擇顯示足夠簡(jiǎn)單，但是當(dāng)每個(gè)人都是在變化，文本顏色和充滿活力的圖形出現(xiàn)在。首先，這個(gè)信號(hào)告訴用戶他們輸入注冊(cè)，但在更深的層次，豐富的動(dòng)畫添加一個(gè)意想不到的元的喜悅。效果感覺更像一個(gè)魔術(shù)，更像是一塊技術(shù)告訴我們，了解我們的選擇（盡管這仍然是相通的）。

說(shuō)到第一印象，你總是想罷工的可用性和養(yǎng)眼花瓶之間的平衡。可用性給用戶的信心，而審美快感實(shí)際上使他們想要使用你的界面。

2。干凈的設(shè)計(jì)創(chuàng)造信任

在第一印象的相關(guān)說(shuō)明，視覺吸引力的界面感覺更值得信賴。這一原則是最適用于電子商務(wù)，其中誠(chéng)信可以使或打破銷售。

讓我們比較兩種結(jié)算方式下的外觀。

付款形式

在第一種形式中，你可以看到，布局雜亂不堪，以今天的標(biāo)準(zhǔn)看起來(lái)過(guò)時(shí)的設(shè)計(jì)。同時(shí)，我們注意到安全支付的唯一標(biāo)志是“請(qǐng)?jiān)陲@微鏡說(shuō)明”文本。

檢驗(yàn)表格B

另一方面，這種形式已經(jīng)散發(fā)出的感覺和干凈的布局和呼吸室之間的輸入行誠(chéng)信。而不是一個(gè)消息解釋網(wǎng)站如何保護(hù)數(shù)據(jù)，簡(jiǎn)單的鎖圖標(biāo)和“安全購(gòu)物”的文本可以點(diǎn)對(duì)面的人只想完成自己的購(gòu)買。

形式設(shè)計(jì)共享相同的功能，但后者似乎更好的工作，因?yàn)樗懈嗟乃枷?。它的原理是遇到一個(gè)人穿西裝面試，有人穿著運(yùn)動(dòng)褲和T恤–你真的不能量化的感覺一樣，但是你知道其中一個(gè)似乎更有資格。

3。個(gè)性設(shè)計(jì)創(chuàng)建身份

知道你的用戶–他們的背景，他們的職業(yè)，他們的野心和恐懼。

一旦你創(chuàng)建你的人物角色，確保你的視覺個(gè)性反映用戶的個(gè)性。畢竟，你的界面的視覺表現(xiàn)吸引，會(huì)覺得有吸引力，那些有著相同的人格類型。

以網(wǎng)站為時(shí)尚品牌來(lái)源迪奧。最突出的視覺是大面積推廣的時(shí)裝攝影，所有的奢侈品，名人協(xié)會(huì)（瑪麗恩歌迪亞），和性感，你會(huì)期望從一個(gè)時(shí)尚品牌。清新的白色背景和設(shè)計(jì)創(chuàng)造出一個(gè)有抱負(fù)的光心優(yōu)雅的感覺，這就是為什么人們購(gòu)買產(chǎn)品的部分原因，迪奧。

網(wǎng)頁(yè)上的相互作用實(shí)際上是相當(dāng)簡(jiǎn)單的：導(dǎo)航項(xiàng)目成為強(qiáng)調(diào)在盤旋，季節(jié)性的集合覆蓋在懸停文本圖像，和一些產(chǎn)品形象變化梯度在懸停承認(rèn)選擇。

不像huncwot的網(wǎng)站，需要反映切削刃的動(dòng)畫（因?yàn)樗且粋€(gè)設(shè)計(jì)機(jī)構(gòu)，畢竟），我們不需要這樣的復(fù)雜的相互作用的–迪奧時(shí)尚觀眾干凈的框架產(chǎn)品，提出了一個(gè)很好的執(zhí)行傳統(tǒng)的導(dǎo)航，然后滾出去的方式。

執(zhí)行你的設(shè)計(jì)基礎(chǔ)完美，散發(fā)出人格權(quán)與你的美，你的UI設(shè)計(jì)經(jīng)常會(huì)比它更令人印象深刻的技術(shù)。

4。用戶原諒漂亮的東西

因?yàn)槿说那榫w與他們覺得有吸引力的項(xiàng)目，他們會(huì)更容易原諒當(dāng)互動(dòng)與設(shè)計(jì)錯(cuò)誤。我們描述這種現(xiàn)象在相當(dāng)多的細(xì)節(jié)交互設(shè)計(jì)的最佳實(shí)踐，但讓我們迅速潛入的啟示。

你不應(yīng)該依靠這個(gè)作為一個(gè)可用性差的拐杖，但認(rèn)為它是在什么情況下會(huì)破壞經(jīng)驗(yàn)–知道備用效益墨菲的法律技術(shù)，它更是一個(gè)問題的時(shí)候，而不是如果。

聰明的404錯(cuò)誤頁(yè)面的設(shè)計(jì)充分體現(xiàn)了這一原則。當(dāng)你到一個(gè)錯(cuò)誤頁(yè)面，設(shè)計(jì)有效的失敗。你可能會(huì)經(jīng)歷從困惑到沮喪情緒的任何范圍，甚至輕微的憤怒，如果它破壞時(shí)間密集型流程。

然后，設(shè)計(jì)的挑戰(zhàn)，是將不幸的互動(dòng)轉(zhuǎn)變?yōu)橐粋€(gè)積極的（不只是中性）。讓我們看看下面的光譜相反兩端一看。

梅西

這本404頁(yè)的并不減輕沮喪或點(diǎn)右方向用戶（除了點(diǎn)擊“繼續(xù)購(gòu)物”頁(yè)面回到主頁(yè)，這實(shí)際上可能會(huì)破壞用戶的路徑）。它也極不可能會(huì)有人打電話給客服在網(wǎng)站發(fā)布–他們可能只會(huì)從一個(gè)競(jìng)爭(zhēng)對(duì)手找到產(chǎn)品。

薄荷

另一方面，智能網(wǎng)站喜歡與他們的404頁(yè)，有樂趣，正如你可以看到上面的。如果做的好，甚至錯(cuò)誤的信息可以取悅用戶。

這404頁(yè)的交互設(shè)計(jì)很完美。幽默使當(dāng)下的挫折，而有趣的員工信息立即創(chuàng)建一個(gè)關(guān)聯(lián)的人。這一切都不在可用性，成本當(dāng)然，因?yàn)榻ㄗh的鏈接仍然提供給用戶訪問的內(nèi)容。

這個(gè)例子也許是有吸引力的交互設(shè)計(jì)的力量。當(dāng)我們玩到喜歡的幽默或有趣的情緒，我們的交互設(shè)計(jì)甚至可以變換成積極的負(fù)面經(jīng)驗(yàn)。

如果你在其他聰明的404頁(yè)感興趣，我們建議這一塊creativebloq突出33網(wǎng)絡(luò)上最好的例子。

5。松弛提高可用性

在諾爾曼繼續(xù)在他的文章中解釋我們發(fā)現(xiàn)，視覺上的吸引力，使我們的生物產(chǎn)品。這種放松如何影響我們的大腦和身體功能本身，這可能可以解釋為什么，在日本的ATM研究，用戶有更少的困難與吸引力的自動(dòng)取款機(jī)。該理論認(rèn)為，因?yàn)橛脩舾?ldquo;取”的有吸引力的自動(dòng)取款機(jī)，他們更放松，從而能夠使用的界面應(yīng)力較小。

如果這個(gè)理論成立，那么建立情感聯(lián)系，通過(guò)視覺效果，不僅增加了感知的可用性，但實(shí)際的可用性。設(shè)計(jì)師，那么，要等的時(shí)間和精力優(yōu)化界面的外觀一樣，它的功能–兩者密不可分。

結(jié)論：這就是外部計(jì)數(shù)

我們都長(zhǎng)大了，想通過(guò)判斷基礎(chǔ)上看起來(lái)是膚淺的。

智慧像片段，“內(nèi)在的東西才是最重要的，”和“不要以封面來(lái)判斷一本書，“雖然用心良苦，可能會(huì)使我們誤入歧途?，F(xiàn)代科學(xué)是畫一個(gè)完全不同的圖片–視覺效果才是重要的。他們提出我們的意見和我們的情感，不管我們喜歡還是不喜歡。