SPARKFUL
죄송합니다. 이 페이지는 해당 언어로 번역이 되어 있지 않습니다. 열심히 노력 중이니 조금만 기다려주시면 감사하겠습니다!

Blog

Insights from the SPARKFUL 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
관련 게시물
name

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

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

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

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

完形心理學的視覺法則

我們的眼睛和大腦在觀察事物、接收影像刺激的時候,會有一些特別的傾向。這些傾向常常可以幫助我們快速的辨別事物,有時候也會產生所謂的「錯覺」。完形心理學重要的概念便是「整體不等於個體的總合」,舉例來說:當我們在觀察另一個人...더 많은 기사 읽기