SPARKFUL

Blog

Insights from the SPARKFUL x Fourdesire teams

先選擇對的顏色,而不是喜歡的顏色

Decill Changuser-interface-design
name

本文有大量圖檔遺失,我們正在努力恢復中了!

中國有一句成語叫做「白紙黑字」,白紙上寫了黑字,閱讀起來是再清楚也不過了。形容了明確的文字憑據,不容許抵賴或悔改。一直到現在,白紙依然是我們最常用到的紙張類型,書寫的工具跟色彩也越來越多樣,但我們最常用的書寫顏色還是離不開黑色、藍色、紅色等色彩。試著拿螢光筆寫字看看?那豈不是給自己找麻煩嗎。

其實、顏色是否能夠被清楚辨識,取決在於其明度的差異:

  1. 顏色的呈現效果與底色有直接的關係:顏色本身具有不同的明度,在不同底色的上會有不同的效果,在下圖這張圖中我們可以清楚看到不同色彩在不同明度的底色上、會呈現出不同的效果。

  1. 顏色的明度差異影響字體的可閱讀性:我們將以上的顏色轉換成灰階就可以清楚的了解到不同色彩其明度上的差異,並且依照其明度強度將其重新排列如下:

如下圖左,由於黃色的明度很接近白色,因此在白色底色上使用黃色字體會使得字體難以閱讀。同樣的原因,雖然綠色與橘色 、紅色與紫色的色相並不相同,但由於他們的明度都很接近,因此在這樣的搭配上也會使得文字非常難以閱讀。

而右邊我們在相同底色上,選用與其完全不同明度色彩的文字顏色,閱讀性就提高許多。

現在你知道為什麼色盲分析圖總是看起來這麼辛苦了吧?


Reference

  1. Photo by stefano manzini on Unsplash
Decill Chang
Decill Chang
Principal Designer
A しばいぬ lover.
divider
Related Posts
name

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

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

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

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

為使用者撒下「麵包屑」

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