---
tags: 'NCUGC'
---
# 美術分線課程-色彩學
> 2019.10.22
> 講師：東東
>
> [簡報連結](https://drive.google.com/open?id=1cuZdOf7yFvQjASZ9l5TnDA6-yhXuB9vg)

###### tags: `創遊`、`美術`

## <span class="rainbow">~ 膜拜大老 ~</span>

:::info
**>>快速連結**
[TOC]
:::
# 遊戲<span style="color:red">色彩學</span>

## 基礎色彩與光影
- Example01 《撐陽傘的女人》
- Example02
> 色彩繪製沒有鐵則
> 仰賴美感
> 但還是有基本功
> [name=東東]

- 顏色三大要素
- Hue - 色相
- Saturation - 飽和度
- Value - 明度(Brightness)
### 色<span style="color:red">相</span>
- 色相環
:::warning
EX:
其實在不同的色彩模型中
**對比色是不一樣的喔** <!-- TODO: bigger this-->
:::

### 飽和度
- 純不純 ~~這批很純~~

### 明<span style="color:red">度</span>

- 色相與飽和度影響明度
- 也有色相的變換歐

> HSV 的 V 不是單純的亮度
<!--TODO: add color-->
<span style="background:#d4d4d4">
<span style="color:yellow">黃</span>><span style="color:aqua">青</span>><span style="color:green">綠</span>><span style="color:purple">紫</span>><span style="color:red">紅</span>><span style="color:blue">藍</span>
</span>
> 飽和度越高，亮度越暗
>
> why 素描 --> 練光影

> 視桿細胞 > 視椎細胞
∴人眼對光影敏感度 > 色彩
> 光影錯 一下就會知道

### 光影
- example 光影球

- 亮部
- 高光
- 中間調(half tone)
- 明暗交接線(core shadow)
- 最暗的地方
- 暗部(black tone)
- Reflect Light
- 暗部不是全暗
> 任何物體都會反光
- 投影
- 接縫處
- 糊糊的線

> 反光不是亮部的，不能太亮

- 為什麽畫面會髒 之一
- 該亮的沒有亮
- 該暗的沒有暗
- 亮暗圖

- 來觀察傳統的圖之光影
- 眼窩shadow, 眼皮亮
- 臉頰的明暗交接線--物體轉折處
- 鼻子 --> 投影
- 閉塞--> 光進不去
- 光 --> 頭 -投影-> 脖子 --> 很深很深
- 學畫大魔王 -- 皺摺
- 找最深 -- 布與布交接的地方
- 光影 --> 材質
A little coaxing
> **先學結構 --> 正確光影 --> 色彩**

:::info
**TIPS 1**
不管起稿方式如何，只要遵守光影規則
就不會出太大的錯
彩色轉灰階檢查光影
*注意，灰階不是(R+G+B)/3*

**TIPS 2**
暗面減少細節
面對戲劇光的時候
要決定要**畫暗不畫亮** OR **畫亮不畫暗**

**TIPS 3**
大腦會騙你 呵呵
注意物體與環境的光線

**TIPS 4**
注意光影對比，讓畫面更生動
對比不夠，會看起來灰灰、扁扁的
:::

82PIGEON
666pigeon

逆光 --> 輪廓線

2.
畫闇不畫亮 example
Raiko
<!--TODO: find the source -->

畫亮不畫暗
黃光劍
hgjart
<!--TODO: find the source -->

3.
eg. 棋盤錯覺

- 固有色(local color)
藍色是色相亮度中最暗的
可以用藍色當陰影色
**以對比色當暗色**
artist:krenz cushart
以偏藍的顏色來表達深色
- 光衰減
- 照度平方反比定律 (<s>來算數學嘍～</s>
- 亮度(luminosity) ∝ 1/(距離distance^2)

**Tips
色彩深度調整曲線**
<!-- TODO: add the example img -->
## 基礎遊戲色彩
>大家都說現代遊戲是現代電影的延伸
>或許可以參考電影的用色方法
>電影色彩理論-顏色如何用
>almosttomovie
>顏色傳遞情緒
<!--TODO: to find the source-->

### 情緒(Emotion)
<span class="rainbow">嗑藥的七彩Boss(ฅ●ω●ฅ)</span>
- 情緒板(Mood board)
- 情緒關鍵字 -> 參考
- 可呈現圖像、色票、材質、環境光......etc.
> 找參考~~~
> 工具：pinterest
>
[pinterest-link](pinterest.com)
- 製作情緒板
- 定義關鍵字
- how? where?
- 歸檔 --> **Color Script**
- cs：≈情境當下的色系
- 團隊共享
- <span style="color:red">Color Script</span>
- 定義場境的顏色的感覺
- 能夠讓團員清楚情緒版
- 定明確，色相、飽和度、彩度

- 遊戲明度
- 如果遊戲有白天晚上差別，也會定調一個明確的明度

- 遊戲彩度
- 長時間：彩度低(∵眼睛會痛)
- 短時間：彩度高(為了吸睛)

- 配合遊戲風格，善用明度&彩度
- 使用對比抓住玩家目光
- e.g.
- 提示按鈕
- 回饋感
- 風格色彩eg
- 楓之谷2：高彩高明Q版
- 聖火-風花雪月 vs 巫師3：
- 低彩中明，日系人物vs歐美寫實
- p5：高彩高明日系
- cuphead: 懷舊美式卡通風->中彩中明
> 先定好風格在決定色彩把東西*蹦*出來
- 風格&色相eg
- Gris：紅綠顏色對比 -> 凸顯敵人的威脅感
- inside：黑環境->未知的恐懼
- 還願：打火機、陰暗處 -> 壓迫感
- 戰神：
- 白雪+紅光 -> 凸顯目標
- 大氣透視 -> 場景的廣闊
- 汪達與巨像: 逆光 -> 表達輪廓，未知感
- 效果1：品牌
- 主視覺
- eg 大紅大紫->柴油龐克(x): 真實的顏色是棕色🏾
- 效果2：機制
- e.g.《Hue》
- 遊戲敘事
- e.g.《Gris》: 顏色分章節、表情緒
> [買起來](https://store.steampowered.com/app/683320/GRIS/)
> ~~好像下星期萬聖節特賣吧~~
- 其他：
- 標識物：角色、敵人......
- 辨識物
> 玩遊戲時，除了分析遊戲機制
> 研究遊戲中色彩如何與機制、敘事互動
> 是理解遊戲色彩學的==不二法則==
***
> 也可以從其他視覺藝術中
> 發現更多的色彩組合，例如繪畫、電影
***
## 學習資源分享
### 想要學基本功
- Youtube
- Free~
- 抖抖村 <-- 優質
- Proko
- sinix design
- $$!
- Toung (Hahow線上課程)
- Krenz Artwork (K大)
- 實體書
- 光影與色彩
- 解剖學
- 醫用(x) 藝用(o)
- 書藝百科系列(三民出版)
> **HARD CORE**
- 素描的原點(Andrew Loomis)
- 透視的原點(o)
- 基礎透視入門

### 想要練風格

- Roos Draw
> 歐美卡通風格
- The JettryJet Show
> 歐美風格的日系
- ericanthonyj
> 繪畫心法
- jyundee
> 聲音好好聽～
> 歐美寫實
- 韓文(neoaca)
> 日韓風 + 寫實 (韓語，沒cc字幕)(<s>等你來加</s>)(<s>窩不會韓語</s>)
> 一些triky的東東. e.g. 如何畫翅膀
- Pin2D電繪狂
> 台港澳的一群人
> 佛心團體，佛心團體
- Palmie
> 偏日系風格

## Q&A

<!--stye codes below~-->
<style>
.rainbow
{
animation: Rainbow 0.7s infinite;
}
@keyframes Rainbow
{
0% {color: red }
25% {color: yellow}
50% {color: green }
75% {color: blue }
100% {color: red }
}
</style>