吹き出しをGIMPでやっちゃおう

◎　いくらか少し前になりますが、無料写真サイトのお二方に出てもらって　こんなのをやってみてたのです　この方法は画像にふきだしを使って、会話を進めていく様なやり方で　自分は以前にやってしまっていたので、その応用的な感覚で割合にスッと出来てしまいました。

 ◎　こー云う ひな型 を作っておいて、アトはセリフを入れていっただけ・・自分は写真でやりましたが、一般ではアイコンの使用が多いみたいですね

 

今回、ふきだし画像のひな型を載せておいてます

◎ ・・しかし、これで後から思案する事柄が出て来ました !! 　下のふきだし・・これは画像でして、これにアイコンなりセリフなんかを入れて行けば　この作業はペイ出来てしまいます　左右のモノを作っておいて、画像も左右反転などの操作などで済ませられるのです

これはダウンして、よければ使ってみて結構ですので・・　一応透過PNGデータになりますが、ちょっとふきだしをためしにやってみたい・・なんて時にはかなり、手軽だと思います !!

バックが白以外のふきだしは、作るのが手間？

 ◎ 自分が、アタマを捻り出したのは、ピンクだのベージュやグレーなんかを背景に使った場合です　テーマを替えたばかりの自分ですが、最近グレーのイカしたテーマを見てしまいました !! 　これをやるとなると、バックが白では不自然になってしまうので　ネットからそのブログのテーマをダウンしておき、画面のハードコピー等をしておいて色を採取し　それに合わせたモノをやっておかなくてはなりません

今迄の自分のブログはバックが毎回・白でして、白の場合はどんな色でもマッチしてくれるので何とかなっていましたが　今回の様にバックがグレーのテーマが気に入った・・なんて場合には、見出しや目次の色等も考える必要が出てきたりします・・カスタムの記事がいくらか "はてな" にも載っていますが、背景が白のモノがやはり多い様です　で、今回はベージュのふきだしも作ってみました　

他の方の場所へ行ってみると、意外にベージュがバックのテーマを使用して居る方がおられたりするからですが　これもよければダウン出来ますので、気に入った方はどうぞ・・になります

◎　黒のモノも作っておいてみてます・・バックが黒だと、見出しなんかでは不利そう？　自分が気に入ったグレーのモノなんかも、リンク時にマウス・オーバーでのブルー方面は　あまりイイ雰囲気はしませんし、カスタマイズは色の部分で悩まされますね ？　一種の着こなし感覚が要求される様で・・一応これもダウンが出来ますので、気に入ったらどうぞ・・に、なります

◎ ・・で、自分が気になったテーマ・・試しに自分のブログを表示させてみてます　うーん落ち着いていていいですね　涎モノのフィーリング・・泣けます !!　右クリックでページ保存したこのデータ　ここいらから、ちょっと新しい方へ向けてウンチク行きます・・

と、ウィンドウズXPでの場合ですが、パソコンに表示させて居る　この状態が欲しい場合はキーボードの、右の上あたりにあるPrint-Screenキーを押してやってます　開いた画面で全画面＝自分の場合解像度1920X1200あたり・・のモノが欲しい場合はこれでOK　これがブラウザの画面だけ・・なんて場合はこれにALTをプラスしてやってますので・・

 ◎　 で、GIMPに取り込んで色の採取をしたいので、まず、切欠きツールで切欠き・・トリミングからいきます

 ◎　こんなカンジで囲っておいて・・今回は選択範囲が、かなりに小さ目 !! 　しかし？これ位で充分ですから・・

 ◎　これで切欠きの予備モードに入りました

◎　横幅・・あとで見てみたら36ピクセルあたり？　これでOKです

 ◎　あとは名前を付けてエクスポートでOK・・ Bakと云うデ－タ名でPNG保存しておきました

◎ 今回、このグレーのテーマに合わせて、やってみてるのがこの画像？

 白バック以外のブログでやるのは初めてなんで、今回作った画像でこのテーマに置いてみましたが・・出来ました !!  いやー泣けてきましたね、シビれた？

 ◎　事のついでだから、黒のヤツも試す・・一応こんな雰囲気 !!　これも出来たのですね。黒の背景をやってる人が見てくれてるといいんだけどなぁ・・・。

話し手を作って行きます

◎　長くなりましたが、ここから製作部分の事柄に入っていきます　・・で、今回は、「自分で絵を描いちゃおうかなぁ？」と、考えたんですけど　「オメーのクソみたいな絵なんか見てると胸クソ悪くなるから、勘弁してくれよ !! 」なんて事になったら、3ケ月から半年位は立ち直れなくなるので　すっぱりヤメました !!　

最近は鏡もあまり見ない様にしてるから、おかげで精神衛生的にも落ち着いてるし 「画像も有るでよ～」 と、すぐに楽な方へアタマが行ってしまのは　ボケの予防には逆にイケないんでしょうけど ？ 暑さとコウヤトウフと竹の子＆鶏肉・・も、苦手なんだよなぁ？ ワシ・・

・・で、こないだの本所は松坂町の吉良邸へニューヨークならぬ、入浴をしに知床から来たサルちゃんと　キツネちゃんに頼むコトに・・の今回です　キツネがイヤ !! だなんてぬかしたら、つねってつくねにでもしちまえばイイんだろうけど　サルの場合は、去る者は追わず・・

なんて言葉も有るので　あまり無理は言えませんが　豚もおだてりゃ樹に登る？ なんてのも有るので、この際はテキトーにおだてて　やらせるだけです !!

◎　アホな独り言をやりながら、画像を銀ちゃんへ読み込みしました

 ◎　今回、自分にはめずらしく ？ 円形選択ツールを選んでやるコトに・・・

 ◎　「パスなんか面倒で鬱陶しいから、オメー1人でどっかでスキにやってろよ !! 」 なんて意見もあるかもしれませんし、またいくらか暑さが戻って来て疲れてるので　今回だけ？ に限り、円形選択ツールなのですが、実は週刊実話で　あまり得意でないんですよねコレ・・　　で、これの正円のやり方は、わずかに少しドラッグし・・

◎　そこからSHIFTキーを左手で加えてます・・ここいらはGIMPはいくらか癖が有りますね

◎　「場所がイマイチで日光の手前じゃん・・？ 」 なんて感じた時は、ツール・ボックスから移動のツールにして　ツール・オプションの赤い四角枠で調整がバッチリ !! 

◎　・・が、これはやり終わったら、一番左のレィヤーの部分にきちんと戻しておかないと慌てます　免許証や財布、又は定期等と同じの様で忘れると、かなり大変 !!　悩まされた過去のある事柄です

 ◎　いくらかまぁまぁに囲めましたので、ここでコピーをやり、貼り付けをしました　　風呂に入ってるから、フローティング選択範囲・・なんてGIMPが冗談かましながらに、操作を難しくさせてくれますが　矢印のアイコンをクリックで切り抜けてます

◎　貼り付けられたレィヤーになれば、OK牧場で一安心 !!　ワイアット・アープとドク・ホリディが、クラントン一家を何とか無事にやっつけてくれた様であんころ餅

◎　そしたら次はキツネちゃんをやるので、レィヤーを戻しておきました 

 ◎　さっきと同じことを繰り返しやってます

◎　レィヤーのツールは現在、こんなカンジになってますが・・ 

◎　ちよっと一番下のレィヤーの目を閉じて、の作業になります・・

 ◎　レィヤーを忙しく行ったり来たりしてます

 ◎　移動ツールが登場するのが、2分あたり遅れましたが　先程から、これでしのごのやってます　

 ◎　で、このツールをやりながら、上の目盛の数字の部分をドラッグで　補助線を出しておいてます

 ◎　この補助の線に画像を持って行くと、吸着と云うのか ？ スナップと云うのか　くっついてくれますので、作業がラク　ここで仕上げに画像を切り欠くコトにします

◎　こんなカンジで切り欠きをしておいてから・・ 

◎　個々に画像を分けたいので、まず、キツネちゃんから・・ついでに筆のツールとスポイトを使用し、マウス操作で下手ながらに　拡大しながら後ろの青緑っぽいのも塗ってしまいました 

 ◎　これでキツネ01・・なんてデータ名でPNG保存をしておいてます

 ◎　GIMPにはヒストリー機能ツールがあるので、10いくつ？あたり前の操作に戻し　この場面迄、アンドゥさせました　このヒストリーはかなり強力で、ずいぶんと操作を前迄戻せますので　重宝しています !!　

◎　今度はサルちゃんを・・何だか床屋をやってもらってる様な表情なんでおかしいです 

◎　この画像も後ろを筆で塗ったり・・をやってました 

 ◎　そろそろラスト・・ツール・ボックスの拡大・縮小より、こう云う時にはこっちの出番　数字でやりたいですし、フキダシのサイズが決まってるのでそれに合う値が欲しいからです

◎　赤丸の場所と下の値が1ピクセルしか違わないので、ホッ・・です 

 ◎　上に99と打ち込んで、そのまま下にカーソルを持って行くと　自動で値をやってくれます

 ◎　何とかサマになったので、サル01なんてデータ名でPING保存・・あとは先程のキツネちゃんのデータも縮小をしておきました

フキダシを作りまーす !! 

 ◎　この白地に線をやっておいた画像をGIMPに読み込みます

◎　バックのこの模様が見える状態・・透過PNGの証明の様です

 ◎　そうしてから、レィヤーのツールから　赤い矢印の部分をクリックしまして、新しいレィヤーを作ってます　読み込んだ画像がある場合は、それと同じサイズが自動的に出ます !!
これを2回ほどやりまして、レィヤーを2つ作ってます

 ◎　今回はバックが白でないモノをやりたいので　枠の中は白、バックはグレーだのベージュ、黒なんかもやったりしてましたが　バック用と枠の中の色付け作業の為のモノになります

レィヤーツールは現在、こんカンジ　ツール・ボックスから自動選択ツールを選んで、早速行ってみます・・今回はいくらか長い時間をやってますが、ここいらは上手く休憩を挟みながらご覧になってください・・是非とものお願いになりますので !!　で、狙いは一番下の　フキダシのレィヤーを自動選択ツールのマジック・ワンド・オンでクリックしました

 ◎　いくらか忙しいですが、ツール・ボックス下の色の部分の矢印アイコンで　色を白に替え、バケツ塗りツールに持ち替えてます・・レィヤーも真ん中のレィヤーに替えておいてます

◎　バケツで枠の中を白で塗りまして、CTRL+Dで選択解除をしました　もしくは画面上の選択から選択解除になります
 

◎　そうしたら、一番最初の項で　ネットから落として小さめに保存しておいた、グレーの画像をマウス・ドラッグでGIMPに放り込みました　Bakと云う名のPNG画像になります

 ◎　Bak-Pngのレィヤーになって居るのを確認してから、ツール・ボックスからスポイト・ツールで画像をクリックで色を取り込みました

 ◎　ツール・ボックス下の色を確認するとバッチリ　今度は塗りに入るので、忙しくバケツ塗りツールに持ち替えてます　さっきはレィヤーと描かれた場所のレィヤーを塗ったので、今回は一番上に有るレィヤーですが　このまま今回は続行で行ってみてます

 ◎　バシャっとグレーを塗りました・・当然、一番上のレィヤーなので下がまるきり見えなくなってしまいました !!

 ◎　そうしておいてから、レィヤー・ツールの一番下になっている　フキダシのレィヤーを一番上に持ってくれば　自分の思惑どおりのスタイルの完成・・Bak Pngのレィヤーはこの時点でお役御免なので、右の図のゴミ箱のアイコンで　消してしまってます

実際の話・・ここで下のレィヤーをすべて統合してしまい、レィヤー無しのモノにしてしまってもいい位 !! 　段階を追ってやってますが、ここでの段階はここいらでOKだからです

◎　これは、図ではやっていないので恐縮ですが　現在はレィヤー・ツールのふきだしのレィヤーに居る・・と、云うのを過程してやっています　Bak Pngを捨てたので、残っているレィヤーが3つ　現在、レィヤー・ツールの中で位置するのは一番上のふきだしの場所にいます 

 ◎　思い立ったので、ここでさっそく行動に出ます・・枠の線と、枠に合わせて白く塗ったパーツを一緒にしてしまってもイイだろう・・と、考えたからです　画面上のレィヤー・ツールから　下のレィヤーと統合をやる事にしました

◎　モノとして、ここいら部分は　もう、まとまってしまって居るので、別にGIMPの形式でなくても構わないので　PNGの型式で左側と、云うデータ名で保存をしておきましたが　これでひな型の一つが出来上がった訳です 

◎　レィヤーの統合をやっておいたので、残りのレィヤーは2つ・・現在、赤矢印で示して居るレィヤーは　ふきだしの線と白い塗をやったモノのパーツであり、下はグレーの塗りをしたバック的感覚のモノ・・ふきだしのレィヤーをここでまた、編集していきます 

 ◎　画面上のレィヤー・メニューから、変形を選んでます

 ◎　続いて出て来たメニューから、水平反転を・・

 ◎　これで、左右反転されたので、次の行動としては　先程作っておいた、キツネと猿のアイコンらしき画像を配置しておくこと・・これをやってしまえば、あとはセリフの文字入れだけになります

ここの操作・・いくらか重要部分です !!　キツネの画像をドラッグで放り込みましたが、この向きが気に入らなければ　左右反転させて別の展開に入れます !! パーツとして載せてますがこの方法と違い、キツネが向いて居るのを逆にしたモノもやったりして様子をみてます　ウラの部分の、お話しでした

 ◎　移動のツールで或る程度のバランスで、収めました・・ここでは述べて居ませんが、ここで一度保存してしまっていい位・・

◎　これでまた、パーツの一丁上がり・・てな雰囲気です 

 ◎　お話の進行上、字を入れて行きます　ツール・ボックスから、テキスト・ツール　そしてさっき、グレーを塗って居るので色を黒にしておいてます　ツール・オプションですが、はてなの自分のブログ・・テ－マを替えたら、字の大きさが変わってしまった様です？　それまでは17ポイントでしたが、一段小さくなってしまった雰囲気ですね　

サイズを16にして、赤い矢印の部分・・はてなでは行間がいくらか広い様ですので　目視の感覚でここいらに合わせてみてます　これも今回、初めてで今迄やって居なかった部分 !! はてなで自分なりに、閃きが来たり　新たな部分を見つけたりの毎日・・はてなさんに感謝 !!　みたいなのがいくらか芽生えたりです

 ◎　字の打ち込み操作・・これは別の章でさんざん述べてますので、そちらを見て下されば・・になります

 ◎　字が打ち込めたので、移動ツールにしてます　これで所定の位置におき、バランスを見てますが、ツール・オプションの四角枠で囲んである所は　重要部分ですので確認しといていただければ・・になります

 ◎　まるでキツネに化かされたみたいだ ？ の行では、出だしに空白を入れたりして　バランスを考慮してみてます

 ◎　PNG描き出しのエクスポートをして実際の画像で、また確認・・イイみたいです !!

これでブログに載せていっても、イイかもしれない？

 ◎　今の操作でサルちゃんも・・チョイで出来上がり・・先にやっておいたPNGデータをドラッグで放り込めば、いとも簡単に出来ますが　こう云った場合にレィヤーの機能を備えて居ないソフトでは、遅れをとり　後手に回ってしまいます !! 　他にも写真を扱うソフトはいくつかありますが、レィヤー機能がないソフトは、あまり自分ではやりません

 ◎　かなりの数のレィヤーになってしまってるでしょ・・？　絵の場合はパーツに分け、フォルダを作ってやってますが　これ位の数なら、まだ気楽なトコがいくらかあります

 ◎　サルちゃんもPNG描き出しをして様子をみておきました　これで、ここいらはOKの様です・・次の章では、出来た画像をまとめる項目をやってますが　これでブログに載せていってもOKかもですね？　行の間隔をゼロにしておいて載せる様な作りをしてきたし、番号を振って終了していい様な気もします

そうすれば、手間が一つ省けるからですし　とにかく今回は、ラクに簡単に出来るのを考えてますが　ここいらは臨機応変になってきます・・ただ、こう云うのは手品と一緒で、ちょっと一瞬見せる様な方法だと思ってますし、フキダシを自分がやるとしたら　せいぜい6つあたりまで・・延々と、続けると飽きられる気がしてます　ワンポイント的効果だと考えてますね

 ◎　ブログでやってみたら全然、問題なし・・!!

 やっとラストの貼り付け作業

◎　上で書いてるけど、ここの章は飛ばしちゃってもイイかも知れない？　今、出来たのをブログに貼ってもイケてしまうのだし・・ !!　で、段階的にパーツを作ってきましたが、ここではそれをまとめて貼り付ける作業になります　・・しかし？いや、今回は今迄で一番長いブログ・・画像だけでも70を超えてしまってるので、自分も大変だけど　見てる方も大変・・ !!　

もう、少しなので頑張って下さいね～　・・しかし、夜通しのライヴみたいな雰囲気だなコリャ ？ 拓郎とかぐや姫での嬬恋の時みたい？　画面にちょっとふきだしの画像が見えてますけど、新しい画像を作ってます

 ◎　自分の今度のテーマでは、画面コピーして文章の部分まで切欠きしてみたら　730ピクセルあたりだったので、最近は画像の横幅を730にしてます　先程作ったふきだしの縦方向は11ピクセルあたりなので　いくらか余裕をみてこの数字にしました

 ◎　バックをさっきのグレーの色にしておきました　で、新規画像がたちあがりました

 ◎　マウスのドラッグで、キツネとサルを放り込んでみました

 ◎　移動のツールにしてから、バランスを調整してます・・こう云う場合はまず、画像をクリックしておき　キーボードの矢印キーでやってます　これだと動きが一定してくれるので、安心して出来ますが　クリックしておいてからでないと、動いてくれません

 ◎　バランスを考えてやってOKの様です・・これでアトは切り欠くだけ !!　2つしかないんだから、縦幅を222ピクセルにしときゃ良かった・・なんて思ったのですが、出たトコ勝負みたいな事ばかりやってますね～やれやれ？

 ◎　で、・・こんな風に切欠きしました

 ◎　赤枠で囲んでますが、アトでセリフを書き直したくなった・・なんて場合はGIMP型式の保存の上の枠　これで、もう２度とやりたくない !!　と、思ったらPNG型式の下の枠を選べばイイと思います

 ◎　PNG型式で描き出しをして様子を見てます・・これで一応、今回はモノの出来上がり !!　最後に注意点になりますが、こう云う字を伴った画像を作成した場合　はてなではJPGはどうもイマイチ荒れてしまって居る感がある様なのです　GIFかPNGが望ましい様であり、JPGは注意が必要になって来ますので・・

 ◎　一応の参考として黒とベージュの色を、スポイト・ツールで採取したミニな画像ですが　載せておいてます　今回 ？ 役に立てばイイのですが・・で、お疲れさまでありました　ロングで大変でしたが　これでふきだしが出来る人が居れば・・を祈ります