跳到主要內容

色彩選擇困難?不會配色?

色彩選擇困難?不會配色?

設計模板(Template), Dashboard時沒有靈感整體搭配?
推薦我常用的獲取靈感的網站
這些網站的共同點就是利用大量隨機的產出衝擊你的視覺
你只需要記下色碼跟確認選擇的配色是否符合你的主題風格即可
ps. 如果是商用人士,請記得先詢問公司有沒有制式的VI(Visual Identity),避免自己畫蛇添足

1. Coolors 
透過隨機產生推薦的配色結果,讓你知道那些顏色適合一起搭配使用,在快速產生的多組配色中,也能激發靈感。進入網頁按下"Generate"之後,用空白鍵就能快速隨機切換不同配色 (就當作刷抖音看哪個顏色正點吧)
也能在"Explore"裡面頁面瀏覽他推薦的套裝顏色,或是利用標籤(tag)關鍵字來搜尋
出現一套(5款)色,也能夠針對個別色盤進行深淺微調或是鎖定特定色,然後讓其他繼續隨機替換。
Coolors首頁

Generate- 按空白鍵隨機替換

Explore- 一些隨機套裝推薦(含有tag搜尋

2. Color Hunt
網站雖然素,但是該有的功能也不少,也具備搜尋功能
可用關鍵字來找喜歡的風格配色,並且給自己喜歡的配色點讚
網站架構不複雜,但夠用了

送上一個彩蛋 uiGradients
如果喜歡玩漸層顏色的,可以多看這個網站內的配色選擇
看看别人怎麼玩漸層色彩


怎麼學配色?不用學啊,多看美的事物就好了!
還有一個秘密武器 Palette Cam (APP)
可以讀取你拍下的照片色碼
所以隨時外出有看到好的配色靈感,就拿起手機拍吧


留言

這個網誌中的熱門文章

圖表內有異常高的數值?你需要的是斷裂圖

斷裂圖?相信應該很多人都有碰過 如果數據內包含了過高的數值,偏偏又只有一些 這時候應該會想到小時候老師教的,畫座標軸的時候用兩條線劃過Y軸 但在Excel上,應該如何實作? 我們來一步步分解吧 A跟B完全影響了圖表閱讀 我們先來看你認為的原始數據 原始數據 接下來開始記一下口訣 柱子數值,柱子標籤,Y軸數值,Y軸標籤。各個擊破 Step1. 調整柱子長度 直接除上參數, 調到你認為合理好判斷的數值 直接使用After並且使用柱狀圖, 請注意(務必多拉一個空格,後面有用) 結果如下 柱子長度調整完畢 Step2. 調整Y軸 由於目前的實際數值(柱子)最大值是3000,所以實際上需要的座標軸應該是0~3500(假設500一跳),所以請依照實際的狀況,設計一個資料表如下方圖所示 (Scatter區域) 實際資料圖 Scatter裡面的區域就是即將替換成為新座標軸的資料區域 接下來 將Adjust KPI新增至圖表內, 並且調整為散佈圖 X軸的數值全數以0, Y軸數值則為0~3500 並且進入水平軸(X軸的設定) Axis option- On tick marks 結果如下圖 新增的散佈圖座標點 Step3. 修正Y軸座標 由於目前現況Y軸Excel預設最大值為4000,所以進入選單 將Y軸最大值調整為3500 ,與散佈圖的最大值相同 並且新增散佈圖的資料標籤,但是 標籤設定上取用Real Axis(橘色區域)的數值 ,結果如下圖 散佈圖的資料標籤已經足以取代原始的Y軸 Step4. 取代Y軸座標 移除原始的Y軸座標資料,將散佈圖的 資料標籤設定至左方 將 資料標籤底色填滿(顏色自選) ,就可以遮住橫線 並且將Bar的資料標籤內容選取為實際的KPI (500~35000, 實際資料圖的橘色區域) 結果如下 只差最後一步 Step5. 加入斷裂圖形 新增 平行四邊形並且加以旋轉 放入Bar中間,2500~25000之區段,就完成了 步驟有點多,但掌握了要點,剩下的一步一步拆解應該不難

瀑布圖的正統作法

瀑布圖 aka Water fall, 是一種在財務上常見或是分析事件造成盈虧的圖表 那麼最正統而且又能夠長久使用的自動化設計*應該怎麼做? *這邊指的自動化是指, 表格資料設計好之後, 無論之後怎麼要調整數據都不用在人工調整外觀等相關設定 首先來看看基礎資料 原始數據: 起始值500,並且經過五次事件(A-E) 開始繪製表格之前, 請先記住 所有的圖表都是基於資料排列的邏輯來繪製 所以。第一步反而應該是, 建置好你的資料排列 完整的資料排序以及步驟應該如下圖 繪製Waterfall所需的數據排列模式 真正會進入到圖表(Chart)的, 其實只有黑色框線的區域而已 1. 插入圖表 (將Before,After調整為Line Chart)  2.點選Before, After 新增 "up/down bar" 3. 進行格式修改: 隱藏Before,After的Line; 調整Up/Down Bar的顏色, 調整間距 4. 新增Error Bar (強化視覺對齊), 點選任一一個Up/Down Bar, 新增Error Bar 5. 刪除Y error bar, X error bar調整為No Cap, direction "Plus" (這是唯一需要的對齊線). 並且把Error amount固定數值 (對齊線的長短) 6. 由於你還會發現, Error bar的線還長於Up/Down bar一些, 原因在於: Up/Down Bar並沒有加入外邊框, 所以 點選 Up/Down Bar並且增加同色系的邊框線條顏色 即可 7. 新增數據(Add Series) , 將"Label position"數列加進圖表, 並且 選擇散佈圖(Scatter) , 將資料行內的數值放入Y軸數據 新增Scatter 數列(把 550 ~ -450的數字丟入Y軸) 完成後的樣子(順便增加數據標籤) 8. 替換數據標籤資料: 因為目前的數字標籤: 位置正確但是資料並不正確 , 所以我們必須把標籤資料進行替換, 對資料標籤 "按右鍵叫出選單", 選擇Value from Cell (並且