SPARKFUL

Blog

SPARKFUL 團隊心得與生活點滴

UI 陷阱:套牢的進度對話框

Magic Hunguser-interface-design
name

進度對話框(Progress dialog)是行動裝置介面裡一個常見又惹人厭的介面元件,它的出現限制了使用者的自由,有時甚至讓他們落入了無止盡的等待深淵,按 Back 鍵不靈,按 Home 鍵就掛點,到最後又可能只是一場空,無論是 iOS 還是 Android,這樣的景象處處可見。

進度狀態的呈現主要有三種方式:

  1. 套牢式的進度對話框(Non-cancellable Progress Dialog)- 套牢式的進度對話框透過暫時限制住使用者的操控,讓程式可以安全地完成動作或許多動作,使用者在此時只能夠等待結果,或是按 Home 鍵跳出。

  2. 可取消的進度對話框(Cancellable)- 在 Android 中比較常見(因預設對話框有提供可取消的參數),使用者可透過實體 Back 鍵取消動作,不過雖然可以讓使用者反悔,但若使用者想要成功地完成這個操作,還是得乖乖的等待進度對話框結束!

  3. 在背景處理的進度(Progress in background)- 這種呈現方式是非常友善的,使用者可以在這個時候繼續使用你的程式其他功能,讓他們四處晃晃,等過一陣子後,再叮的一聲告訴你麵包烤好了快來吃,不過可以想像在背景程序中處理,效能上當然會打點折扣。

Progress Dialog

會使用進度對話框,最好的理由就是為了計算上的效率(如圖片濾鏡的計算),不過很可惜的在大部分的情況下,它只是方便了開發者而不是使用者,就像你害怕一個親戚小屁孩闖進房間把你珍貴的模型玩壞了,所以乾脆把房門直接鎖起來,而不是友善的邀請他進你房間任意玩耍並做好保護措施(例如把它們藏起來…)。

如果你真的必須確保使用者先完成某些步驟,或是加快你的步驟完成時間而使用進度對話框,那麼你應該考慮是否處在合適的操作深度下:

操作深度就是使用者處在程式階層架構中的深度,深度越深代表著操作動作越具體明確,使用者操作的動機也越確定。

若我們以相機濾鏡程式為例(如下圖所示),從啟動程式開始,當使用者選擇瀏覽熱門或是最新圖片、或是照相張相片,這時的操作深度其實還是很淺的,他們可能只是隨意的想要看看東西、或是隨便照照,很有可能在短時間內沒興趣就離開,這時的動機其實沒有那麼明確,使用者願意等待的耐心是較低的。

depth action

反之當使用者操作的功能與動作越細微、越明確,他們裁好了圖片、想要套用濾鏡,然後上傳圖片;或是在熱門圖片看到了有興趣的圖片,打好了想說的話要留言,這時候他們也很確定自己想要做什麼、有目的性,並且已經快到達了動作的末端,比較願意等待或是釋放出操作的控制權,這時候進度對話框的傷害就會減少許多。

但有些操作還是建議不要使用套牢式的進度對話框,尤其是必須透過網路連線或傳輸才能達成的操作(如讀取最新或熱門訊息),因為網路的速度是你無法掌握的,網路什麼時候斷線也不是你能事先預期的,程式很有可能就在這些動作間花上許多時間(並且最後還有可能失敗),使用者乾瞪著那該死又轉轉轉的讀取圖示卻什麼也無法作,那種心情你懂的…

其實最友善的作法,還是無論在任何情況下,都應該要讓使用者保有控制權,讓我們三心二意的使用者隨時可以反悔他們的決定,而不致於不知所措而緊張地按下了 Home 鍵跳出、或是不耐的強制關閉程式,如果你總是關上房門來管教對你充滿熱情的小屁孩,他們總有一天會對你失去興趣的。


Reference

Photo by Clint Patterson on Unsplash

Magic Hung
Magic Hung
Technical Director
Technical Director @ Fourdesire. Create fun and crafts via programming.
divider
相關文章
name

電影色彩學:這些經典電影如何運用「色彩」引導觀眾情緒

電影裡的弦外之音無論是電影、圖畫或任何形式的創作中,「色彩」都是非常基本且重要的元素。好的色彩運用可以讓人一眼看出創作者想表達的情緒。因此,如何恰當的運用色彩是一項相當重要的課題。平常在看電影的時候,除了關心劇情,也可以...閱讀更多
name

藏於字句間的創作:產品中的在地化翻譯

產品辛苦開發了,但要吸引其他語言使用者的使用,並不是那麼簡單的一件事。即使產品已經在某個國家(例如台灣)有了足夠的使用者數量,也不是翻譯成日文,就會憑空冒出許多日本的使用者。網路是連結的,但社群不是許多人...閱讀更多
name

為使用者撒下「麵包屑」

大家小時候應該都有看過或聽過《糖果屋》(收錄於格林童話)的故事吧?故事裡的小兄妹在森林裡面邊走邊撒下麵包屑,希望可以在迷路的時候沿著麵包屑回到家,結果麵包屑被森林裡的小動物吃掉,這對小兄妹也就在森林裡面...閱讀更多