成都網(wǎng)站建設(shè)微交互設(shè)計(jì)的重要性

2023-03-18    分類: 網(wǎng)站建設(shè)

許多產(chǎn)品設(shè)計(jì)師都知道,出色的用戶體驗(yàn)不僅僅在于可用性,更重要的是,用戶體驗(yàn)還與產(chǎn)品的外觀和感覺息息相關(guān)。在設(shè)計(jì)出色的外觀和感覺時(shí),沒有什么比微交互作用更重要的了盡管很小,但微交互功能卻可以使使用產(chǎn)品的體驗(yàn)更加有效和人性化。在本文中,我們將研究什么是微交互以及何時(shí)在設(shè)計(jì)中使用它們。我們還將舉例說(shuō)明成都網(wǎng)站建設(shè)中微交互在應(yīng)用程序和產(chǎn)品中的微交互示例。

微交互定義

微交互包含圍繞單個(gè)用例的產(chǎn)品時(shí)刻。這些微小的瞬間是我們與計(jì)算機(jī)日?;?dòng)的重要組成部分。每次我們登錄,設(shè)置警報(bào)或按“贊”按鈕時(shí),我們都會(huì)參與微交互。精心設(shè)計(jì)的微交互功能使用戶的旅程順暢,并使每一步操作變得更加輕松。微互動(dòng)可以成為傳達(dá)品牌的好工具。一些微交互是如此之好,以至于成為了品牌的標(biāo)志性時(shí)刻-品牌屬性提高了采用率和客戶忠誠(chéng)度。Facebook的“贊”反應(yīng)是標(biāo)志性時(shí)刻的一個(gè)很好的例子。很難想象Facebook沒有這個(gè)小功能。這些反應(yīng)使Facebook脫穎而出-每當(dāng)我們看到大拇指圖標(biāo)時(shí),我們就會(huì)想到Facebook。

Facebook表情符號(hào)。

微交互互動(dòng)模型

2014年,Dan Saffer出版了《微交互》一書。在這本書中,Dan創(chuàng)造了“微交互”一詞,并概述了設(shè)計(jì)它們的模型。該模型包括以下部分:

觸發(fā)

規(guī)則

反饋

模式和循環(huán)

丹·薩弗(Dan Saffer)的微互動(dòng)模型。

觸發(fā)

觸發(fā)因素是微交互開始的主要途徑。

有兩種觸發(fā)器:

用戶啟動(dòng)的觸發(fā)器。用戶動(dòng)作啟動(dòng)微交互。例如,當(dāng)用戶單擊按鈕或?qū)β暱叵到y(tǒng)說(shuō)些什么時(shí)(例如,iPhone用戶說(shuō)“嘿Siri”)。

系統(tǒng)啟動(dòng)的觸發(fā)器。當(dāng)滿足某些特定(通常是預(yù)定的)條件時(shí),系統(tǒng)可以觸發(fā)該動(dòng)作。例如,當(dāng)電子郵件應(yīng)用程序自動(dòng)檢查用戶收件箱中的更新并通知用戶新郵件時(shí)。

規(guī)則

觸發(fā)器啟動(dòng)一系列事件(也稱為規(guī)則)。規(guī)則定義了響應(yīng)條件變化而發(fā)生的實(shí)際動(dòng)作。

反饋

在大多數(shù)情況下,規(guī)則對(duì)于用戶是不可見的,并且用戶只能通過(guò)反饋來(lái)了解正在發(fā)生的事情。根據(jù)產(chǎn)品的類型,反饋可以是視覺,聽覺或觸覺的。

模式和循環(huán)

模式和循環(huán)決定了微交互的元規(guī)則。當(dāng)條件改變時(shí),微相互作用會(huì)發(fā)生什么?

微交互的用例

通常,微交互在產(chǎn)品設(shè)計(jì)過(guò)程中不會(huì)引起太多關(guān)注。畢竟,它們只是用戶體驗(yàn)的小細(xì)節(jié)。但是,這些小細(xì)節(jié)會(huì)對(duì)產(chǎn)品給用戶的印象產(chǎn)生重大影響。正如查爾斯·埃姆斯(Charles Eames)曾經(jīng)說(shuō)過(guò)的:“細(xì)節(jié)不是細(xì)節(jié)。他們負(fù)責(zé)設(shè)計(jì)。”無(wú)論您的產(chǎn)品中有多少精心設(shè)計(jì)的功能,有時(shí)一個(gè)小問(wèn)題都會(huì)引起很多挫敗感。丹·薩弗(Dan Saffer)在他的書中稱此類瞬間為“鞋子中的卵石”,這意味著無(wú)論鞋子多么漂亮,穿上一塊小卵石都會(huì)令人不快。這就是為什么在許多情況下,我們可以忍受的產(chǎn)品與我們喜歡的產(chǎn)品之間的區(qū)別在于我們與它們之間的微相互作用的質(zhì)量。必須將重點(diǎn)放在設(shè)計(jì)小時(shí)刻上。

“我們可以忍受的產(chǎn)品與我們喜歡的產(chǎn)品之間的區(qū)別在于我們與它們之間的微相互作用的質(zhì)量。”

提供有關(guān)用戶操作的視覺或音頻反饋

當(dāng)我們考慮微交互時(shí),系統(tǒng)反饋是首先想到的領(lǐng)域之一。無(wú)論您設(shè)計(jì)哪種產(chǎn)品,都應(yīng)始終努力創(chuàng)建直觀的設(shè)計(jì)。微交互可以幫助您實(shí)現(xiàn)此目標(biāo)-它們確實(shí)擅長(zhǎng)提供反饋以使用戶保持了解狀態(tài)。有趣的是,有可能將微交互納入用戶開始使用產(chǎn)品時(shí)的最初體驗(yàn)。打開產(chǎn)品可能是微交互的好觸發(fā)條件。許多Apple Mac用戶記得它的啟動(dòng)聲音。當(dāng)涉及日常體驗(yàn)中的反饋時(shí),考慮整個(gè)用戶旅程至關(guān)重要。查看用戶可能需要反饋以確保放心的地方。例如,如果您設(shè)計(jì)一個(gè)支付系統(tǒng),則需要為每筆交易提供出色的反饋。試想一下,如果用戶在匯款后沒有獲得成功屏幕,將會(huì)發(fā)生什么情況。

Stripe通過(guò)顯示綠色的選中標(biāo)記圖標(biāo)來(lái)確保用戶交易成功進(jìn)行。

幫助用戶防止錯(cuò)誤

幫助用戶處理錯(cuò)誤狀態(tài)的條件很好,但是好是防止他們首先犯錯(cuò)誤。當(dāng)我們遵循這種方法時(shí),我們將創(chuàng)建可讓用戶控制其體驗(yàn)的產(chǎn)品。Gmail自動(dòng)防網(wǎng)絡(luò)釣魚過(guò)濾器是保護(hù)用戶數(shù)據(jù)的微交互的一個(gè)很好的例子。每當(dāng)Gmail檢測(cè)到可能危害用戶的內(nèi)容時(shí),它都會(huì)觸發(fā)一條消息,通知用戶有關(guān)潛在危險(xiǎn)的操作。

Gmail可防止用戶與危險(xiǎn)內(nèi)容進(jìn)行互動(dòng)。

Web和移動(dòng)表單是許多用戶感到沮喪的常見原因。讓我們以帳戶創(chuàng)建過(guò)程為例。許多表格要求登錄名/密碼組合。通常,當(dāng)用戶創(chuàng)建此組合并按下“提交”按鈕時(shí),他們會(huì)收到一條錯(cuò)誤消息,指出用戶名已存在或密碼不符合安全要求(即使以前未指定這些要求)。內(nèi)聯(lián)驗(yàn)證使用戶免于潛在的額外工作。微交互會(huì)向用戶傳達(dá)其登錄名和密碼是否滿足所有要求。

內(nèi)聯(lián)驗(yàn)證在實(shí)踐中。

但是,不僅數(shù)字產(chǎn)品可以從錯(cuò)誤預(yù)防中受益。這種方法在我們使用的其他產(chǎn)品中同樣有效。例如,許多現(xiàn)代汽車都具有碰撞前安全技術(shù)。最有用的系統(tǒng)之一是盲點(diǎn)監(jiān)視系統(tǒng)。駕駛時(shí)改變車道是可能導(dǎo)致事故的潛在危險(xiǎn)操作-駕駛員可能會(huì)錯(cuò)過(guò)其他車道的車輛,因?yàn)樗鼈兲幱诿c(diǎn)。盲區(qū)監(jiān)視系統(tǒng)充當(dāng)助手,它監(jiān)視盲區(qū)并在改變車道時(shí)警告駕駛員碰撞的危險(xiǎn)。大多數(shù)此類系統(tǒng)將音頻反饋(嗶嗶聲)與左后視鏡或右后視鏡上的視覺指示配對(duì)在一起。這樣,系統(tǒng)可以防止用戶出錯(cuò)。

使與產(chǎn)品的無(wú)縫交互

交互成本的概念在人機(jī)交互中起著至關(guān)重要的作用。NNGroup將交互成本定義為用戶必須花費(fèi)精力與產(chǎn)品進(jìn)行交互才能達(dá)到其目標(biāo)的精神和身體上的總和。交互成本是可用性的直接衡量標(biāo)準(zhǔn)-用戶在交互上投入的精力越少,產(chǎn)品的可用性就越好。這就是為什么如此多的設(shè)計(jì)師努力創(chuàng)建無(wú)縫交互的原因。無(wú)縫交互是不需要太多努力的交互。微交互可以幫助我們創(chuàng)造無(wú)縫的體驗(yàn)。以下是在許多現(xiàn)代移動(dòng)應(yīng)用程序中可以找到的無(wú)縫交互的一些示例:

滑動(dòng)動(dòng)作。輕掃操作消除了輕擊,并幫助用戶快速瀏覽不同的選項(xiàng)。

輕拂比輕擊容易。

拉刷新。拉動(dòng)刷新是用戶觸發(fā)的微交互的一個(gè)很好的例子。通過(guò)拉動(dòng)刷新,用戶可以下拉列表對(duì)象以檢索更多數(shù)據(jù)。這個(gè)簡(jiǎn)單的手勢(shì)最初是由Loren Brichter為Tweetie應(yīng)用程序創(chuàng)建的,后來(lái)被成千上萬(wàn)個(gè)應(yīng)用程序迅速采用,因?yàn)樗箶?shù)據(jù)更新的體驗(yàn)變得非常流暢。

拉動(dòng)刷新用于許多應(yīng)用程序。很難想象任何沒有這種模式的移動(dòng)電子郵件應(yīng)用程序。

考慮用戶上下文

好的體驗(yàn)是使用有關(guān)用戶的所有可用信息來(lái)提供有價(jià)值的解決方案的體驗(yàn)。您幾乎總是對(duì)用戶有所了解,例如他們的當(dāng)前位置,環(huán)境,一天中的時(shí)間等。使用此信息為用戶創(chuàng)造價(jià)值至關(guān)重要。

“好的體驗(yàn)是使用有關(guān)用戶的所有可用信息來(lái)提供有價(jià)值的解決方案的體驗(yàn)。”

讓我們以Apple Maps為例。Apple Maps使用有關(guān)用戶當(dāng)前位置的信息來(lái)提供有關(guān)方向的寶貴見解。很棒的是,該應(yīng)用程序會(huì)自動(dòng)執(zhí)行此操作-它會(huì)收集有關(guān)用戶的信息,并使用它來(lái)預(yù)測(cè)用戶的前進(jìn)方向。因此,例如,如果您每天下午6點(diǎn)左右離開辦公室走到汽車上,將會(huì)收到一條通知,如下所示。這是系統(tǒng)觸發(fā)的微交互的一個(gè)很好的例子。

優(yōu)質(zhì)的產(chǎn)品可以預(yù)測(cè)用戶的行為并提供有價(jià)值的解決方案。當(dāng)用戶第一次看到此類消息時(shí),他們可能會(huì)認(rèn)為這很神奇。他們開始相信該應(yīng)用程序確實(shí)了解他們。與以前的情況類似,微交互不限于網(wǎng)站和移動(dòng)應(yīng)用程序??梢哉业绞褂糜脩羯舷挛牡膬?yōu)秀產(chǎn)品示例??紤]下面的Nest示例。每次用戶經(jīng)過(guò)時(shí),Nest都會(huì)在屏幕上顯示當(dāng)前溫度,從而避免用戶需要手動(dòng)點(diǎn)擊設(shè)備。

Nest恒溫器。

將人類帶入人機(jī)交互

將情感融入您的設(shè)計(jì)中,可以在人與計(jì)算機(jī)之間建立更好的聯(lián)系。短暫的歡愉可能是精湛工藝的好標(biāo)志。當(dāng)涉及到可以將人與人互動(dòng)的地方時(shí),請(qǐng)從諸如動(dòng)畫反饋之類的基本內(nèi)容開始。在下面的示例中考慮Twitter的動(dòng)畫反饋。當(dāng)用戶點(diǎn)擊“贊”圖標(biāo)時(shí),Twitter將在短時(shí)間內(nèi)使心臟動(dòng)起來(lái)。這是鼓勵(lì)喜歡的簡(jiǎn)單但有效的方法。

Twitter的Like動(dòng)畫。

當(dāng)您發(fā)現(xiàn)用戶旅程中實(shí)現(xiàn)重要目標(biāo)或完成重要任務(wù)的時(shí)刻時(shí),可能會(huì)獲得更好的結(jié)果。您可以使用微交互功能增強(qiáng)那些時(shí)刻。這樣,您將創(chuàng)造出巨大的成就感,并使這一刻變得特別。

當(dāng)用戶的收件箱為“零”時(shí),Gmail會(huì)顯示動(dòng)畫反饋。

同樣,微交互不僅限于網(wǎng)絡(luò)和移動(dòng)體驗(yàn)。它們可以在我們使用的所有產(chǎn)品中烘焙。例如,福特發(fā)現(xiàn)了一種非常有趣的方式來(lái)展示駕駛混合動(dòng)力汽車的效率。與許多其他混合動(dòng)力汽車相似,福特汽車具有顯示環(huán)保評(píng)分的效率等級(jí)。但是他們沒有使用這個(gè)比例的百分比,而是決定使用樹葉。駕駛員以環(huán)保方式行駛時(shí)會(huì)看到更多的葉子。結(jié)果,許多人對(duì)葉子非常依戀,并嘗試盡可能多地生長(zhǎng)。人們非常喜歡這種體驗(yàn),這一事實(shí)證明了出色的設(shè)計(jì)可以改變用戶的生活。

福特汽車的效率指標(biāo)。

設(shè)計(jì)更好的微交互時(shí)要記住什么

如果計(jì)劃設(shè)計(jì)微交互,則需要牢記一些注意事項(xiàng)。

創(chuàng)建微交互應(yīng)該是設(shè)計(jì)過(guò)程的一部分

微交互不是您在現(xiàn)有體驗(yàn)之上添加的好東西。它們是產(chǎn)品設(shè)計(jì)的基本要素,應(yīng)從一開始就在設(shè)計(jì)中進(jìn)行烘焙。以下是一些簡(jiǎn)單的技巧,可幫助您烘焙設(shè)計(jì)過(guò)程中的微交互:

不要將微交互僅限于設(shè)計(jì)師。每個(gè)參與產(chǎn)品創(chuàng)建并關(guān)心它的人都可以提出很好的解決方案。給他們這個(gè)機(jī)會(huì)。

準(zhǔn)備回去重新考慮您的經(jīng)歷。不要停止對(duì)微小元素的不同部分進(jìn)行迭代并嘗試不同的方法。

始終考慮大局

有時(shí),設(shè)計(jì)決策在概念上可能并不壞,但是當(dāng)您使用決策來(lái)構(gòu)建實(shí)際的應(yīng)用程序時(shí),很明顯,它們不能很好地協(xié)同工作。結(jié)果,體驗(yàn)變得非常差。這就是為什么重要的是要查看整個(gè)產(chǎn)品,而不僅僅是體驗(yàn)的各個(gè)部分。當(dāng)您為單獨(dú)的零件設(shè)計(jì)時(shí),您可能會(huì)產(chǎn)生零散的體驗(yàn)。在這樣的經(jīng)歷中,微交互的弊大于利。請(qǐng)記住,所有小細(xì)節(jié)都應(yīng)融合在一起,以創(chuàng)建整體的用戶體驗(yàn)。

考慮一下您的微交互如何長(zhǎng)期保持

建立長(zhǎng)效的微交互確實(shí)是一項(xiàng)挑戰(zhàn)。您不僅需要分析人們?nèi)绾问褂媚漠a(chǎn)品,還需要分析他們的體驗(yàn)。對(duì)設(shè)計(jì)元素的反應(yīng)全都與情感有關(guān),因此,如果用戶對(duì)您的產(chǎn)品有負(fù)面情感,則很明顯,您必須重新設(shè)計(jì)某些元素。第一次看起來(lái)有趣的事情可能會(huì)在一段時(shí)間后變得壓力重重。每次評(píng)估單個(gè)微小時(shí)刻時(shí),請(qǐng)穿上自己的鞋子,并詢問(wèn)以下問(wèn)題:

當(dāng)用戶看到這種動(dòng)畫效果/聽到這種聲音數(shù)千次時(shí)會(huì)發(fā)生什么?

他們還會(huì)像第一次一樣享受它嗎?

以下是兩個(gè)永恒的規(guī)則:

不要從零開始。使用您擁有的有關(guān)目標(biāo)受眾的信息,為他們創(chuàng)建最有效的解決方案。

遵循KISS原則(保持簡(jiǎn)單,愚蠢!)。避免過(guò)度設(shè)計(jì)微交互。始終嘗試使其盡可能簡(jiǎn)單。

微交互使產(chǎn)品個(gè)性化

漂亮的設(shè)計(jì)在于細(xì)節(jié)處理,我們使用產(chǎn)品的總體用戶體驗(yàn)是大大小小的細(xì)節(jié)的總和。細(xì)節(jié)可以將優(yōu)質(zhì)產(chǎn)品轉(zhuǎn)化為優(yōu)質(zhì)產(chǎn)品。人們注意到對(duì)細(xì)節(jié)的關(guān)注,這使他們愛上了體驗(yàn),因?yàn)樗麄冎?strong>成都網(wǎng)站設(shè)計(jì)師背后的人們真的很在意。

網(wǎng)頁(yè)題目:成都網(wǎng)站建設(shè)微交互設(shè)計(jì)的重要性
分享網(wǎng)址:http://www.bm7419.com/news/245412.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷seo公司;服務(wù)項(xiàng)目有網(wǎng)站建設(shè)

廣告

聲明:本網(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í)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都定制網(wǎng)站網(wǎng)頁(yè)設(shè)計(jì)