為了幫助同學們找到問題的症結,我上網找了一個國外的網站,前提是大部分同學都沒有看過這個網站,然後出了這樣一道題:“下麵給大家三個被轉成灰度色彩模式的網站界麵,它們分別是網站的首頁和兩個二級頁麵,請大家根據網頁上給出的信息為設計出發點,分組在Photoshop裏進行網頁色彩還原。”
記得當時還著重強調了要注意網頁上給出的信息。下麵三張就是當時同學們做的色彩還原的三個界麵。希望讀者在看我後麵的講解之前也可以試著練習一下。
某國外兒童服飾電商網站首頁
某國外兒童服飾電商網站二級頁麵1
某國外兒童服飾電商網站二級頁麵2
從反饋作品和每個人其對自身作品的講解中可以明顯看到,配色的質量直接與解讀信息的能力對應:
(1)
這是兒童服飾的電商網站,所以配色方案要體現可愛、有童趣的特點。
有90% 的人能意識到這一點,所以隻有10% 的人使用了成人化的配色方案。
(2)
首頁中最重要的信息是sale,降價70%,要利用配色來突出降價促銷這個最重要的賣點。
有60% 的人將促銷信息運用醒目的色彩對比進行了強調,50%的人有意識地把促銷信息的配色從首頁延續到了二級頁麵2 中。但有些同學似乎忘記了色彩的重複能夠強化印象的規律,非常辛苦地在二級頁麵2 的促銷廣告配色中另起爐灶,結果事倍功半。
(3)Baby Girl 和Baby Boy 的界麵,應該用色彩去區分,讓用戶能夠借助色彩的引導更快更準確地找到自己需要的貨品。
有50% 的人意識到Baby Girl 和Baby Boy 的頁麵背景明度不同,可惜隻有30% 的人能夠仔細地看網頁中的文字,準確把握住兩個頁麵目標用戶的差別,並在色彩上有所區分,讓人一眼就看出是賣女孩服裝還是男孩服裝。
學生案例這裏就不展示了,下麵是該電商的原始配色方案。
某國外兒童服飾電商網站原始界麵
這種訓練的方法,不是要讓大家去臨摹原始網頁的配色方案,真正的目的是讓大家不是憑空想象,而是學會通過圖片、文字等其他信息來判斷配色的方向。很多人學習國外的作品,常常徒有其表,而沒有去研究人家所宣傳的產品、品牌等信息,這樣知其然不知其所以然的學習方法,往往理解不深刻,看似花了不少時間,但效率不高。所以大家平時可以多做這樣的色彩逆推練習,提升自己把握理解信息的能力,最終獲得配色能力實質性的提升。
好了,這次真的該合上電腦了,希望大家學習愉快!