#author("2022-11-24T10:10:57+09:00","","")
*目次 [#ebfa8e87]
#contentsx

*概要 [#b61aee2d]
画像加工をやったことがない人向けの内容です。~
必要最小限のことしか書いてないので、より綺麗に、手早く加工をしたいなら各自でお勉強を。

#style(class=redbox2){{
フェイスロード画像サイズが違うだけなので、~
基本的な内容は[[その他/フェイスロード/フェイスロード用画像作成手順]]とほとんど変わりません。
}}

**使うソフトの用意 [#p3c815a5]

フェイスロードと同様に、ここでも以下の二つのフリーソフトを使用します。~
必要に応じてURLより入手してください。

-JTrim(ジェイトリム)~
http://www.woodybells.com/jtrim.html
--元画像の切り抜き・減色に使用。~
(大概のグラフィックソフトでできるはずなので、慣れてるのがあればそれで。)


-ドット絵エディタ「EDGE」シリーズ~
http://takabosoft.com/edge
--アイコン規格にしてからの微調整に使用。


**スタイルロード仕様の確認 [#lb59eaa7]
-256色、サイズ272*272のbmp形式 or png形式の画像
-0,0,255の真っ青の画像は透過(透過させない設定も可能)
--png形式の場合、png上で透過指定している色は透明として表示される


**素材となる絵を調達 [#gd7d8a3d]
イメージ検索なり、元ネタの公式サイトを見るなりして探しましょう。~
~
サイズ272*272と、スタイルロードのおよそ5倍の大きさの解像度にするので、顔以外のパーツ(全身/半身)を含んだ画像が適しています。~
ただし、全身/半身を含めると当然顔部分は小さくなるので、スタイルロード同様に細いパーツが多いのは避けた方が良いでしょう。~
~
今回は下記サイトさまの画像を使わせていただきます。~
-モアイ部~
http://www.geocities.jp/moaibu0/

**サイズの調整(切り抜き&余白追加) [#l918e8bd]
アイコンにしたい部分をJTrimで切り抜きます。~
ウインドウ上部のアイコンがずらりと並んでるとこの真ん中行・一番左が切り抜きです。~
好きな部分を切り抜けばいいのですが、なるべく正方形に近い形で切り抜きをするのがオススメです。~
(272*272にサイズ変更したときに、縦横比がおかしくならないように。)~
~
#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl01.jpg,nolink);
~
正方形にするのが難しいサイズの画像の場合は、「余白作成」で縦or横に余白を追加し、正方形にしておきましょう。~
(「余白作成」は「切り抜き」の少し右にあるボタンで行う)~
#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl02.jpg,nolink);

**リサイズ(272*272にする) [#g019bcab]
切り抜いたアイコンのサイズを272*272にします。~
切り抜きのとなりのアイコンを押下し、272*272にリサイズします。

#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl03.jpg,nolink);


二度目以降は「実行履歴:」からやると便利。


**減色 [#gcdf9a10]
見た目じゃ分からないのでよく飛ばしがち。~
ウィンドウの右上あたりにある「カラー」を押下し、「色解消度の変更」を選択し、画像を256色に減色します。~
見た目で差はわからないでしょうが、これをしないと(多分)エルミ2は画像を認識してくれません。~

#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl04.jpg,nolink);

**保存 [#g04785c6]
減色ができたら「名前をつけて保存」。~
この時点ではbmp形式で保存します。~
これでスタイルロード規格である「256色、サイズ272*272のbmp形式の画像」は用意できました。~
//この規格になっていたら、ファイルサイズが3,382バイトになっているはずです。~
背景透過いらないならこの時点でもう完成。

**背景いじり [#a4fe3cf0]

ここからedgeにバトンタッチ。edgeは256色ファイルしか読めないので、読めた時点で減色は成功してます。~
概ね手作業で塗ることになるので、前もってバックアップをとっておくと(失敗が)多い日も安心。~
~
カラーパレットを表示して、どうでもよさそうな色を一つ0,0,255の真っ青にします。~
(基本的に右下あたりの色を選択するのがベター)~
これが透過色になるので、「エルミ2での使用時に透明になってほしい部分(≒四隅や周辺)」をこの色でポチポチと塗ります。~
~
#ref(その他/フェイスロード/フェイスロード用画像作成手順/smp_4.JPG,nolink);


ウィンドウ上の方のたくさん並んでるアイコンの左から3番目を押して、適当にズームしてポチポチ。~
#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl06.jpg,nolink);

透過色の青だけで見てるとどうしても青っぽい部分が目に馴染んでしまうので、たまにドギツい緑や紫や赤などに透過色部分を変えるとベター。~
背景色をコロコロと変えてみると「消すべきドット」が見えてきます。~
~
最後には透過部分を青に戻してから保存。~



#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl07.jpg,nolink);

**完成 [#gff13883]
以上の工程を経てやっと完成。~
#ref(その他/フェイスロード/スタイルロード用画像作成手順/smp_sl_09.PNG,nolink);

**確認 [#bad13e88]



↑TOP