ホーム › Wiki › Image

Image

update create

Image Size

Likidsで使用する画像サイズは、Aspect Ratioの16:9を基準に考える。
最小単位を16として、
256,144 (16x16, 16x9)
その半分の 128,72 を最小として採用し、描画範囲をそれぞれ、
256x256, 128x128とする。

logical name size
thumb128 128,128
thumb256 256,256

4032x3024[4:3] - smart phoneを基準として、アスペクト比は保持したまま、
幅(width)を基準に揃える形とする。
※rawファイルは別途保持。

width height raw width x height formura
1024 768 4032x3024 768=3024*(1024/4032)
1024 1365 3024x4032 1365=4032*(1024/3024)
512 384 4032x3024 768=3024*(512/4032)

という形をとろうと思う。
thumb64や、他の基準幅は、必要になったら作成を考えよう。

課題

CNNで人の注目度（人の関心事）を学習させてた記事があったので、
CNNで作成した学習モデルで出した結果を中心に切り取る。
できそうだけど、、時間がなぁ～

メモ

忘れガチなので

  • 画像を縮小するとボケる 論理的に高解像度から縮小するとどうしても、少数が発生し明確にならない。
    オプションを指定する。

ImageMagick

convert -size 150x100 xc:#000000 after.jpg
convert -size 1242x2208 xc:white bg.png
convert -size 120x120 -background white -font /System/Library/Fonts/NewYork.ttf -pointsize 32 -fill black -gravity Center caption:"Dev" test.png
convert -size 120x120 -font /System/Library/Fonts/NewYork.ttf -fill red -pointsize 32 -gravity Center caption:"Dev" test.png
  • resize
convert -resize 128x128 src.png dst.png
  • resize square(正方形のwhite画像と合成) URL
convert appicon_120x120.png -resize 120x120 -size 120x120 xc:white +swap -gravity center -composite appicon_test.png
  • replace color(#000000 -> #FF0000)
mogrify -fill "#FF0000" -opaque "#000000" replacecolor.png

fuzz パラメータを入れると周辺を除去してくれる。 

mogrify -fill "#FF0000" -fuzz 50% -opaque "#000000" replacecolor.png
  • replace color(#FFFFFF -> transparent)
convert dev.png -transparent white dev_transparent.png
  • 合成
convert under.png top.png -gravity Center -compose over -composite after.png

※合成における注意 none, white などで作成したも画像は、Grayscaleになり、Grayscale + sRGB => Grayscaleになる

% convert -size 32x32 xc:white bg.png
% identify bg.png 
bg.png PNG 32x32 32x32+0+0 8-bit Grayscale Gray 2c 299B 0.010u 0:00.000
% convert -size 32x32 xc:white PNG24:bg.png
% identify bg.png                          
bg.png PNG 32x32 32x32+0+0 8-bit sRGB 329B 0.000u 0:00.000
  • 背景色透明で変換
convert -background none before.svg after.png
  • 文字の書き込み annotate [offset] [文字]
    offset: {+|-}tx{+|-}ty (ex +0+32)
convert icon.jpg -fill red -pointsize 160 -gravity South -annotate 0 "Dev" icon_dev.png
  • fuzz

favicon

convert appicon_ios_1024x1024.png -define icon:auto-resize favicon.ico

参照

切り取り

convert img_default_org.png -gravity center -crop 512x512+0+0 img_default_square.png

マージン拡張

convert tmp_app_logo.png -background #ffffff -gravity center -extent 347x347 app_logo.png
Updated: (JST)