優(yōu)化UI界面會惹怒用戶？你應該這么做

以下內(nèi)容由Mockplus團隊翻譯整理，僅供學習交流，Mockplus是更快更簡單的原型設計工具。

有時，優(yōu)化網(wǎng)站或移動應用的界面會讓用戶感到瓦解。人們可能會對新的配色方案、元素的定位或其他類似的東西感到失望。顯然，用戶這樣的反應并不是你所期望的界面優(yōu)化。

即使是像Facebook、Instagram和Spotify這樣的大型成功公司，也經(jīng)常受到負面的反饋。例如，在 2017 年 2 月，Spotify更新了它的網(wǎng)頁播放器，引入了新的布局、新的搜索功能和帶藝術(shù)范的頁面。

這一改變導致許多用戶在社交媒體上表達了本身的不滿。一位推特用戶甚至寫道： “哦，太酷了，他們升級了Spotify網(wǎng)頁播放器，讓它變得更糟糕了! ”太棒了!”

那么，如安在你改變UI界面的時候，不會讓用戶不滿意呢?下面，我們一起來看看有哪些技能可以幫你在改變產(chǎn)品界面的同時，又能使你的用戶對此改變感到滿意。

人們是如何感知信息的

現(xiàn)如今，界面有了多樣性，用戶每次遇到新的(或更新的)界面都必需學習。因此，要用戶花時間尋找功能時就會讓他們感覺不愉快。

阿爾托大學(Aalto University)比來進行了一項研究，他們對視覺搜索進行了建模，試圖找出人們是如何獲取新的或改變的界面。

結(jié)果，研究人員認為，用戶快速學習的關鍵在于三個因素：長期記憶，短期視覺記憶和眼球運動。知道人們?nèi)绾胃兄曈X信息使UI / UX設計人員能夠創(chuàng)建出不妨事礙用戶找到本身想要功能的高效界面(和微調(diào)的UI界面)。

包孕尼爾森諾曼集團(Nielsen Norman Group)在內(nèi)的多家研究公司對人們是如何瀏覽一頁的信息以及他們的眼睛如何移動的問題進行了研究。據(jù)該小組的研究表白，用戶通常在閱讀或不雅觀察內(nèi)容時遵循以下三種模式。

古騰堡圖表

古騰堡圖表反映了西方的閱讀文化： 從上到下，從左到右。按照古騰堡圖表，頁面上的信息應該被分成四個象限，讓用戶更容易感知豐富的文本內(nèi)容：

古騰堡圖介紹了內(nèi)容擺列原理，闡明了如何讓用戶更容易找到相關內(nèi)容。

如你所見，用戶選擇先瀏覽左上角的象限;這個象限被稱為主視覺區(qū)。你應該把你的關鍵內(nèi)容，好比標題和標識表記標幟，放在這個位置。

接下來，用戶的眼睛移動到強烈的休閑區(qū)域?？煽紤]在本區(qū)域中提供某種后續(xù)內(nèi)容，例如你之前表達的想法的圖片說明。

然后，用戶就會進入弱的休閑區(qū)，這個區(qū)域不太可能會引起人們的注意。它是用戶在閱讀路途上的“休息”區(qū)域。最后，在右下角的一個終端區(qū)域?qū)⒁龑в脩舻贸龊虾踹壿嫷慕Y(jié)論。建議將CTA(行為召喚)在此區(qū)域中以文本、視頻或鏈接的形式出現(xiàn)。

在界面上使用古登堡圖表可讓用戶駕馭閱讀節(jié)奏和增強對閱讀的理解。這種模式還能讓你洞察到在那些最有可能被閱讀或注意的地方放置重要元素。

F模式

F模式體現(xiàn)元素在頁面上的類似F的定位。據(jù)尼爾森·諾曼(Nielsen Norman)的研究顯示，人們通過橫向移動眼睛開始接觸內(nèi)容。接下來，他們掃描一條垂直線，試圖找到他們感興趣的點，如果他們找到他們想看的內(nèi)容，他們會繼續(xù)橫向瀏覽內(nèi)容。

Nielsen Norman對 200 名參與者進行了研究，結(jié)果顯示其中一種流行的瀏覽內(nèi)容模式是F型的。

為了提高用戶體驗，可以使用諸如要點、排版、彩色按鈕、高亮文本等元素。這些元素賦予界面視覺權(quán)重，，并指出頁面中重要的點。

使用F模式可以確保頁面上有一個高效的視覺層次結(jié)構(gòu)，這樣用戶就可以快速瀏覽內(nèi)容并快速找到相應問題的解決方案。

例如，Medium之前的布局利用了F模式，將主要內(nèi)容(博客文章)放在左邊，同時把側(cè)邊欄放在右邊。側(cè)邊欄中包羅了非主要內(nèi)容，但仍然是相關內(nèi)容，包孕每日摘要、標簽和“關于我們”和“使用條款”的鏈接。

Medium之前的排版就是F模式的鮮明案例

現(xiàn)如今，Medium已經(jīng)沒在使用帶有圖片預覽和大標題的經(jīng)典線程模式。相反，新的博客文章以列表形式顯示，因此他們將用戶的注意力吸引到文章的作者，而不但僅是圖片預覽。

Z模式

Z模式被非官方認為是登陸頁面的王者，因為它涵蓋了視覺層次結(jié)構(gòu)，內(nèi)容結(jié)構(gòu)和CTA等重要方面。與更適合文本或展現(xiàn)繁重內(nèi)容頁面的F模式差別，Z模式有效地將用戶的注意力集中在帶最小副本的登錄頁面上。

你可能已經(jīng)猜到，這個模式代表了用戶眼睛的類似于z圖案的移動。

簡約的界面可以從Z模式中獲益，它以一致的布局和視覺上令人滿意的內(nèi)容結(jié)構(gòu)為用戶帶來愉悅。

在使用z模式設計時，應遵循以下結(jié)構(gòu)：

1.頂部的水平線應該包孕醒目的內(nèi)容和元素，好比logo和導航欄(這樣用戶很快就能拜候網(wǎng)站的相應頁面)。

2.遵循經(jīng)典的講故事方式，對角線應該向用戶介紹主要內(nèi)容，包孕主要內(nèi)容，吸引注意力的圖片，幻燈片等。

3.最后，一條較低的水平線應該有一個CTA(行為召喚)，它可以刺激用戶執(zhí)行某些動作，好比注冊、訂閱或購買。

底部線條：

標簽：鹽城 林芝 東營 九江 烏魯木齊