Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
cgunchiku
Search
yoya
November 13, 2015
Technology
220
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
cgunchiku
某社で好きな事喋ってよいと言われたので、光から順に話した時のスライド。ほとんどコピペだけど。
yoya
November 13, 2015
More Decks by yoya
See All by yoya
resize_nitpick
yoya
1
190
ImageFluxBinary
yoya
2
3k
HEIF-kaisetsu
yoya
4
3.6k
go-thumber-imagick
yoya
1
210
chokaizomae
yoya
2
620
wildimagebinary
yoya
1
230
goimagicksyokai
yoya
2
1.2k
GoImagickThumbnail
yoya
0
1.7k
sushigazou
yoya
0
12k
Other Decks in Technology
See All in Technology
Nav2、Nav3 ... はたまた自作?〜 作って理解する Nav3 の設計意図 〜 / Nav2, Nav3 ... or Build Your Own? — Understanding Nav3's design intent by building it from scratch
yanzm
0
260
作り直せるコードは迅速に 作り直せないDBは慎重に - AI時代のプロダクトエンジニアが「判断の不可逆性」で開発速度を変える話
kinosuke01
0
270
AIで開発は速くなったのに、なぜ現場は楽にならないのか 〜あなたの組織のボトルネックを突き止めるワークショップ〜
jacopen
1
270
Bet AI Day 2026丨Agentは、「金融」という巨大産業の何を変えられるのか
layerx
PRO
0
1.2k
多摩川(.dev)ランニング入門 / Tamagawa.dev#3
fujiwara3
3
390
omasushiというライブラリを作った
polidog
PRO
0
120
生成AIのテナント制御とシャドーMCP対策 | AIを"止めずに"、情報を守る
yukun
0
120
KPIだけでは評価できないプロダクトが考えるべき Evalsという第二の評価系 / Beyond KPIs: Evals as a Second Evaluation Framework for Products #PdEConf
aki_iinuma
4
3.7k
Amazon S3 Tablesに全部任せてみた結果——コンパクション/スナップショット管理は本当に手放せるか
shigeruoda
0
410
プロダクトエンジニアに必要な「いい感じ」に作る能力 〜たくさん作れる時代に、どこまで作るかの決め方〜
jnishime_dresscode
2
1.4k
【Oracle AI Spotlight ウェビナー】AWSか、Azureか、Google Cloudか。その議論にオラクルを含める意義。
oracle4engineer
PRO
2
240
[DroidKaigi 2026] Making UI specifications visible: Android UI development in the AI agent era supported by Compose Screenshot Testing and galleries
syarihu
0
600
Featured
See All Featured
Measuring & Analyzing Core Web Vitals
bluesmoon
9
990
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8.3k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
510
Leading Effective Engineering Teams in the AI Era
addyosmani
9
2.5k
Building Applications with DynamoDB
mza
96
7.2k
Amusing Abliteration
ianozsvald
1
290
AI Search: Where Are We & What Can We Do About It?
aleyda
0
7.9k
Bash Introduction
62gerente
615
220k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
230
sira's awesome portfolio website redesign presentation
elsirapls
0
410
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
250
Transcript
コンピュータ画像うんちく 2015/11/13 “よや”
[email protected]
自己紹介 • 公開プロフィール h4ps://osdn.jp/users/yoya/ • 職歴 – 富士通:
交換機、IP電話 – IIJ: CDN – i-‐revo(KONAMI系列): 携帯サイト – GREE: SNSアプリ(ゲーム、又は画像周辺) – リタイアして神奈川の片田舎に隠棲中
今日のお話 • デジタル画像のうんちく – 光とは – 視覚 – モニタ表示
– 座標系 – 色空間 – リサイズ補完
光は電磁波の一種 h4ps://www.sugatsune.co.jp/technology/illumi-‐l.php
???
発光 • 物体は温度に応じて電磁波(光)を出す – Jet engine aRerburner test with
DIY Gasturbine • h4ps://www.youtube.com/watch?v=WHEHMFbEH8I
光から温度を測る例 • 刀鍛冶は刀を水で冷やすタイミングを色で判 断した h4p://www.tenki.jp/suppl/yasukogoto/2015/11/08/7561.html
色温度 (モニタ設定のあれ) • 色の応じた電磁波スペクトル (太陽は6000K) h4p://www.thermo-‐lab.com/first/emi4ance/
分光スペクトル • 光の屈折率の違いにより分光できる h4ps://www.nippondenshoku.co.jp/web/japanese/colorstory/05_spectrum.htm
分光分布 • 光源により波長ごとの光の強さが違う h4p://y-‐ok.com/eye/eyesight/eyesight-‐2.html
視覚 (網膜と錐体) • ひとの五感のひとつ。視覚 • 目のセンサー h4p://www.me-‐kaiteki.com/eye-‐mechanism/eye-‐structure/visual-‐cell.html h4p://www.kiriya-‐chem.co.jp/q&a/q52.html
3種類の色しか見ていない • 錐体センサーは3つ (R, G, B) h4p://y-‐ok.com/eye/eyesight/eyesight-‐2.html
条件等色(メタメリズム) • 光のスペクトル分布が近くても R,G,B の錐体 センサーが同じ刺激なら、同じ色に見える h4p://www.konicaminolta.jp/instruments/knowledge/color/part2/08.html
色合成の基本 h4p://www.trickprint.com/trickprint/cmykrgb-‐color.html • 加法混色と減法混色 – 重ねると黒に近づく (インク方式) – 重ねると白に近づく h4p://www.ccs-‐inc.co.jp/s2_ps/s1/s_04/column/light_color/vol16.html
モニタ • 今時の人は RGB が並んでる事を知らない – 昔のモニタは普通にRGBの点が見えた h4p://torano-‐maki.net/capture/custom/monitor.html
R,G,B配列 • R,G,Bの配列で表現するのが自然 – (右側にあるように例外もある) h4ps://www.displaybank.com/_jpn/research/print_contents_m.html?cate=column&id=4228
座標の取り方の違い • 左上を (0, 0) として右下に x, y 展開
(0, 0) (0, 1) (0, 2) (0, 3) (0, 4) (1, 0) (1, 1) (1, 2) (1, 3) (1, 4) (2, 0) (2, 1) (2, 2) (2, 3) (2, 4) (3, 0) (3, 1) (3, 2) (3, 3) (3, 4) (4, 0) (4, 1) (4, 2) (4, 3) (4, 4) (0, 0) (5, 5)
座標の取り方の違い • (2,0) から (2,4)に線を引く (0, 0) (0, 1)
(0, 2) (0, 3) (0, 4) (1, 0) (1, 1) (1, 2) (1, 3) (1, 4) (2, 0) (2, 1) (2, 2) (2, 3) (2, 4) (3, 0) (3, 1) (3, 2) (3, 3) (3, 4) (4, 0) (4, 1) (4, 2) (4, 3) (4, 4) (0, 0) (5, 5) (2, 0) (2, 4)
HTML5 Canvas の例 • アンチエイリアスがかかって結果的にボケる – なので0.5足すというTipsが生まれてる
色空間 • 色は R,G,B の3軸で表現できるので3次元 h4ps://msdn.microsoR.com/ja-‐jp/library/windows/desktop/aa511283.aspx
ゲーテの色彩論 • 色相のはじめ h4ps://ja.wikipedia.org/wiki/色彩論
色票 • マンセル、PCCS h4p://www.toryo.or.jp/cgi-‐bin/SPCSS/search/resources/munsell.html h4p://www.wsj21.net/ghp/ghp0c_03.html
HSV, HSL (CSS でも使える) HSV(HSB), HSL の円錐 (カラーピッカーでお馴染 みの) h4p://www.kanazawa-‐net.ne.jp/~pmansato/wpf/wpf_custom_ColorPicker.htm
YCbCr • テレビ信号、動画、JPEG – 輝度が大事 h4ps://en.wikipedia.org/wiki/YCbCr
リサイズについて • 数が合わないので補完が必要 h4p://csharpimage.blog60.fc2.com/blog-‐entry-‐18.html
リサイズのアルゴリズム (少しだけ) • ImageMagick を例に – h4p://www.imagemagick.org/Usage/filter/ • BOX
• Bilinear • Lanczos, Mitchell
次回予告 • リサイズアルゴリズムの詳細 • 減色アルゴリズム諸々 • 印刷のインクと色合成 (高演色インク等)