前端開發中的一些使用者體驗細節

2022-03-09 14:47:59 字數 1320 閱讀 5655

使用者體驗已經是乙個老生常談的話題了。我非常贊同某位達人所說的,使用者體驗

設計應該貫穿於產品從萌芽到出生的整個過程,產品原型、視覺設計、前端開發、後端開發甚至還包括產品測試大家都應該有份。只有各個環節的同學都把這個事兒當事兒了,那麼做出來的產品才有可能是好產品。我想,ued團隊在這個過程中最需要做的就是把使用者體驗的理念當成血液一樣輸送到產品的全身。這也是我們新媒ued團隊一直努力的方向。

本文主要談一談在實踐中,面對乙個產品,或者是乙個具體的功能點,也可能只是乙個按鈕,一次點選等等,以前端開發工程師的視角,如何關注使用者體驗,以及一些需要注意的細節問題,嗯,只說細節問題。

1、事先給我一點提示

路過乙個這麼漂亮的按鈕,很有心情發表一篇日誌談論一下天氣:

結果點選之後告訴我「您目前沒有許可權新增日誌」,關鍵是它還要跳轉到乙個新頁面說這個事情,很不安逸。可不可以事先就說清楚?不讓點選,變色,文字提示,或者你用個小彈出層提示也成啊。

看著這麼醒目的小氣泡,非常忍不住點選「小喇叭」看看:

嗯,小視窗優雅地向上滑出,相當不錯的體驗,技術相當霸道的小馬哥!好的,接著又點「提醒」,ok,非常舒服的彈出。再點「站內信」,oh…我又被進入一

個新頁面了。這裡如果給「站內信」加個滑鼠提示,告訴使用者現在不再是彈出,而是要進入新頁面了,不就可以避免類似我這樣的「誤」操作了麼?

2、表單驗證

實時地告訴使用者,這個應該怎麼填,哪兒又填錯了,畢竟填表單是件很繁瑣和枯燥的事兒。不時地給我一點提示資訊是非常不錯的主意。

3、讓我點選文字就可以勾選核取方塊吧

很多人都懶得這麼做一下,你就那麼狠心讓使用者慢慢去瞄準那個小小的核取方塊啊?單選按鈕也是如此。

4、暫停一下讓我看清楚

5、點選區域大一點

這是一對左右滾動的控制按鈕,還做了滑鼠經過的效果,很不錯。可就是點選區域太小了,點起來可費勁了。類似這樣的東西,請盡可能多地考慮使用者操作起來是否方便吧。你讓使用者爽了,使用者也會。。。

類似的,應該讓整個選項卡都可以點選,而不是只能點文字。

6、虛線框

在有的瀏覽器下,點選鏈結時會出現虛線框,其實我並不反感的虛線框,有的時候我還想看到這種虛線框,可是下面這樣的情況,看上去就不是很安逸了。

倒不是說,這樣就錯了,只是能做得更好,為什麼不做呢?況且處理這樣的問題只是舉手之勞嘛。

以上幾點只是使用者體驗

設計的冰山一角, 需要我們各個層面注意的細節還有很多很多。本文也沒有試圖對這些問題進行分門別類的講述,只是想到哪就說到哪,當是拋磚引玉吧,不足之處歡迎拍磚。

嵌入式開發中的一些細節

從事開發一年多,發現到一些小細節,會影響到自己開發的效率,特總結如下,以免犯錯 1.標準c中str系列的函式中,0 有特殊的含義 字串結束 所以如果要操作具有0x00 有實際意義 的字串,不應該用該系列的函式。例 有字串 0nocookie 0nocache 0 本義是想用 0 來表示分隔符,分隔出...

rosbag中的一些細節

將執行的ros軟體上的資料記錄到乙個.bag檔案,然後重放資料再產生相同的效果。1.記錄資料 建立乙個bag檔案 從乙個執行的ros系統中記錄topic的資料,這個topic資料會在乙個bag檔案中積累。roscore rosrun turtlesim turtlesim node rosrun t...

SeekBar Seekbar中的一些細節要點

1.修改seekbar中進度條的高度 android maxheight和android minheight 前者是用來指定進度條最大高度的 此高度並非seekbar整個控制項的高度 後者是用來指定最小高度,一般將這兩個屬性值設定成一致即可。2.滑塊和背景之間有截斷的問題 android thumb...