Top
★Webコミ【蜉 蝣−かげろふ−】 とあるページが完成するまで

てことで
【刹那〜せつな〜】のWebコミックを
どんな風に作ってるのか、を
ちょいとだけ紹介することにしました

使用ソフトは、ComicStudio Pro 3 &Adobe Photoshop Elements 2

最初に断っておきますが、まったくの我流です
以前にCADソフトを使用したことがあるので
レイヤー分けにはうるさいかもしれません

こういうやり方もあるってことで参考にしていただければ幸い
質問等は受け付けておりませんのでご勘弁をm(__)m


(1)
コミック用B4原稿用紙に下書きしペンを入れ
スキャナーで取り込んだ時はこんな感じ

スキャナーで取り込む際に
原稿の白い部分を透明にしているので
これは線だけのレイヤーとなります
レイヤーとは一枚の透明なファイルと考えてください

竜平の周りのブツブツは、一応雨を描いたもの
結局後で消しましたけど

小さなゴミ等を消して絵をバランス良く配置します
…と言っても、絵がこれだけなので、勘、ですね

頭の中のイメージでは、竜平は木の葉の間から
雨の中、稲光を浴びて立っている
そんだけ、です
これからそれに近づけていくわけです

縦横の線は
雛形(コミックの基本ファイル)に入れている枠線です
それぞれレイヤーを分けてます

使用:ComicStudio Pro 3



(2)
なにが変わった?くらいの少ない枠線入れ(^_^;)
薄い枠線はコミスタの基本枠です

コミスタには枠線を入れるツールがありますが
えー、よーわかりまへんので
うちでは直線ツールで枠線を引いてます

雛形に入れている枠線(縦横4本)と
無地の縦線、横線、それぞれベクターレイヤーで作り
後で削って圧縮レイヤーにグループ化します

なぜ最初から原稿に枠線を入れて
スキャンしないのか?、と言えば

第一に、スキャナーがA4対応ですから
端の線がすべて切れてしまいます
(コミスタ画面はB4)

第二に、原稿の位置がずれたりして
縦線や横線が歪んでしまう場合があります

第三に、コミスタに取り込んでから枠線を入れた方が
枠内の塗りつぶし、そこだけトーンを貼りたい場合等に
そのコマだけを選択することが出来、便利なのです

使用:ComicStudio Pro 3



(2−2)
たとえば、このページだと
1と2が雛形の線を利用したもの

3と4の横線は
レイヤー毎コピーして上下に移動させてます
これらすべてレイヤーを分けた縦線横線です

で、このままではレイヤーがバラバラなので
レイヤーのグループ化をして、圧縮レイヤーを作り
それをさらにレイヤーの変換で「枠線」とします
その際、圧縮レイヤーは必ず残しておきます

なんでそんなことをするかと言えば
後になって、ここに枠線あった方がよかった、等の
追加変更が必要な場合に圧縮レイヤーの
グループを解除すれば、それぞれの枠線が
バラバラの状態に戻り、追加変更した線と合わせて
再び圧縮レイヤーを作れば、変更した枠線が
簡単に再生できるから、です

…簡単でもないか?

デジタル作業で一番気を付けるのは
なにか失敗してもある時点まで確実に戻れるよう
常にバックアップを取っておくことです

使用:ComicStudio Pro 3



(3)
コミスタのトーン等で効果を付けます

これがデジタルの良さ、ですね
なんぼでも貼ったり剥がしたり
消したり足したり試したりできまっせ♪

ただ、頭の中に完成画像がないと
それに近づける作業が出来ずに
どんどん深みにはまる可能性もあり、です

雷と雲、も、トーンです
冴子の顔にかぶっているのは流線
フォトショに移動すると上下が切れるので
顔にかぶる所まで入れてます
雷と雲もそうです
後で、ずらしゃええんですわ

大体のこんなもんかな、と言う
トーン入れが済んだら「データ書き出し」
「ピクセル指定で画像データの書き出し」をして
フォトショ用データを作ります
B4サイズそのままだとPCが動かないので
(データが巨大)
うちの場合は、50%にして書き出してます

次からはフォトショでの作業になります

使用:ComicStudio Pro 3



(3−2)
これは別に貼った稲妻トーン
これもフォトショに移動してから使用予定

使用:ComicStudio Pro 3



(4)
ここからフォトショに移動

書き出したデータを別名で保存します
と言うのは、またコミスタに戻って
トーンなどを追加してデータ書き出しをした場合に
誤って上書きするのを避けるためです
(…経験者は語る)

まず、冴子の表情などを細いブラシツールで強調

枠線はコピーを取った上で、必要ない部分を削ります
これだと上の横線ですね

トーンはレイヤー毎に表示させて(又はコピーして)
それぞれを消しゴムツールでぼかしたり削ったりします
この場合、竜平のトーンはいらんな、と消しました

雷と雲は、Ctrl+Enterで画像を選択し
別レイヤーの上にブラシツールで
ぼやぼやーと描いてます

雨もトーンの荒い縦線を画像選択して
とびとびに白で塗ります

使用:Adobe Photoshop Elements 2



(5)
とりあえず、枠線内を選択して黒く塗りつぶしました
枠線のコピーを残しておくのはこのためです

するとかぶった部分の冴子が真っ黒になるので
新たなレイヤーにブラシツールで白く塗り
冴子の姿を浮き出させます

流線をCtrl+Enterで画像を選択し
白で塗り、少々ずらします

使用:Adobe Photoshop Elements 2



(6)
コミスタトーンの木をフォトショ用に書き出したものを
テキトー(ほんまにこればっかなんですけど)に
拡大縮小して貼り付けます
冴子に木がかぶってしまうのでまた白で浮き出させます

これで竜平が消えてしまいました

使用:Adobe Photoshop Elements 2



(7)
竜平がいなくては、冴子の独り芝居になりますので
木のレイヤーの前に白で竜平を浮き出させます
さらに、その上から木を貼り付けます

木→竜平の白バック→木→冴子の白バック
となってます
トーンやキャラの線や流線等はそれより上ってことです
相当、データが重くなります…

使用:Adobe Photoshop Elements 2



(8)
少々影を付けて、冴子の表情に深みを付けます
眉の下や唇、指先など、です
びみょーに竜平のシャツにも影を入れてます

うちでは影は普通の黒を使用
レイヤーの不透明度を下げて入れてます

使用:Adobe Photoshop Elements 2



(9)
稲妻トーンをCtrl+Enterで画像を選択し
選択範囲を反転させて白で塗りつぶします
すると、稲妻の白い部分だけの画像ができます

後は、テキトーに画像の上に並べてみて
これ、と言うのを選び必要な部分以外を削除
拡大や縮小で加工して配置
冴子の頭のフラッシュと稲光はそうして作りました

竜平には新たなレイヤーに真っ黒い影を描きます
この方が稲光のメリハリがつく、てことです

ハイライトレイヤーを一番上に作り
竜平の髪の線などを白く塗って消します
これで稲光の中の竜平完成です

ハイライトレイヤーには
冴子の目の光や唇の艶なども描いてます

使用:Adobe Photoshop Elements 2



(10)
ここまで作って
あ、そういや窓から見てるんや、と思い
せめてガラスらしい雰囲気を見せないとな
てことで
斜めの線と白を入れてそれらしくしました

後で描き加えることができるのも
デジタルのおかげ
当然、別レイヤーです

窓枠はあえて描きませんでした
見せたい、強調したい、のは、冴子の表情なので

使用:Adobe Photoshop Elements 2

(11)
うちは、画像製作用と文字入れ用は、ファイルを別にしておりますので
(そのまま文字を入れると、とてつもなくデータが重くなる)

最後に、画像レイヤーを統合して、文字入れ用のファイルに移動して貼付
「ピカ」は、他のフキダシとのバランスを考えて、文字入れ用ファイル上で入れました
フキダシ、文字を入れて完成

文字が少なくて助かった…

で、下が完成形です

使用:Adobe Photoshop Elements 2


だいたい、こんな感じですね
順番通りに簡単に出来たわけではありませんけど

あーした方がいいかな、こーした方がいいかな、と
試行錯誤しながら、頭の中の絵に近づけていくわけです
手描きでこのページを描いてみろ、と言われても、無理、です

【やひろくんの家庭の事情】でも、行程は同じです
ただ、枠線はコミスタの4コマ用を使用するので描く必要はなし
その代わり、文字入れの後
派手なフォントの加工があったりするので手が掛かりますけど

なぜ、コミスタだけで作らないかと言えば
単純に最初フォトショしか持ってなかったから、てのもあるし
エアブラシやぼかし、絵に柔らかさを加えるには
フォトショの方が適していると思うからです

それに、やひろは特にそうですが
フォントの加工はフォトショに限るしねぇ

こういう風に作りなさい、とは、言いませんし言えません
それに、同じ作業をしても、同じ物が出来るはずもありません
それが個性ってもんです

気を付けないといけないのは
トーンや効果線をなんぼでも入れられますので
ヘタすると画面がうるさくなってしまうことですね

ほんとはもっと便利なソフトの使い方があるのではないか、と
思ってはいるのですが
とりあえず描けたらええやん、で作ってます

あれこれ考えて絵が出来上がらないよりは、さっさと先に進む
あきらめが肝心、てとこもありますね
デジタルだと無制限に手を加えることができるので

てことで、いかがでしたでしょうか?
なんかこうして見てみると、大変な作業してるような気がしてきたなぁ

以上が、とあるページが完成するまで、でした

2006年12月23日 きり@管理人

【刹那〜せつな〜】MEMO
★Webコミ【蜉 蝣−かげろふ−】 とあるページが完成するまで 2006.12
INDEX Top MEMO Top

当サイトの画像及び文章の無断転載はお断りします
もし、当サイトの絵が気に入ったとおっしゃる方は
無断使用せず、ぜひLINKをお申し出くださいませ
(C)setsunaai All rights reserved