【アクア風】シルエット猫画像の作り方【GIMP編】
最終更新日: 2010年3月 6日 (土曜日) 12:53:25 PM
エドワード・ゴーリーは、猫を多頭飼いすると、3匹目までは個別に飼い主に懐くが、4匹以上になると徒党を組み始めるようになり、猫達との間に『種族間の壁』を感じるようになったと述懐しているが、果たしてその実態や如何にと、「猫の多頭飼い実況サイト」を探していたところ、Inagaki, M 様の「ねこな日記」に辿り着き、2年間ほど実態調査（生態観察？）を行ってみた。が、現在の所は飼い主を排斥するような行動が見られない為、徒党を組むのはゴーリーの偏愛故であるとの結論に帰着した。ところで、この「ねこな日記」には普段見ることの出来ないナイスポーズな猫達の写真が沢山あって、2年間収集したら膨大なコレクションとなってしまった為、GIMP の練習用素材として活用させて頂いていたら、まずまずのロゴを完成させることが出来たので、Inagaki, M 様に使用許諾を申し出たところ、ご快諾頂いた上に「ねこな日記」で当サイトのことをご紹介して下さった。感激の余り、ご紹介下さった日のニフィ嬢を元にアクアロゴの作り方解説ページを作成してしまった。（作成日: 2007年6月10日 (日曜日) 01:16:11 PM）
猫写真からシルエットを取り出す
| 1. 「ねこな日記」で当サイトをご紹介下さった日のニフィ嬢がとても愉快なポーズを取っていらしたので、この写真を元に、アイコンにも加工可能な画像を作成すべく、パスを使って猫の姿のみ切り抜く。 | |
| 2. パスを選択範囲に変え、色の付いたレイヤーを追加（今回は白）。シルエットを見て猫らしさが出ているかを確認する。短毛種の猫は、パスを綺麗に取りやすく、シルエットも美しい。 | |
| 3. 猫のシルエットを切り抜くときには、耳や鼻を強調した方が猫らしく見える為、パスを修正する。写真では何であるか分かっても、シルエットでは分かり辛いという箇所は、パスの大きさを変えたり、その部分をカットすることも必要になるので注意を要する。左図赤丸はパスのアイコン。 蛇足。サラ嬢の様な長毛種の美猫は、シルエットのみだと、顔から首にかけてのラインが綺麗に出ないことがある。実は、Contact Us で使用している画像の左側がサラ嬢なのだが、うまく切り抜くことができなかった為、短毛種の猫としてパスを作成してしまった（反省）。ふんわりした毛並みをうまく切り抜き、パスを整理することは今後の課題とする。 | |
| 4. 修正が終わったら、パスを選択範囲に変え、白で塗りつぶす。レイヤーの透明度を50％にして選択を解除。 | |
| 5. 猫らしさが際立つよう、前足、右後足、口元などに線画を追加。流れるようなラインを出すときは、パスを使って選択範囲を作成してから塗りつぶすとキレイに出る。また、細かい部分はブラシ等を用いて描くと良い。 黒背景で確認して、猫だと分かればシルエット加工は終了。保存しておく。 | |
| 6. 今回はアイコン化することも視野に入れているので、「画像／画像拡大縮小」で、横128px になるよう縮小して「別名で保存」した。 | |
| 7. 縮小されたニフィ嬢のシルエット。 | |
シルエットにアクア背景を合成する
| 8. Mac OS X 用のアイコンを作ることができるように、128×128px の新規画像を作成。 アクア画像とは、多くの書籍や解説サイトで紹介されている通り、光（ハイライト）と、光が当たった部分に生じる影と、透過光を表現したものである。従って、背景色レイヤーを1枚、光用の白色、影用の黒色グラデーションレイヤーの2枚、透過光用の任意色のグラデーションレイヤーをオーバーレイに指定した1枚があれば、それなりにアクアらしく見えることになる。 | |
| 9. 背景レイヤーを、上を黒、下をダークグリーンにしたグラデーションで塗りつぶす。同じ画像で複数のカラーバリエーションを持つアクア画像を作成する場合は、背景色レイヤーと黒色グラデーションレイヤーの2枚に分けると良い。 | |
| 10. 新規レイヤーを作成。明るい緑色を選び、下から上へグラデーションで塗りつぶす。レイヤーのモードを「オーバーレイ」に設定する。 | |
| 11. 『7. 縮小されたニフィ嬢のシルエット』をペースト。右後足の肉球部分が分かり辛いので一旦消去し、ブラシを用いて再度肉球のみ描き直す。 ニフィ嬢レイヤーの透明度を適宜調整 → 今回は70％。ついでにニフィ嬢を下方移動した。 | |
| 12. ニフィ嬢に影をつける。「Script-fu／影／ドロップシャドウ」を開き、左図の通り指定。 | |
| 13. 影が付いたニフィ嬢。 | |
| 14. 外枠を作成する。背景色が黒色の新規レイヤーを作成、名前を「waku」と名付ける。 「選択／選択領域の縮小」を選び、内側へ5px 縮小させ、消去する。 | |
| 15. 枠ができあがった状態。 | |
| 16. 枠にも影をつけるので、「waku」レイヤーを複製する。 「waku」レイヤーに「フィルタ／ぼかす／ガウシアンぼかし」でぼかし加工を行い、枠の影を作成する。今回は水平、垂直方向へ7px のぼかしが入るよう設定した。設定の詳細は下図を参照のこと。 | |
| 17. 光部分を作成する。枠レイヤーとニフィ嬢レイヤーとの間に新規レイヤーを作成。全てを選択し、「選択／選択領域の縮小」を選び、内側へ5px 縮小させた後、上から下にかけて白 → 透明のグラデーションで塗りつぶす。 | |
| 18. このままでも光が当たっているイメージになるのだが、ニフィ嬢を目立たせる為に光の輪郭を作成した。上下左右より内側へ5px と、x軸方向へ64px、y軸方向へ50px、65px のガイドを引き、左図のようにパスを作成。ガイドを引くのはパスを作りやすくする為。 | |
| 19. パスを選択範囲にしたら、「選択／反転」を選び、パスで囲んだ範囲以外を消去。レイヤーの透明度を適宜設定。当サイトでは光が強すぎないように透明度を70%に指定している。 | |
| 20. 文字を加えてみたり、透明度を変えてみたり、ニフィ嬢を動かしてみたりして、最終的なレイアウトを考える。アイコンとして加工する場合は、大きさを変えたときにどう見えるかが重要になってくるので、画面を拡大縮小して確認しつつレイアウトを考えると良い。 左は全レイヤーの図。 今回はニフィ嬢の画像のみをやや上へ移動し、「Niffy the Cat」という文字を下に配置してみた。文字はApple Chancery フォントを使用。文字色は白。下図は文字に指定した影の設定。 | |
| 21. GIMP 上の完成図(原寸)。 | |
| 22. 原本を xcf 形式で保存し、アイコン変換用に PNG でも保存しておく。 | |
| 23. 左は PNG で保存した画像。これを元に Icon Composer というソフトを用いてアイコンを作成することができる（らしい）。Win と Mac では作り方が変わってくるので解説は後日。 | |
| 旧ロゴ画像 | モデル | 日付 |
|---|---|---|
| ニフィ嬢 | 2006/06/07 | |
| ティッピ嬢 | 2006/01/23 | |
| ニフィ嬢 | 2006/03/07 | |
| ニフィ嬢 | 2006/01/14 | |
| 縞々嬢&カミー嬢 | 2006/04/07 | |
| 麦藁母＠立川公園様 | 2006/05/17 | |
| ティッピ嬢&サラ嬢 | 2006/05/09 | |
| キュー姐御 | 2006/01/31 |
