63
Colours

20150610卒研進捗LT (share)

Embed Size (px)

Citation preview

Page 1: 20150610卒研進捗LT (share)

Colours

Page 2: 20150610卒研進捗LT (share)

おことわり

色を扱います色盲色弱の方はごめんなさい

2

Page 3: 20150610卒研進捗LT (share)

me

Jun Kasamatsu mohemohe

mohemohe

週末に OSC Hokkaido いってきました

メモ取らずに終わりました

© 2014 Yamato Fujinaka 3

Page 4: 20150610卒研進捗LT (share)

まともな内容

4

Page 5: 20150610卒研進捗LT (share)

agenda

• 画像の要素

• 色の表現

• 色の扱い方

• 情報量

5

Page 6: 20150610卒研進捗LT (share)

画像の要素

画像 # とは

6

Page 7: 20150610卒研進捗LT (share)

7

Page 8: 20150610卒研進捗LT (share)

画像の要素

pic ・ ture*** / pɪktʃər / [語源は「 paint の過去分詞 ; 描かれたもの」] ( ( 形 ) picturesque ) [ 名 ] ( ( 複 ) ~ s / -z / )

1 [C] 絵 , 絵画 , 図 2 [C] 写真 ( (よりかたく) photograph)(→from[ 前 ] 3c [ 語法 ] )

3 [C] 〚通例単数形で〛(生き生きとした)描写4 [C] (テレビなどの)映像 , 画面 , 画像5 [C] 〚通例単数形で〛(心に残っている)鮮明な情景 , 光景 ; イメージ6 [C] 映画( [ ! ] 特に映画業界で用いる) ; (主に米)〚~ s 〛映画業界 ;

7 〚 the ~〛典型 , 見本 , … そのもの ; そっくりの人 [ 物 ]

8ウィズダム英和辞典

Page 9: 20150610卒研進捗LT (share)

画像の要素

pic ・ ture*** / pɪktʃər / [語源は「 paint の過去分詞 ; 描かれたもの」] ( ( 形 ) picturesque ) [ 名 ] ( ( 複 ) ~ s / -z / )

1 [C] 絵 , 絵画 , 図 2 [C] 写真 ( (よりかたく) photograph)(→from[ 前 ] 3c [ 語法 ] )

3 [C] 〚通例単数形で〛(生き生きとした)描写4 [C] (テレビなどの)映像 , 画面 , 画像5 [C] 〚通例単数形で〛(心に残っている)鮮明な情景 , 光景 ; イメージ6 [C] 映画( [ ! ] 特に映画業界で用いる) ; (主に米)〚~ s 〛映画業界 ;

7 〚 the ~〛典型 , 見本 , … そのもの ; そっくりの人 [ 物 ]

9ウィズダム英和辞典

Page 10: 20150610卒研進捗LT (share)

画像の要素

•大きさ

•被写体

•背景

•ピント

•構図

•色

10

Page 11: 20150610卒研進捗LT (share)

11

Page 12: 20150610卒研進捗LT (share)

画像の要素

•大きさ

•被写体

•背景

•ピント

•構図

•色

12

3200 x 1600 px

Page 13: 20150610卒研進捗LT (share)

画像の要素

•大きさ

•被写体

•背景

•ピント

•構図

•色

13

Page 14: 20150610卒研進捗LT (share)

画像の要素

•大きさ

•被写体

•背景

•ピント

•構図

•色

14

Page 15: 20150610卒研進捗LT (share)

画像の要素

•大きさ

•被写体

•背景

•ピント

•構図

•色

15

Page 16: 20150610卒研進捗LT (share)

色?

16

Page 17: 20150610卒研進捗LT (share)

色?

17

Page 18: 20150610卒研進捗LT (share)

18

Page 19: 20150610卒研進捗LT (share)

19

Page 20: 20150610卒研進捗LT (share)

20

Page 21: 20150610卒研進捗LT (share)

21

Page 22: 20150610卒研進捗LT (share)

22http://ja.wikipedia.org/wiki/%E8%99%B9

Page 23: 20150610卒研進捗LT (share)

5 色

6 色

7 色23

Page 24: 20150610卒研進捗LT (share)

24http://ja.wikipedia.org/wiki/%E8%89%B2

Page 25: 20150610卒研進捗LT (share)

25http://ja.wikipedia.org/wiki/%E8%89%B2

可視光

◀ 紫外線    赤外線 ▶   

Page 26: 20150610卒研進捗LT (share)

26http://ja.wikipedia.org/wiki/%E8%89%B2

可視光

Page 27: 20150610卒研進捗LT (share)

色の表現

連続した色を

どう表現するか27

Page 28: 20150610卒研進捗LT (share)

色の表現

RGB 色空間色を一意に表す座標空間

28

Page 29: 20150610卒研進捗LT (share)

29

Page 30: 20150610卒研進捗LT (share)

30

R : 255

G : 85

B : 170

Page 31: 20150610卒研進捗LT (share)

31

R : 255 FF

G : 85 55

B : 170 AA

Page 32: 20150610卒研進捗LT (share)

色の表現

32

256 段階

Page 33: 20150610卒研進捗LT (share)

色の表現

33

256 x 256 x 256

=

16777216

Page 34: 20150610卒研進捗LT (share)

色の表現

34

2^8 段階

Page 35: 20150610卒研進捗LT (share)

色の表現

35

8

Page 36: 20150610卒研進捗LT (share)

色とコンピューター

36

1 Byte = 8 bit処理系による

Page 37: 20150610卒研進捗LT (share)

色とコンピューター

37

1 Byte = R

1 Byte = G

1 Byte = B

Page 38: 20150610卒研進捗LT (share)

色とコンピューター

RGB 色空間色を一意に表す座標空間

38

Page 39: 20150610卒研進捗LT (share)

39http://ja.wikipedia.org/wiki/%E8%89%B2

加法混色投影

減法混色印刷

Page 40: 20150610卒研進捗LT (share)

40http://ja.wikipedia.org/wiki/%E8%89%B2

加法混色投影

減法混色印刷

Page 41: 20150610卒研進捗LT (share)

41

液晶

バックライト

Page 42: 20150610卒研進捗LT (share)

42

Page 43: 20150610卒研進捗LT (share)

色とコンピューター

43

Page 44: 20150610卒研進捗LT (share)

色とコンピューター

44

Page 45: 20150610卒研進捗LT (share)

色とコンピューター

45

Page 46: 20150610卒研進捗LT (share)

情報量

46

= 24 bit

= 3 Byte

Page 47: 20150610卒研進捗LT (share)

情報量

47

= 8 bit

= 1 Byte

Page 48: 20150610卒研進捗LT (share)

情報量

48

=

2.666666666666…

Page 49: 20150610卒研進捗LT (share)

情報量

49

3 2 3 bit

Page 50: 20150610卒研進捗LT (share)

情報量

50

8 x 4 x 8 = 256

Page 51: 20150610卒研進捗LT (share)

51

Page 52: 20150610卒研進捗LT (share)

52

Page 53: 20150610卒研進捗LT (share)

情報量

53

むりやり減らすと劣化

Page 54: 20150610卒研進捗LT (share)

情報量

54

錯覚を使う

Page 55: 20150610卒研進捗LT (share)

55

Page 56: 20150610卒研進捗LT (share)

情報量

56

ドットのパターンで

誤魔化す

Page 57: 20150610卒研進捗LT (share)

57

Page 58: 20150610卒研進捗LT (share)

58

Page 59: 20150610卒研進捗LT (share)

情報量

59

適切に誤魔化せば

情報量を落としても OK

Page 60: 20150610卒研進捗LT (share)

情報量

60

落とした情報量の

使い方

Page 61: 20150610卒研進捗LT (share)

情報量

61

demo

http://git.io/vIw7p

Page 62: 20150610卒研進捗LT (share)

情報量

62

demo

http://git.io/vIw7p

Page 63: 20150610卒研進捗LT (share)

agenda

• 画像の要素

• 色の表現

• 色の扱い方

• 情報量

63

demo

http://git.io/vIw7p