前端開(kāi)發(fā)中的一些用戶體驗(yàn)細(xì)節(jié)

1 評(píng)論 18178 瀏覽 1 收藏 6 分鐘

用戶體驗(yàn)已經(jīng)是一個(gè)老生常談的話題了。我非常贊同某位達(dá)人所說(shuō)的,用戶體驗(yàn)設(shè)計(jì)應(yīng)該貫穿于產(chǎn)品從萌芽到出生的整個(gè)過(guò)程,產(chǎn)品原型、視覺(jué)設(shè)計(jì)、前端開(kāi)發(fā)、后端開(kāi)發(fā)甚至還包括產(chǎn)品測(cè)試大家都應(yīng)該有份。只有各個(gè)環(huán)節(jié)的同學(xué)都把這個(gè)事兒當(dāng)事兒了,那么做出來(lái)的產(chǎn)品才有可能是好產(chǎn)品。我想,UED團(tuán)隊(duì)在這個(gè)過(guò)程中最需要做的就是把用戶體驗(yàn)的理念當(dāng)成血液一樣輸送到產(chǎn)品的全身。這也是我們新媒UED團(tuán)隊(duì)一直努力的方向。

本文主要談一談在實(shí)踐中,面對(duì)一個(gè)產(chǎn)品,或者是一個(gè)具體的功能點(diǎn),也可能只是一個(gè)按鈕,一次點(diǎn)擊等等,以前端開(kāi)發(fā)工程師的視角,如何關(guān)注用戶體驗(yàn),以及一些需要注意的細(xì)節(jié)問(wèn)題,嗯,只說(shuō)細(xì)節(jié)問(wèn)題。

1、事先給我一點(diǎn)提示

路過(guò)一個(gè)這么漂亮的按鈕,很有心情發(fā)表一篇日志談?wù)撘幌绿鞖猓?br /> 結(jié)果點(diǎn)擊之后告訴我“您目前沒(méi)有權(quán)限添加日志”,關(guān)鍵是它還要跳轉(zhuǎn)到一個(gè)新頁(yè)面說(shuō)這個(gè)事情,很不安逸。可不可以事先就說(shuō)清楚?不讓點(diǎn)擊,變色,文字提示,或者你用個(gè)小彈出層提示也成啊。


看著這么醒目的小氣泡,非常忍不住點(diǎn)擊“小喇叭”看看:

嗯,小窗口優(yōu)雅地向上滑出,相當(dāng)不錯(cuò)的體驗(yàn),技術(shù)相當(dāng)霸道的小馬哥!好的,接著又點(diǎn)“提醒”,OK,非常舒服的彈出。再點(diǎn)“站內(nèi)信”,oh…我又被進(jìn)入一個(gè)新頁(yè)面了。這里如果給“站內(nèi)信”加個(gè)鼠標(biāo)提示,告訴用戶現(xiàn)在不再是彈出,而是要進(jìn)入新頁(yè)面了,不就可以避免類似我這樣的“誤”操作了么?

2、表單驗(yàn)證

實(shí)時(shí)地告訴用戶,這個(gè)應(yīng)該怎么填,哪兒又填錯(cuò)了,畢竟填表單是件很繁瑣和枯燥的事兒。不時(shí)地給我一點(diǎn)提示信息是非常不錯(cuò)的主意。

3、讓我點(diǎn)擊文字就可以勾選復(fù)選框吧

很多人都懶得這么做一下,你就那么狠心讓用戶慢慢去瞄準(zhǔn)那個(gè)小小的復(fù)選框啊?單選按鈕也是如此。

4、暫停一下讓我看清楚

5、點(diǎn)擊區(qū)域大一點(diǎn)

這是一對(duì)左右滾動(dòng)的控制按鈕,還做了鼠標(biāo)經(jīng)過(guò)的效果,很不錯(cuò)??删褪屈c(diǎn)擊區(qū)域太小了,點(diǎn)起來(lái)可費(fèi)勁了。類似這樣的東西,請(qǐng)盡可能多地考慮用戶操作起來(lái)是否方便吧。你讓用戶爽了,用戶也會(huì)。。。

類似的,應(yīng)該讓整個(gè)選項(xiàng)卡都可以點(diǎn)擊,而不是只能點(diǎn)文字。

6、虛線框

在有的瀏覽器下,點(diǎn)擊鏈接時(shí)會(huì)出現(xiàn)虛線框,其實(shí)我并不反感的虛線框,有的時(shí)候我還想看到這種虛線框,可是下面這樣的情況,看上去就不是很安逸了。



倒不是說(shuō),這樣就錯(cuò)了,只是能做得更好,為什么不做呢?況且處理這樣的問(wèn)題只是舉手之勞嘛。

以上幾點(diǎn)只是用戶體驗(yàn)設(shè)計(jì)的冰山一角, 需要我們各個(gè)層面注意的細(xì)節(jié)還有很多很多。本文也沒(méi)有試圖對(duì)這些問(wèn)題進(jìn)行分門別類的講述,只是想到哪就說(shuō)到哪,當(dāng)是拋磚引玉吧,不足之處歡迎拍磚。

來(lái)源:http://www.xmued.com/?p=1155

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 十分認(rèn)同

    來(lái)自四川 回復(fù)