旗下產(chǎn)業(yè): A產(chǎn)業(yè)/?A實(shí)習(xí)/?A計(jì)劃
全國(guó)統(tǒng)一咨詢熱線:010-5367 2995
首頁(yè) > 熱門文章 > UI設(shè)計(jì) > 如何在表單UI設(shè)計(jì)中考慮用戶的情感

如何在表單UI設(shè)計(jì)中考慮用戶的情感

時(shí)間:2020-12-05來(lái)源:m.5wd995.cn點(diǎn)擊量:作者:Arya
時(shí)間:2020-12-05點(diǎn)擊量:作者:Arya
       根據(jù)用戶需求的層次結(jié)構(gòu),數(shù)碼產(chǎn)品應(yīng)為:功能性、解決問(wèn)題??煽?、始終如一地工作。可用的、高標(biāo)準(zhǔn)完成工作。本文AAA教育的武老師對(duì)如何在表單UI設(shè)計(jì)中考慮用戶的情感進(jìn)行分享。

  但是它們也應(yīng)該是令人愉快的。
 

如何在表單UI設(shè)計(jì)中考慮用戶的情感
 

  當(dāng)然,我們知道最新的iPhone或精美的在線購(gòu)物體驗(yàn)需要喚起驚喜和愉悅的感覺但是,本質(zhì)上更實(shí)用的產(chǎn)品又如何呢?喜歡...形式嗎?他們也會(huì)感到驚訝和高興嗎?
 

  我對(duì)此的簡(jiǎn)短回答是:是的。
 

  它所需要的只是一點(diǎn)想象力。
 

  讓我們進(jìn)入:
 

  非傳統(tǒng)形式元素
 

  表單的UX流
 

  設(shè)計(jì)好玩的形式的技巧
 

  探索UI元素的潛力
 

  表單設(shè)計(jì)應(yīng)該是一致的,但這并不意味著它不能融合一點(diǎn)驚喜。通過(guò)使用非標(biāo)準(zhǔn)的UI元素(如可單擊的圖像和切換的滑塊),您可以使表單填充令人愉快且直觀。
 

  (使用InVision Craft輕松將設(shè)計(jì)移至原型。)
 

  這種思路構(gòu)成了我們產(chǎn)品JotForm Cards中某些功能的基礎(chǔ)。
 

  “表單設(shè)計(jì)應(yīng)該是一致的,但這并不意味著它不能融合一點(diǎn)驚喜。”
 

  當(dāng)然,設(shè)計(jì)本身看起來(lái)很酷,但是填充表格的經(jīng)驗(yàn)又如何呢?用戶能否以更加動(dòng)態(tài),互動(dòng)的方式表達(dá)自己的答案?我們是這樣認(rèn)為的。
 

  通過(guò)拖動(dòng)藍(lán)色點(diǎn)或單擊灰色點(diǎn),受訪者可以在指尖看到答案的變化。
 

  向左滑動(dòng)。向右滑動(dòng)。

        表情符號(hào)滑塊
 

如何在表單UI設(shè)計(jì)中考慮用戶的情感
 

  用戶可以使用表情符號(hào)滑塊代替刻度來(lái)表達(dá)自己的滿意程度。討厭這個(gè)活動(dòng)嗎?哭的臉!超級(jí)開心?愛心的眼睛。
 

  表情符號(hào)滑塊可讓表單填寫者以青少年的母語(yǔ)回答。是-否切換
 

  這很令人滿意,很簡(jiǎn)單,很決定性。
 

  當(dāng)我們觀看用戶測(cè)試視頻時(shí),很明顯,這些新功能使人們微笑。對(duì)于我們來(lái)說(shuō)很幸運(yùn),這樣的響應(yīng)對(duì)于我們來(lái)說(shuō)很容易并且很有趣。
 

  良好的UX用戶體驗(yàn)流程
 

  任務(wù),很容易和滿足于完成后會(huì)平靜的用戶進(jìn)入狀態(tài)流程:巔峰享受,高度集中注意力。最好的情況下很難做到這一點(diǎn),如果用戶遇到障礙和錯(cuò)誤,那是絕對(duì)不可能的。
 

  我們需要努力創(chuàng)建一條通暢的完成路徑,而這只需要用戶付出最小的努力。成功的定義是最大程度地減少痛點(diǎn)并預(yù)見沮喪的時(shí)刻。
 

  “簡(jiǎn)單而令人滿意的任務(wù)將使用戶陷入混亂的狀態(tài):享受高峰,集中注意力。”
 

  推動(dòng)行動(dòng)
 

  高認(rèn)知負(fù)荷是成功填寫表格的敵人。當(dāng)人們不得不思考或做更多不必要的事情時(shí),就會(huì)發(fā)生這種情況。運(yùn)動(dòng)動(dòng)作對(duì)大腦的“負(fù)荷強(qiáng)度”要比那些煩人的認(rèn)知?jiǎng)幼?這有點(diǎn)使筆記本電腦變慢的軟件類型)少。
 

  這就是每個(gè)UI元素理想情況下都應(yīng)該包含動(dòng)作(例如,單擊鼠標(biāo))而不是認(rèn)知?jiǎng)幼?涉及思維和打字的任何動(dòng)作)的原因。

  您可以在哪里偷工減料以減少打字的需要?考慮預(yù)定義的答案,自動(dòng)填充,智能默認(rèn)設(shè)置和郵政編碼查找-根據(jù)Google的規(guī)定,這些功能可幫助人們將表單填寫速度提高30%。無(wú)論谷歌和香菜提供的JavaScript API為您的網(wǎng)站代碼,以減少輸入。
 

  “高認(rèn)知負(fù)荷是成功填寫表格的敵人。”
 

  減少點(diǎn)擊
 

  好的,因此您已將每個(gè)操作轉(zhuǎn)換為可點(diǎn)擊的內(nèi)容。現(xiàn)在是時(shí)候減少盡可能多的點(diǎn)擊了。當(dāng)Microsoft將其關(guān)閉提示從可單擊的關(guān)閉圖標(biāo)更改為下拉框時(shí),他們發(fā)現(xiàn)關(guān)閉計(jì)算機(jī)的人數(shù)減少了—只是由于另外兩次單擊。
 

  始終使用復(fù)選框,并使用單選按鈕而不是下拉菜單。切勿在字段中拼寫電話號(hào)碼或生日。
 

  最重要的是減少字段。盡可能減少更多,然后再減少更多。Expedia在預(yù)訂單上再問(wèn)了一個(gè)問(wèn)題,就損失了1200萬(wàn)美元。不要跟隨他們的腳步。
 

  較短的Web表單為用戶減少了摩擦,從而增加了轉(zhuǎn)換的機(jī)會(huì)。Hubspot的一項(xiàng)研究發(fā)現(xiàn),將表單字段的數(shù)量從四個(gè)減少到三個(gè),可以將轉(zhuǎn)換率提高50%。
 

  正如數(shù)學(xué)家布萊斯·帕斯卡爾(Blaise Pascal)所說(shuō)的那樣:“我比平常更長(zhǎng)了,因?yàn)槲覜]有時(shí)間將其縮短。”
 

  表單設(shè)計(jì),要使其有趣
 

  大腦喜歡玩耍和實(shí)驗(yàn)。有很多方法可以利用動(dòng)量的力量來(lái)游戲化表格填充的經(jīng)驗(yàn)。并在動(dòng)畫中添加幽默感,使體驗(yàn)更人性化。
 

  游戲化
 

  這是我們希望傳達(dá)的鼓勵(lì)類型,以幫助我們的用戶填寫表格。
 

  例如,JotForm Cards的多階段布局遵循的理論是,用戶在感覺前進(jìn)時(shí)更有可能繼續(xù)前進(jìn)。與靜態(tài)地停留在一頁(yè)上相比,始終移至下一步會(huì)產(chǎn)生動(dòng)感。
 

  “動(dòng)畫將美與情感與功能結(jié)合在一起。”
 

  我們用一個(gè)進(jìn)度點(diǎn)來(lái)說(shuō)明這一點(diǎn),該進(jìn)度點(diǎn)顯示已經(jīng)完成了多少個(gè)問(wèn)題,還剩下多少個(gè)問(wèn)題。僅當(dāng)用戶將鼠標(biāo)懸停在該點(diǎn)上時(shí),該點(diǎn)才會(huì)出現(xiàn)。用戶可以輕松切換到概覽模式,該模式使他們可以在編號(hào)的問(wèn)題之間切換,并可以像地圖一樣使用自由的水平滾動(dòng)。
 

  動(dòng)畫化
 

  動(dòng)畫將美與情感與功能結(jié)合在一起。與靜態(tài)屏幕相比,它可以使界面更生動(dòng),吸引用戶的注意力并以更明亮,更吸引人的方式說(shuō)明錯(cuò)誤或說(shuō)明。
 

  如果用戶輸入錯(cuò)誤,屏幕會(huì)搖動(dòng)“否”以通知他們。每一步都應(yīng)使用戶感到仿佛正朝著目標(biāo)邁進(jìn)。
 

  最后的想法
 

  為獲得良好的用戶體驗(yàn)而進(jìn)行的設(shè)計(jì)所涉及的不僅僅是使產(chǎn)品可用。可用性是使人們能夠?qū)崿F(xiàn)目標(biāo)的原因,而經(jīng)驗(yàn)則使您的產(chǎn)品令人難忘。
 

  優(yōu)秀的UX之所以令人滿意,是因?yàn)樗?jīng)過(guò)精心設(shè)計(jì)。它讓您沉浸其中,并激發(fā)您的熱情,例如游戲,應(yīng)用程序或電影。而且沒有理由為什么表格不能在所有這些相同的方框中打勾。
 

  請(qǐng)記住,用戶體驗(yàn)不僅與可用性有關(guān),還與感覺有關(guān)。因此,通過(guò)將感覺與功能聯(lián)系起來(lái),使您的形式使用起來(lái)很愉快。這篇文章的表單情感UI設(shè)計(jì)內(nèi)容你學(xué)到了嗎,更多資訊請(qǐng)持續(xù)關(guān)注AAA教育~

預(yù)約申請(qǐng)免費(fèi)試聽課

填寫下面表單即可預(yù)約申請(qǐng)免費(fèi)試聽!怕錢不夠?可先就業(yè)掙錢后再付學(xué)費(fèi)! 怕學(xué)不會(huì)?助教全程陪讀,隨時(shí)解惑!擔(dān)心就業(yè)?一地學(xué)習(xí),可推薦就業(yè)!

?2007-2021/北京漫動(dòng)者教育科技有限公司版權(quán)所有
備案號(hào):京ICP備12034770號(hào)

?2007-2022/ m.5wd995.cn 北京漫動(dòng)者數(shù)字科技有限公司 備案號(hào): 京ICP備12034770號(hào) 監(jiān)督電話:010-53672995 郵箱:bjaaa@aaaedu.cc

京公網(wǎng)安備 11010802035704號(hào)

網(wǎng)站地圖