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
resize_nitpick
Search
yoya
November 15, 2019
Technology
1
150
resize_nitpick
画像リサイズの重箱の隅を突く話 (前半)
yoya
November 15, 2019
Tweet
Share
More Decks by yoya
See All by yoya
ImageFluxBinary
yoya
2
2.7k
HEIF-kaisetsu
yoya
4
3.3k
go-thumber-imagick
yoya
1
170
chokaizomae
yoya
2
560
wildimagebinary
yoya
1
210
goimagicksyokai
yoya
2
1.1k
GoImagickThumbnail
yoya
0
1.5k
sushigazou
yoya
0
12k
twitterimgupload
yoya
0
370
Other Decks in Technology
See All in Technology
生成AI時代の開発組織・技術・プロセス 〜 ログラスの挑戦と考察 〜
itohiro73
1
350
データプラットフォーム技術におけるメダリオンアーキテクチャという考え方/DataPlatformWithMedallionArchitecture
smdmts
5
660
Geminiとv0による高速プロトタイピング
shinya337
0
160
AWS Summit Japan 2025 Community Stage - App workflow automation by AWS Step Functions
matsuihidetoshi
1
300
Snowflake Summit 2025全体振り返り / Snowflake Summit 2025 Overall Review
mtpooh
2
420
SalesforceArchitectGroupOsaka#20_CNX'25_Report
atomica7sei
0
250
BrainPadプログラミングコンテスト記念LT会2025_社内イベント&問題解説
brainpadpr
1
170
Oracle Audit Vault and Database Firewall 20 概要
oracle4engineer
PRO
3
1.7k
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
kkuv
1
340
急成長を支える基盤作り〜地道な改善からコツコツと〜 #cre_meetup
stefafafan
0
150
なぜ私はいま、ここにいるのか? #もがく中堅デザイナー #プロダクトデザイナー
bengo4com
0
1.2k
WordPressから ヘッドレスCMSへ! Storyblokへの移行プロセス
nyata
0
250
Featured
See All Featured
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
17
950
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
How STYLIGHT went responsive
nonsquared
100
5.6k
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Fireside Chat
paigeccino
37
3.5k
Designing Experiences People Love
moore
142
24k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
A designer walks into a library…
pauljervisheath
207
24k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Transcript
画像リサイズの重箱の 隅を突く話 (前半) 2019/11/15(⾦) “よや” <
[email protected]
>
⾃⼰紹介 • twitter.com/yoya • github.com/yoya • ImageMagick ウォッチャー(⾃称) • 画像リサイズのうんちく
(今回のネタ下) • https://qiita.com/yoya/items/95c37e02762431b1abf0
発表のきっかけ https://twitter.com/yoya/status/1192667961934278656
サムネール⽣成のうんちく(仮)から抜粋 • 画像リサイズ処理 • ⾊々 • アスペクト⽐ • メタデータ •
画像の回転 (orientation) • サムネール 画像 • GPS位置情報 • 撮影情報(カメラ型番や設定など • ⾊空間 ࠓίϨ
画像リサイズの処理⽅式 • 補間フィルタ • フィルタの種類 • セパラブルの順序 • フィルタのカーネル粒度 •
オフセット (コーナー合わせ) • エッジ処理 • 次回予定 • ビット深度 • ガンマ補正 • USM (unsharp mask) • パレット⾊保持 ࠓ͜͜·Ͱ
知る事のメリット • 任意の画像処理エンジンと厳密に⼀致させる処理が⾃作できる (かもしれない) • ⾃分の⽤途にあった改造ができる • 画像サービスの使ってる画像エンジンを推測できる • バージョンまである程度絞れる(かもしれない)
補間フィルタ • リサイズ結果が違う場合、⼤抵これが原因 • 拡⼤してできる隙間をどう埋めるか => 補間フィルタ ϐΫηϧΛ͛Δ 伱ؒΛຒΊΔ
補間フィルタ • 縮⼩の場合、どのように混ぜるか ϐΫηϧΛߥ͘͢Δ ࠞͥΔ
補間フィルタの種類 • よく使われるのは以下の4つ • NearestNeighbor • Bi-Linear • Bi-Cubic •
Catmul-Rom (B:0, C:1/2) • Mitchell (B:1/3, C:1/3) • Lanczos (Lobe:3,4) この辺は常識なので説明省略! https://en.wikipedia.org/wiki/Bicubic_interpolation
補間フィルタ (セパラブル) • 2次元のフィルタを縦と横で分けて処理できる
補間フィルタ (セパラブル) • 良いといっても、計算機誤差からの差異は⽣じる • 左が実験画像、真ん中は横=>縦の順。右は縦=>横の順、差分強調
補間フィルタ (セパラブル) • 横を先に処理して、次に縦 (Python-Pillow) • メモリは横の⽅が局所的アクセスできる • より縮⼩率の⾼い⽅を先に処理する (ImageMagick
5以降) • なるべく途中の画像が⼩さくなるように • 縦が広がる場合は横を先に処理する (ImageMagick 4以前) • アスペクト⽐で判断
補間フィルタ (カーネル粒度) • 補間フィルタのカーネル計算が重たいケースがある -BODPT ͳΜͯ ΊͬͪΌॏ͍ͨ ⼀度、計算した結果を LUT(lookup table)
に保存して、 これを元に畳み込み計算する
補間フィルタ (カーネル粒度) • ImageMagick では 0.01 刻みの LUT を持つ •
OpenCV はリサイズ後の画像サイズの LUT • FFmpeg swscale は dstW/srcW (+α) の LUT
補間フィルタ (オフセット) • ピクセルの広げ⽅にも種類がある ࠨ্߹Θͤ ਅΜத߹Θͤ ࢛۱߹Θͤ DPSOFS@BMJHOFE PGGTFU OBJWF
͍͍ͩͨίϨ
補間フィルタ (オフセット) • Pillow(PIL) の動きがバージョンで異なる • https://qiita.com/yoya/items/3b4a8080516259ece684 1JMMPXҎલ ݄ 1JMMPXҎ߱
݄
補間フィルタ (オフセット) • Pillow-3.3.3以前 Pillow-3.4.0以降
補間フィルタ (エッジの畳み込み) • Bi-Linearを含む⼤抵のフィルタは混ぜる範囲が画像の外を巻き 込む ࠞͥΔ
補間フィルタ (エッジの畳み込み) • ImageMagick, PIL(Pillow) • 画像の外を無視する • 画像の中だけで畳み込む •
畳み込みが中途半端 ը૾ ͷ֎ 255 0 0 x0.75 x0.75 *0.25 191/(0.75+0.75+0.25) =191 =0 =0 = 109 *0.25
補間フィルタ (エッジの畳み込み) • OpenCV • エッジの⾊が外に続く仮定 255 0 0 x0.75
x0.75 *0.25 =191 =0 =0 = 127 255 *0.25 =63 ը૾ ͷ֎ ͖ͬ͞ͷ ΑΓ ໌Δ͍ (63+191)/(0.25+0.75+0.75+0.25)
補間フィルタ (エッジの畳み込み) • 本来、画像の外側の仮定によってリサイズ結果を変えるべき &EHF3FQFBUFE 3FGMFDU NJSSPS 5JMJOH
まとめ • リサイズの実装アルゴリズムは選択肢が多くある • これらの組み合わせから、サムネール画像を⾒て処理に使った 画像エンジンを推測する事ができる。(かもしれない)
次回予告 • 次回予定 • ビット深度 • ガンマ補正 • USM (unsharp
mask) • パレット⾊保持