網頁制作POLUOLUO文章簡介：從訂電影票淺議視覺等級中的色彩認知.
最近有一部由多位外籍華人參演的片子要上映了，我很想去看，想為GDP做點貢獻，於是我想到了網上訂票。在杭城的同學知道，大部分影院都是歸口於時代院線，訂票也大抵上要通過該網站來完成。盡管我最後未能完成網上訂票的夙願（按步驟走完，我才發現我必須擁有一張會員卡才能訂票，這又是另一個說來話長的故事了），但是我至少發現了一個有趣的、值得我寫下點什麼的地方。
於是我挑選了一個具有代表性的頁面截屏以紀念：
如果你也曾真正訪問過這個網站，你也許會有和我一樣的感受：在第一次訪問該頁面的時候，我實在不清楚這花花綠綠的顏色代表的意義，五色讓人目迷。
好吧，讓我們先來聊聊色彩。隨著不斷在社會中成長，我們逐漸對色彩形成完整的認知，有一些認知形成是天然的，比如紅色，因為我們的血液是紅色，紅色天然的代表了鮮血，引申為危險，還有綠色象征著生命，藍色象征著深遠等等；另一些則是基於地緣和文化的，比如還是紅色，在中國，紅色代表吉祥，黃色象征高貴。如果展開說，我就顯得有些班門弄斧了，所以就此打住。（《每天懂一點色彩心理學》是近期上市，並且讀起來很輕松的關於色彩方面的一本小書。）
回到訂票這件事情上，在我看到這些色彩後，我的第一反應是這些色彩是為了區分出些什麼，那麼是什麼呢？
時間？因為我知道，對於用戶而言，訂票只需要了解三件事情，電影名稱、場次和票價。電影名稱是顯而易見的，那麼是用來做場次的時間區分嗎？不是，我發現《樂火男孩》11：15的那一場是淡橙色，而緊接的《可愛的中國》11：40的那一場是淡紫色，再往下《氣喘吁吁》11：50是幾乎融入背景色中的深紫色……我想知道了，這些顏色代表的應該是價格了。
但是另一個問題又擺在我眼前——不同的顏色代表不同的價格，這些價格到底是什麼呢？在我將鼠標滾輪翻轉數圈後，我終於，終於的來到了頁面的底部，答案出現了：
如果我眼睛沒有大礙的話，上圖中應該出現了四種不同色度和明度的紫色，以及三種不同色度、明度以及色相的綠色，當然還有兩種偏米色的黃色。請原諒我無法用語言精確的描述每種顏色代表的價格，因為它們毫無規律——准確的說是，它們以一種毫無規律的色彩排列試圖告訴用戶票價的等差規律。
這讓我想起了我剛剛翻譯的《用戶界面設計10原則》，其中第四條將的是“運用視覺等級”，作者Kyle在文章中告誡設計者“清晰的層級關系將對降低外觀的復雜性起到重要作用”。我想，這個頁面的設計者一定想要通過色彩讓用戶了解到價格的區分，而且是可以“一目了然”的，當然結果不如願。在我看來，這僅僅是為了區分而區分，就像有些界面是為了圖形化而圖形化一樣。
如果我們想要告訴用戶，從最低票價到最高票價是可以通過色彩辨識的，那麼我們應當去尋找一種被人們普遍接受的色彩認知。那麼中國人對於等級區分的普遍色彩認知是怎樣的呢（原諒我拋棄了國外用戶）？
一 用什麼色彩
比如，白，雖然本義象征著純潔、無邪，但是在等級中，因為我們常常用白丁、白衣來形容平民，白色在我們的文化環境下代表的是比較低的等級，和便宜掛鉤。那麼類似的，我們可以明白為什麼黃色代表著高貴了。但我們要注意的，又不能是嫩黃，那只能是黃口小兒的象征，因此色彩的飽和度也是重要一環，白色和黑色給人帶來的厚重感完全兩樣，一個從白色到黑色的完美漸變可以很好的反映出視覺等級的變化，但是我們需要色彩。
二 用多少色彩
那麼我們要用多少色彩呢？向上面頁面那樣用到三大色系，九種顏色麼？這幾乎是George A. Miller提出的7±2效應的上限。除非是雨人，否則大部分用戶只能在短時間內記住7個左右的信息，更何況這7種顏色是多麼的抽象，多麼的……難記。（感興趣的同學，可以點擊這張圖片，然後關掉）
換句話說，具體到這個例子，當你有九種價位的電影票，試圖用色彩來做等級區分和讓用戶做記憶力測試沒什麼區別。如果你剛才點開了那張意大利國旗的圖片，你還能第一時間記起它的綠色是下圖中的哪一種嗎？
說老實話，時代院線的訂票頁面我也反復上過數十次了，但是我至今也不記得到底是綠色的票便宜還是紫色的票便宜。因為我最終買到的票都是粉紅色的。
關於如何改進，展開來又是長長一段了，如果是我，我也許會取消色彩區分，轉用數據表的形式，但是BOSS也許會覺得頁面不夠炫（就國情而言，100條設計原則敵不過BOSS一句話）；也許我會考慮網站上的色彩和實際票面印刷對應，長久讓用戶形成色彩的對應關系，比如黑色的信用卡一般都是等級較高的，但是BOSS也許會覺得這樣增加成本了吧:-D
方法會有很多，就看你的了……