初心者向けshellのつくりかたこうざ

　初心者向けshellのつくりかたこうざ。

「何か（仮）」シェルの作り方講座です。初心者向けです。もしかしたらこれほどの初心者はいないのでは？と思われるくらい初心者向けです。ここを見ても何一つ得られるものはないかも‥（滅）
あと私は画像を用意する環境がMacなので画面は皆Macのものですが気にせんで下さい。

つか、Winだと色々な開発用のツールとかあるみたいですね‥。ここで紹介しているのより簡単に色々出来そうです。私はメインマシンがMacなんでMac中心で作ってるけど、そういう人の方が少数なんだろうなあ‥
なんだかだんだんこのページの意義が無くなってきたような気がしたところで、目次にゴー

●まず絵を用意します

●マスクの作り方／１（やり方が分かってる人は飛ばしてよし）

●マスクの作り方／２（やり方が分かってる人は飛ばしてよし）

●PNG形式で画像を保存

○以下は削除（情報古化のため）

●まず絵を用意します。
今回は一番簡単なシェルの作り方ということで、さくら（本体）側、うにゅう（相棒）側、ともにサーフェスが１枚づつのものを作ってみます。

今回用意した。見本用のえ

DS9のベンジャミン・シスコ司令官とキラ・ネリス副司令です。
原画はのもとさん
つーか去年の冬コミのうちのスタトレ本の表紙の絵だにゃ

サーフェスは本体・うにゅう側ともに最低1枚づつ、「00」と「10」さえ用意されていれば、絵が用意されてない表情は素のサーフェスで代替えしてくれます。
普通は複数の表情のサーフェスを用意します。

こういった種類のものを用意するのが一般的です。

00 素
01 照れ
02 驚き
03 不安
04 落ち込み
05 微笑み
06 目閉じ
07 怒り
08 冷笑
20 つくり看板
25 歌

10 素
11 刮目
19 歌

サーフェスは最大2048種定義できます。詳しくは本家の仕様を御覧下さい。

●マスクの作り方／１
　ここではPhotoshopを使用しますが、最終的に同じ仕上がりになれば何でもいいと思います。

その１：普通のマスク
絵	解説	拡大図
	その１-１原画です。こんな感じになってます。
	その１-２こういうマスクをつけます。マスクは最終的には白黒２値になります。境界線の混色を自分でコントロールするためには、計画的に２値化する必要があります。とりあえず、ここでは原画の主線にそって作ったマスクを、２値化してみました。
	その１-３その１-１の絵に対して、その１-２で作った選択範囲を選択して、選択範囲をマスク色で抜いたところ。「何か（仮）」は左上隅の色がマスク用の色と認識されます。抜きたい所はそこと同じ色で塗りつぶしましょう。くれぐれも本体で使っているような色をマスク用に選ばないようにしましょう。
	その１-４デスクトップに配置すると、こんな感じに出ます。どこかで見たような壁紙ですが、気にしないで下さい。
その２：白縁のマスク
絵	解説	拡大図
	その２-１絵とマスクの境界線を目立たせたい…そういう場合は絵の周りに白い縁を作ってみましょう（原画は同じものです）。
	その２-２こういうマスクをつけます。その１-２のマスクに比べて本の少し大きくなってます。Photoshopの場合、メニューの「フィルタ」→「その他」→「明るさの最小値／最大値」あたりで、マスクを太らせたり痩せさせたり出来ます。どれくらい太らせ／痩せさせたらいいかは自分で色々試してみましょう。
	その２-３その２-１の絵に対して、その２-２で作った選択範囲を選択して、選択範囲をマスク色で抜いたところ。マスクを変えたことで、白縁が出来ているのが見えます。
	その２-４デスクトップに配置すると、こんな感じに出ます。白っぽい壁紙だといいんですが、濃い色の壁紙だとちょっとギザギザ見えますね。白背景での使用を前提に作られた絵と言えましょう。
その３：輪郭線のマスク
絵	解説	拡大図
	その３-１絵の輪郭を太くします。これは例の「明るさの最小値／最大値」やチャンネルやレイヤーやらで色々やって太らせました。原画の段階で太くしておくのも手です。ポイントとしてはやや太らせ過ぎにしておくこと。後で減ります。
	その３-２実はこのマスクはその２-２のと同じものです。その３-１で太らせた輪郭線と密接な関係があります。３-１の輪郭線がこのマスク内に収まっていないと、間に白（もしくはその作画作業中の背景色）が入ります。（そういうのを作りたい場合はそれでもいいですが…）
	その３-３その１の絵に対して、その３で作った選択範囲を選択して、選択範囲をマスク色で抜いたところ。輪郭を太くしたことで、縁が出来ているのが分かります。また、その３-１の絵に比べると輪郭線が細くなってるのが分かります。
	その３-４デスクトップに配置すると、こんな感じに出ます。輪郭に何色を使ったかで、どの背景色と馴染むかというのがあるものの、基本的には白い背景においても黒い背景においても、同じように輪郭が出ます。ギザギザしたジャギが目立つという問題は、モニタの解像度が上がれば上がる程気にならなくなります。

で、まあ結局どれが「好みか」って問題なんですが
その１：普通のマスク	その２：白縁のマスク	その３：輪郭線のマスク

その時の絵や気分に合わせてベターなものを選びましょう～。うちのシェルはロカはその３、イライザはその２で作ったんですが、ベンジャミンはその１で作ってみる事にします。本当は半透明マスクが出来ると、背景画像（壁紙）ともっと馴染むマスクが作れるのですが現行の仕様でほぼ不可能なのでこの話題はこれにて。でも華和梨のページのトップに幽霊みたいな半透明のシェルの画像、ありますね…）

●マスクの作り方／２
　なんだかんだ言って最後は手仕事です（まだ最後じゃないけど）。
　どうしても気になる所は手で１ドット単位で見て行くに限ります（面倒だけど）。

図解	解説
	その１マスクの作り方／１のその１-２の状態に持っていくための「２値化済マスク」を作るための更に細かい部分です。投げ縄ツール、自動選択ツール、チャンネルを作ってブラシツールで描画等、マスクを作る方法は沢山ありますが、好みのを選びましょう。また、最初からいきなり２値の状態で作るという手もあります。でもこのシェル、拡大版や縮小版を作る事もあるかもしれません。Macではスモールライトは使えませんし、ココは１つ、色々とサイズを変えても使えそうなマスクを作っておきましょう。そしてそれを２値化。この場合はメニューから「イメージ」→「色調補正」→「２階調化...」を選びます。しきい値を入力する画面に移動しますので、今回は160あたりを入れておきましょう。この値はもちろん絵や画像によってベターな数値が異なります。どれくらいが良いか分からない場合は色々やって試してみましょう。そのうち、試さなくてもやりたい作業にちょうど良い数値が分かるようになります。
	ところで大きなお世話と言われるかもしれませんが、２値化の作業をするときには元になったマスクはそのままにしておいて、２値化の作業はそれをコピーしたのを使った方が、やり直しが気軽に出来ていいですやね。 ←「アルファチャンネル」が元のマスク。「#5」がそれをコピーしたもの。

	でまあ最終的にはこういう具合に画像をめいっぱい拡大しては、直接見てうまくマスクになってるか確認します。どんなに目の良さを自認している人でも最低減100％かそれ以上の大きさで見ましょう（それより小さいと省略されるピクセルが出て来ます）。で、表示を「普通の画像」+「マスク」にしたり…
	「マスク」のみにしたり…
	「普通の画像」のみにしたり色々見比べながらマスクを鉛筆ツールで修正します。このとき「黒」か「白」以外の色は使用しないこと（せっかく２値化したのが元の木阿弥に…）例えばこの絵の例でいうと、ピアスの鎖部分は「２階調化...」で設定したしきい値では切れてしまっていたので、それを修正して繋がるようにしました。
	チャンネルで修正するよりレイヤーで修正した方がやりやすいという場合はその方がいいかも。この場合のポイントは修正で「マスク部分を削りたい」時は「消しゴムツール」を使うこと。消しゴムツールは鉛筆モードか四角モードで。「マスク部分を増やしたい」時は鉛筆ツールを使用。

●PNG形式で画像を保存
用意した画像にマスクをつけた状態で、PNG形式で保存をします。通信でやりとりするものなので軽い方がいいということで、フルカラーだった画像を256色にしておきましょう。
Photoshop4の減色機能はしおしおなのですが、ロカの絵よりのもとさんの手塗りで書かれたこれらの絵の方がしおしおな減色っぷりが目立たないようです。良かった。減色はしたくなければしなくてもいいようです（重くなるけど）

surface10.png （左）とsurface0.png（右）
という名前で保存します。

‥実は私、初めてシェルを作ったときかなり難儀したんですが。
そのためこういうページを作ってみたんですが。
‥世の中に私程初心者でうっかりものでパソコン知らずな人はいないような気分になってきました‥。つまりこんな自分を基準にHow toものを作ってもなあ‥という気持ち。

まあ、ないよりはマシってことで、置いておきます。

ところで‥このシェル実際出来上がってみると、多少マスクの作りが甘かったのか、色味の濃い壁紙が背景だとちょっと白いノイズが目立ちました。
私が白縁のマスクや輪郭線のマスクが好きな理由はここなんですけどね。
また、マスク作りの段階で勝負は決まってるようなものなのです！丁寧に作りましょう～。

実際に出来たシェルを見てみる
画面はMacのデスクトップですけど、気にせんで下さい。

モドル