交互設(shè)計(jì)從來都不是簡單的事情?？煽康慕换ネǔＰ枰柚鷮?duì)用戶行為的深入分析，然后有針對(duì)性的精心策劃?？墒请S著新的技術(shù)和新的交互模式的不斷涌現(xiàn)，事情就變得不是那么容易了。其實(shí)大家遭遇的困境都很相似，用戶已經(jīng)很難被單純炫酷的圖片、流暢的懸停效果和出人意料的動(dòng)效所打動(dòng)，真正能讓他們露出微笑的是持久、令人愉悅的交互設(shè)計(jì)和用戶體驗(yàn)。如果你對(duì)于日常的設(shè)計(jì)中的常見的誤區(qū)有所了解，自然會(huì)有意識(shí)地繞過這些坑。
為了更好的設(shè)計(jì)，我們?yōu)槟愫唵慰偨Y(jié)了一下最常見的5種交互設(shè)計(jì)的誤區(qū)。
1、過度的創(chuàng)意
網(wǎng)頁設(shè)計(jì)師 絕對(duì)不缺少創(chuàng)意。我們希望借工作表達(dá)自己，也一直在試圖尋找能讓產(chǎn)品脫穎而出的優(yōu)秀創(chuàng)意。但是當(dāng)涉及到交互設(shè)計(jì)的時(shí)候，推陳出新并不一定總是好的，它甚至 會(huì)對(duì)你的網(wǎng)站和產(chǎn)品產(chǎn)生不利的影響。的確，許多用戶渴求新鮮的創(chuàng)意，但是在操作和交互上卻往往希望協(xié)調(diào)可控，所以他們更傾向于熟悉的交互。Etsy的創(chuàng)業(yè) 總監(jiān)Randy曾經(jīng)撰文探討過這個(gè)問題，文中直言“設(shè)計(jì)師們不要在此(交互設(shè)計(jì))自作聰明了!”在這篇文中，他詳細(xì)解釋了為什么你不應(yīng)該走極端去設(shè)計(jì)充滿大量創(chuàng)新交互的網(wǎng)頁。
以Lotorama的網(wǎng)站為例子，漂亮的頁面和柔和的音樂都非常的贊，但是用戶進(jìn)來之后會(huì)遲疑，想知道這個(gè)網(wǎng)站要如何操作。不要曲解我的意思，如果你是純粹處于炫技，那么這種華麗而充滿游戲性的網(wǎng)站絕對(duì)稱得上是創(chuàng)意無限，但是對(duì)于普通用戶而言，他們的直覺失去效果，茫然無措會(huì)成為網(wǎng)站瀏覽的障礙。
下面是另外一個(gè)案例，這個(gè)名為Safety on the Slopes 的項(xiàng)目是為了說明冬季運(yùn)動(dòng)的危險(xiǎn)的，整個(gè)網(wǎng)站的設(shè)計(jì)整潔，交互也直觀。網(wǎng)站設(shè)計(jì)也有所創(chuàng)新，但是同時(shí)是以用戶交互直覺為先決條件，以身臨其境為目標(biāo)。
2、令人迷惑的交互
“不要自作聰明”的規(guī)則也應(yīng)當(dāng)應(yīng)用在導(dǎo)航設(shè)計(jì)上。一些設(shè)計(jì)師試圖運(yùn)用別具一格不同尋常的名稱，以活動(dòng)更富有實(shí)驗(yàn)性的導(dǎo)航。比如這個(gè)Chijoff網(wǎng)站， 就讓前來應(yīng)聘的用戶充滿困惑。如果你是網(wǎng)站的訪客，需要來回折騰一陣子，才能搞清楚這個(gè)名為“Co-Create”的頁面實(shí)際上也就是常見的 “Services”頁面。最糾結(jié)的是，即便是你將整個(gè)頁面都看完之后，仍然高不清楚要怎么辦，因?yàn)檫@個(gè)頁面的底部僅僅只有一個(gè)表單，展示行業(yè)新聞，并且 僅僅提供一個(gè)注冊(cè)入口!至于聯(lián)系頁面就更簡單了，僅僅提供了一個(gè)郵政編碼和一個(gè)郵件地址?？偠灾麄冇酶鞣N手段讓用戶無法直接快速有效的聯(lián)系上他們。
在看看這個(gè)案例。你猜猜看，Maison Margiela 的頁面上的“Universe”這個(gè)分類是干啥的?這個(gè)炫酷的鏈接，實(shí)際上是鏈接到他們的Facebook頁面的……
反例當(dāng)然也有，看看legworkstrdio的網(wǎng)站吧，他們的創(chuàng)意非常不錯(cuò)，導(dǎo)航清晰明確，用戶也不會(huì)在導(dǎo)航中迷失。
3、雜亂無章
曾經(jīng)有過一個(gè)階段，設(shè)計(jì)師試圖將所有的內(nèi)容全都塞到一個(gè)頁面當(dāng)中去。雖然這個(gè)時(shí)代已經(jīng)過去了，但是很多網(wǎng)站依然在犯這個(gè)錯(cuò)誤，甚至在我們自己設(shè)計(jì)的時(shí)候，有時(shí)候也會(huì)身不由己地想這么做。看看這個(gè)在線商店的設(shè)計(jì)吧：
設(shè)計(jì)師試圖使用簡單的配色方案，但問題是頁面中大大小小的框、復(fù)雜多變的字體破壞了整體的風(fēng)格，用戶也在大量繁復(fù)的信息中懵逼。搜索框中“那么你今天想得到什么呢?”文案還是挺時(shí)尚的，但是頁面風(fēng)格卻完全是過時(shí)的設(shè)計(jì)。
反觀EBay的設(shè)計(jì)，在設(shè)計(jì)上則更為克制，保持清爽而簡單的設(shè)計(jì)，凸顯用戶關(guān)注的內(nèi)容，并且明確地提示用戶下一步該怎么做。
4、要有對(duì)比度
對(duì)比度是構(gòu)建視覺層次最重要的手段之一，也是讓視覺元素吸引用戶的好方式。在網(wǎng)頁設(shè)計(jì)中，對(duì)比度不僅僅是通過色彩來呈現(xiàn)的，尺寸控制、形狀設(shè)計(jì)、位置調(diào)整也都能表現(xiàn)出對(duì)比度。
最簡單也是最生動(dòng)的案例，就是下面的這個(gè)網(wǎng)站。設(shè)計(jì)師在網(wǎng)站的一致性上做的頗為不錯(cuò)，但是相對(duì)復(fù)雜的背景和文字內(nèi)容、按鈕等前景元素之間的對(duì)比不明顯。
相比之下，這個(gè)網(wǎng)站也采用了深淺色(黑白)的對(duì)比來進(jìn)行設(shè)計(jì)，但是結(jié)果卻截然不同。另外，充滿創(chuàng)意的滾動(dòng)效果也引入了頗為不錯(cuò)的視覺效果，很酷吧?
5、忽視表單樣式
表單設(shè)計(jì)其實(shí)是用戶體驗(yàn)設(shè)計(jì)的基本組成部分之一。每個(gè)網(wǎng)站都有不同的設(shè)計(jì)目標(biāo)，不論是銷售產(chǎn)品、呈現(xiàn)信息還是提供溝通平臺(tái)，然而許多設(shè)計(jì)漂亮的網(wǎng)站總會(huì)給你一個(gè)令人感到無聊到死的復(fù)雜表單，除了那些極其想加入會(huì)員或者想?yún)⑴c問卷調(diào)查的那些訪客，許多用戶(比如我)會(huì)直接關(guān)閉頁面，離開網(wǎng)站。
有了JCF這樣的跨瀏覽器解決方案之后，你就可以同丑陋的默認(rèn)表單樣式說再見了，你可以設(shè)計(jì)更優(yōu)秀更人性化的表單那設(shè)計(jì)，來提升交互效率和用戶體驗(yàn)。
另外一個(gè)惱人的情況是，表單要求太多，想法不成熟，或者并未經(jīng)過良好的測(cè)試。比如sketchybusiness.io 這個(gè)網(wǎng)站中，表單突出了所有的空白字段，即使有些是不需要填寫的。
反觀mostlyserious.io的表單設(shè)計(jì)，你會(huì)喜歡表單中的鼠標(biāo)懸停提示。另外，其中“Don’t be shy”的提醒為整個(gè)表單增添了人性化的元素。

名稱欄目：成都網(wǎng)頁設(shè)計(jì)中常見的五種交互設(shè)計(jì)錯(cuò)誤
文章URL：http://www.rwnh.cn/news40/243390.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、ChatGPT、品牌網(wǎng)站設(shè)計(jì)、品牌網(wǎng)站建設(shè)、服務(wù)器托管、網(wǎng)站收錄

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)