?
UX與UI網(wǎng)頁(yè)設計:有什么區別?用戶(hù)界面 (UI) 設計和用┐(′д`)┌戶(hù)體驗 (UX) 設計是同一個(gè)網(wǎng)頁(yè)設計“硬幣”的兩個(gè)方面。兩者都對在消費者眼中定義公司的設計品牌、產(chǎn)品或服務(wù)具有(you)影響力,區別(′ω`*)并且對轉化率同樣具有影響力。網(wǎng)頁(yè)
我們已經(jīng)準備好解決問(wèn)題(或至少重新點(diǎn)燃辯論)。UX與UI設計:有什么區別,設計哪個(gè)更重要?區別
UX和UI網(wǎng)頁(yè)設計的區別
網(wǎng)頁(yè)設計涵蓋了廣泛的特(?⊿?)性和功??能,它們都聚集在一起(希望)為用戶(hù)創(chuàng )造一(′?`)種引人入勝的網(wǎng)頁(yè)體驗。作為其各部分的設計總和,一個(gè)好的區(qu)別網(wǎng)站導航流暢,看起來(lái)很吸引人,并仔細引導訪(fǎng)問(wèn)者實(shí)現預期目標:例如點(diǎn)擊 CTA,或閱讀常見(jiàn)問(wèn)題解答( ?▽?)以找到答案。
UX網(wǎng)頁(yè)設計: 一種設計方法,優(yōu)先考慮為用戶(hù)在瀏覽交互、網(wǎng)頁(yè)、應用程序和網(wǎng)站時(shí)創(chuàng )造無(wú)縫體驗。
UI網(wǎng)頁(yè)設計:指用戶(hù)看到的數字空間的實(shí)際設計界面;按鈕、微交互和滾動(dòng)元素都是U(°o°)I網(wǎng)頁(yè)設計的例子。
UX網(wǎng)頁(yè)設計和UI網(wǎng)頁(yè)設計之間的主要區別: UX著(zhù)眼于整個(gè)用戶(hù)體驗以及它如何影響網(wǎng)站的整體設計,而UI網(wǎng)頁(yè)設計側重于界面的特定網(wǎng)頁(yè)設計元??素以及它們如何引導用戶(hù)頁(yè)。
用戶(hù)體驗網(wǎng)頁(yè)設計(以及一般的UX設計)包括支持您提供的體驗的所有幕后研究和可用性測試。
尼爾森諾曼集團的認知科學(xué)家兼聯(lián)合創(chuàng )始人唐諾曼早在 1990 年就創(chuàng )造了“用戶(hù)體驗”一詞。
有助于創(chuàng )造令人滿(mǎn)意的用戶(hù)體驗的常見(jiàn)原則包括:
清晰和簡(jiǎn)單
可掃描性(網(wǎng)站被掃描,而不是閱讀??)
了解你的ヽ(′?`)ノ聽(tīng)眾
視覺(jué)層次
用戶(hù)在評估您網(wǎng)站的UX設計時(shí)會(huì )下意識地提出的問(wèn)題:
有用嗎?
可以用嗎?
它是可取的嗎?
可以訪(fǎng)問(wèn)(wen)嗎?
可信嗎?
UX設計師如何培養令人滿(mǎn)意的用戶(hù)體驗?大多數人都認為設計需要以人/用戶(hù)為中心。簡(jiǎn)而言之,UX使技術(shù)人性化。
UX設計師做什么?
一位優(yōu)秀的用戶(hù)體驗設計師早在您開(kāi)始向網(wǎng)站添加功能和內容之前就開(kāi)始工作。
用戶(hù)體驗設計師將:
進(jìn)行用戶(hù)和用戶(hù)組研究
創(chuàng )建用戶(hù)角色??
確定信息框架
設計流程和線(xiàn)框
創(chuàng )建ヾ(′▽?zhuān)??原型和模型
進(jìn)行用戶(hù)測試
和更多
用戶(hù)體驗設計考慮(//ω//)將某人從想法轉化為轉化的情感、線(xiàn)索和模式。用戶(hù)體驗設計師將引導消費者從“我需要一雙新鞋”到尋找當地鞋履供應商、找到您的網(wǎng)站、導航到一雙新鞋并進(jìn)行購買(mǎi)???。??
UI網(wǎng)頁(yè)設計解釋
用戶(hù)界面設計側重于觸覺(jué)元素——菜單、圖標、圖像等—(′?`)—有助于創(chuàng )造令人滿(mǎn)意的用(yong)戶(hù)體驗。UI 設計主要關(guān)注網(wǎng)站、網(wǎng)頁(yè)或產(chǎn)品的交互性。
打個(gè)比方:用戶(hù)界面是馬???鞍、馬鐙和韁繩,用(′?_?`)戶(hù)體驗是你騎馬的感覺(jué)。
換句話(huà)說(shuō):UI 網(wǎng)頁(yè)設計是圍繞著(zhù)用戶(hù)體驗存在的框架。用戶(hù)必須通過(guò)瀏覽您的網(wǎng)站、單擊按鈕和閱讀內容進(jìn)(jin)入該框架并與之交互,以獲得用戶(hù)體驗。
UI網(wǎng)頁(yè)設計師做什么?
優(yōu)秀的UI網(wǎng)頁(yè)設計師會(huì )結合美學(xué)、風(fēng)格元素,試圖根據從內容層次結構到顏色選擇和元素大小的所有內容以某種方式影響用戶(hù)。UI 設計師更專(zhuān)注于創(chuàng )建無(wú)縫的設計界面,而(er)不是培養體驗。如果它有效,并且運行良好,那就是好的UI設計。
常見(jiàn)的UI設計元素可以分為三個(gè)不同的ヾ(′?`)?類(lèi)別:
輸入元素
輸出元素
輔助元素
輸入元素負責管理各種用戶(hù)輸入。它們可以是驗(yan)證過(guò)程的一部分,可以幫助用戶(hù)過(guò)濾產(chǎn)品??頁(yè)面,并且可以用于導??航目(′?_?`)的。
典型的UI設計輸入元素包括:
紐扣
切換
文本或密碼字段
復選框
確認對話(huà)
和更多
輸出元素響應并顯示來(lái)自各種用(′?ω?`)戶(hù)輸入的結果。常見(jiàn)的輸出元素包括彈出窗口、警報、警告和錯誤消息等(deng)內容。輸出元素不獨立運行。它們需要某種類(lèi)型的用戶(hù)輸入。
輔助元素旨在幫助和通知用戶(hù)瀏覽您的網(wǎng)站。通常,不是輸入或輸出元素的UI設計元素適合輔助元素類(lèi)別。
一些最廣泛使用的輔助元素包括:
面包屑
通知
滑塊
圖標
進(jìn)度條
提示
導航
組和容器
良好的UI設計是將用戶(hù)體驗結合在一起的粘合劑。今天ヽ(′▽?zhuān)?ノ,UI(′▽?zhuān)? 設計師負責讓網(wǎng)站工作并看起來(lái)很好,UI 設計比以往(╬?益?)任何時(shí)候都更加重要。
設計曾(?_?;)經(jīng)是你為了品味而灑上的調味料,現在這是您在食譜開(kāi)始時(shí)需要的面粉。
UX和UI設計如何影響轉化
UX設計或UI設計哪個(gè)更好,沒(méi)有明確的贏(yíng)家。如前所述,它們是同一個(gè)網(wǎng)頁(yè)設計硬幣的兩個(gè)方面,一個(gè)沒(méi)有另一個(gè)就行不通。
如果沒(méi)有良好的UI設計,用戶(hù)體驗是平淡無(wú)奇的。同樣,如果不是為了創(chuàng )造某種用戶(hù)體驗,UI 設計也沒(méi)有任何意義。糟糕的UI設計會(huì )造??成糟糕的用戶(hù)體驗。良好的UI設計可以創(chuàng )造良( ?ヮ?)好的用戶(hù)體驗。就這么簡(jiǎn)單。
也就是說(shuō),哪個(gè)對轉化更重要?當然,這取決于您嘗試?實(shí)現的轉(zhuan)化類(lèi)型以及這些轉化是否與UX或UI設計選擇直接相關(guān)。
例如,您網(wǎng)站的用戶(hù)界面在有人訪(fǎng)問(wèn)之前不會(huì )真正發(fā)揮作用。如果沒(méi)有人訪(fǎng)問(wèn)您的網(wǎng)站,您所有的辛勤工作設計元素和 A/B 測試顏色選擇都沒(méi)有多大意(yi)義。
快樂(lè )的用戶(hù)等于更好的轉化率
通過(guò)出色的UX和UI設??計可以最好地吸引訪(fǎng)客和保護客戶(hù)。用戶(hù)體驗越無(wú)縫,用戶(hù)界面越吸引人和有效,您的轉化率就越高。
看起來(lái)很棒但很難使用的東西是優(yōu)秀UI和糟糕 UX的典范。雖然看起來(lái)很糟糕的非常有用的東西是優(yōu)秀用戶(hù)體驗和糟糕用戶(hù)(′ω`*)界面的典范。
轉化率取決于多種因素,但(dan)UX設計和UI設計必須協(xié)同工作才能提高轉化率。許多常見(jiàn)的 UX/UI 設計準則已被證明可以提高轉化率:
收集和分析數據
優(yōu)化內容以縮短加載時(shí)間
移動(dòng)設計
了解客戶(hù)旅程
簡(jiǎn)化和精(jing)簡(jiǎn)
可用性測試
UX和(he)UI設計同樣重要
兩者缺一不可,這就是為什么UX(′?_?`)設計和UI設計在我們??眼中同等重要。兩者都努力改善整體用戶(hù)體驗,并且兩者都做得好可以提高您的轉化率。您的目標應該是創(chuàng )建一個(gè)功能無(wú)縫且有效的用戶(hù)至上的網(wǎng)站。轉化將隨之而來(lái)。