愛伊米

UX細節設計思路之考慮介面干擾

導讀:優秀UX細節創新設計讓使用者感到方便、貼心、可靠、安全、愉悅。UX細節創新設計並非都來自一剎那的靈光乍現, 創新能力也不是少數人只可意會不可言傳的一種天賦,優秀的UX細節創新設計其實有章可循,創新能力是可以通過後天培養提升的。本文作者對UX細節設計中的介面干擾進行了分析,希望對你有幫助。

UX細節設計思路之考慮介面干擾

在特定的操作使用環境下,一項功能會被同一個介面中其他的UI元素所幹擾,在設計細節時,避免這些因素的干擾,即可最佳化使用體驗。此類細節創新的關鍵心法有兩條:

其一,互動設計要有區塊,區塊結構清晰,各元素互不干擾,這種互不干擾也可能是動態的,即使用者不進行什麼操作時,各個元素不相干擾,但是執行某項操作時,其他功能可能對其形成干擾,此時需要做的細節創新就是消除此類干擾或者將干擾的影響降到最低;

其二,各功能模組之間是有主次之分,對於重要的功能突出顯示(例如更大的操作面積、更方便的操作路徑、更突出的顏色字號等),但這種主次也應該是動態的,隨著場景變化,各功能優先順序也會發生變化,此時就要做到需要功能突出的時候突出顯示、不需要突出的時候淡化顯示。

一、設計案例

1)MIUI

當我們使用手機時,從一個較亮的環境轉到一個較暗的環境,螢幕會一下子顯得太亮、太刺眼,需要調節螢幕亮度,一般情況下的習慣操作是退出當前App,找到系統設定,調節螢幕亮度,然後再開啟剛剛在使用的App, 可這時很可能發現亮度調節並沒有達到自己預期的效果,又不得不再重複一遍以上操作。

MIUI的亮度調節功能考慮到了這一場景,MIUI系統中,可以直接下拉出系統工具欄,工具欄下方有一個亮度調節條,可直接調節螢幕亮度,使用者滑動調節亮度時,會隱藏整個工具框亮度調節條以外其他所有功能按鍵,直接以當前介面為背景調節亮度,亮度調節效果所見即所得!

UX細節設計思路之考慮介面干擾

UX細節設計思路之考慮介面干擾

UX細節設計思路之考慮介面干擾

MIUI調節亮度時會直接以當前操作介面為背景進行調節

2)優酷

在用網頁觀看影片時,偶爾也會想看看影片的相關評論,將網頁往下拉檢視評論,此時,要麼暫停影片以免錯過精彩內容,要麼不暫停影片只聽聲音,保持影片的正常播放。能不能有既可以多評論,又不影響看影片的設計方案?嗯,當然有,使用彈幕!但畢竟還有一部分使用者並不習慣使用彈幕。

在YouTube、優酷網頁上,使用者將播放器滾動出瀏覽器可視範圍之外後,頁面上會保留一個小的播放視窗,一直懸浮在右下角,這樣既方便檢視評論, 又不影響觀看進度。

UX細節設計思路之考慮介面干擾

優酷上播放影片時,滾動到頁面下方檢視評論等其他資訊時,會有一個懸浮播放視窗繼續播放影片內容

3)iPhone

恰當的功能佈局亦能夠為使用者帶來更好的操作體驗。例如,使用iPhone 的3D Touch功能時,用手指重按App圖示後,彈出的功能選單會根據圖示在螢幕上的位置自動調整為向上或向下展開,此時選單中功能項的順序則會根據選單展開的方向自動做相應調整,以確保最靠近手指的一項始終為選單中的第一個功能(通常是設計者認為使用者最常用到的功能)。

UX細節設計思路之考慮介面干擾

UX細節設計思路之考慮介面干擾

iPhone 3D Touch的功選單,會根據出現在圖示上下方的定位自動調整功能項的順序

4)iOS

iOS 7及以後版本有一個潤物細無聲的細節設計:在非鎖屏狀態下, iPhone 頂部狀態資訊欄(訊號、運營商、訊號型別、時間、螢幕旋轉、藍芽、鬧鐘、定位、電量等)是要比鎖屏狀態下小的在非鎖屏狀態下,時間資訊顯示在頂部狀態資訊欄正中間,而在鎖屏狀態下,時間資訊在螢幕最顯眼位置放大顯示,還追加了日期(包括公曆和農曆)、星期資訊。

這樣使用者在鎖屏狀態下就可方便地檢視時間、日期、訊號、訊號型別、定位、電量等資訊,其中時間資訊最為一目瞭然。

UX細節設計思路之考慮介面干擾

UX細節設計思路之考慮介面干擾

仔細觀察,iPhone在鎖屏和非鎖屏狀態下,頂部狀態資訊欄的大小是不一樣的。

作者:文哲,微信公眾號:偉大的小細節,《偉大的小細節》作者。

本文由 @Stanley 原創釋出於人人都是產品經理,未經許可,禁止轉載

題圖來自 Unsplash,基於 CC0 協議