SPARKFUL

Blog

Insights from the SPARKFUL x Fourdesire teams

捕捉使用者注意力:適量的突現動態效果

Magic Hunguser-interface-design
name

突現的動態效果在介面中能夠有效的吸引使用者的注意,可引導使用者點擊、並開啟特定功能或訊息,常用於逐步的使用教學與訊息提示中;但當動態效果過多的時候,不但會造成使用者視覺上的打擾,久了還會呈現自動忽略的情形,而失去了使用動態效果傳遞重要訊息的目的。

常見的動態效果的表現方式主要可分為 4 種:突然出現(abrupt onset)、突然消失(abrupt offset)、移動(motion)、和閃爍(flicker)。而研究結果發現,這 4 種動畫的形態對於吸引使用者注意力的程度不相上下,但突然消失的方式在介面中是比較少使用的:

若我們將突現的動態效果應用在介面中的話,可以將需要特別強調的訊息在整個介面讀取顯示之後,再顯示出來。這麼一來,會比一開始就全部讀取好、直接顯示,更能讓使用者快速地注意到(如下圖 Instagram 的訊息提示)。

透過動畫的方式強調或提醒使用者必須適量,過於頻繁的動畫提示會讓使用者大腦習慣於刺激,而發生類似廣告視盲(Banner blindness)的現象,這也是為什麼我們可以很自然的忽略一些介面中出現的廣告 Banner,即使它們有著花俏與不停跳動的動畫 -- 因為我們的大腦早已將這類的刺激習慣化(habituation)了。

參考文獻:

  1. Ludwig, C. J. H., Ranson, A., & Gilchrist, I. D. (2008). Oculomotor capture by transient events : A comparison of abrupt onsets, offsets, motion, and flicker. Journal of vision, 8(14), 1-16.
  2. Benway, J. P., & Lane, D. M. (1998.12). Banner Blindness: Web Searchers Often Miss "Obvious" Links. ITG Newsletter, Retrieved February 20, 2009, from http://www.internettg.org/newsletter/dec98/banner_blindness.html
  3. (圖片來源:CarbonNYC, CC Licensed)
Magic Hung
Magic Hung
Technical Director
Technical Director @ Fourdesire. Create fun and crafts via programming.
divider
Related Posts
name

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

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

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

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

The Visual Perception Principles of Gestalt Psychology

Special tendency occurs when our eyes and brain observe objects and perceive visual stimuli. The tendency usually helps us to identify objects faster, but sometimes it also causes the “illusion”. The main concept of Gestalt Psychology is “the whole is other than the sum of the parts”. For ex...Read more