Column
コラム

マンガ風にアレンジ!Photoshopのアドオン「Comic Kit」の使い方(CC2015版)

  • Twitterでシェア
  • このエントリーをはてなブックマークに追加
  • Google+でシェア
  • follow us in feedly
マンガ風にアレンジ!Photoshopのアドオン「Comic Kit」の使い方(CC2015版)

マンガでの表現手法として、スクリーントーンやスピード線や集中線などの効果線と呼ばれるものを簡単に作り出せるアドオンがあるということで、結構前にPhotoshopにインストールしていたのですが、なかなか使う機会がなかったので紹介します。

まずはインストール

001

Photoshopを立ち上げて
メニュー > ヘルプ > アドオンを参照
を選びます。



002

するとブラウザが立ち上がり、「Adobe Add-ons」のページが開きます。
ここではいろんなアドオンを入手できます。Photoshopに限らずAdobe製品であれば。
「注目のAdd-on」に表示されているかもしれませんが、表示されていない場合はサイト内検索に「Comic Kit」と入力してください。
検索結果に「Comic Kit」が表示されるのでクリックしてください。



003

製品情報を確認すると…
・マンガに素早くスクリーンパターン、集中線、スピード線を追加
・高度にカスタムができる
・グラデーション、砂目、チェックなどのパターンも描ける

などと書いているかと思います。(推定)

直接ブラウザから開いても結構です。
https://creative.adobe.com/addons/products/13159

「インストール」とか「無料」とか書いてあるボタンをクリックするとインストールは完了します。
それでは早速使ってみましょう!

下準備 加工を行うイラストを用意する

とりあえずマンガを書くという想定で、こんなイラストを用意しました。

019

下記のページより拝借しております。


004

アクトゼロ 【商用フリー】ホラー漫画風イラスト【デザインにも資料制作にも!】
http://www.actzero.jp/developer/report-8159.html


005

擬音祭り
https://www.gion-matsuri.net/

効果線を入れてみる

006

まず、背景に集中線を入れようと思います。
集中線を入れたいレイヤーを
メニュー > レイヤー > 新規 > レイヤー
で作成します。


018

次にペンツールで集中線の中心と長さを指定します。
始点が中心で、終点までが集中線の長さって感じですかね。


007

ここまで準備ができたら、
メニュー > 編集 > 塗りつぶし
を選択します。


008

塗りつぶしメニューから
1.内容で「パターン」を選択
2.オプションのスクリプトにチェックを入れる
3.「Speed_Lines_ex」を選択し、「OK」をクリックします。


009

すると集中線のパラメータが表示されるので、これで線の太さなどがカスタムできるようです。

  • 【Line Type】
    集中線かスピード線かを選択

  • 【Line Width Type】
    効果線の種類

  • 【Line Width】
    線の太さ

  • 【Width Random】
    線の太さのランダム度合い

  • 【Spacing】
    線と線の隙間

  • 【Spacing Random】
    隙間のランダム度合い

  • 【Speed Line Range】
    (スピード線のみ)効果線の範囲

  • 【Center Space】
    中心(始点)からの距離の空き具合

  • 【Center Space Pandomness】
    上記のランダム度合い

  • 【Preview Zoom】
    プレビューの表示サイズ

って感じです。まぁ、いじっていると要領が分かってくるかと思います。

010

ここまでで、こんな感じです。
もうすでにマンガっぽい表現になってますね!

スクリーントーンを貼る…ではなく塗る

次に人物にスクリーンパターンを塗っていきましょう。
素材を用意したときに、人物はスマートオブジェクトにしておいたのでそちらで作業したいと思います。
このようにパーツを分けて管理すると便利かと思います。

011

まず洋服のエリアを選択します。


012

線のエッジ部分が少しグレーっぽいため塗られないので、選択範囲を少し広げておきます。
メニュー > 選択範囲 > 選択範囲を変更 > 拡張をクリック。


013

拡張量は3pxほどで設定します。
はみ出たりしたところは消したりしていい具合に調整します。

そして集中線の時と同じ要領で
メニュー > レイヤー > 新規 > レイヤー (shift+ctrl+N)
で新しいレイヤーを作成。


014

メニュー > 編集 > 塗りつぶし(shift+F5)
を選択。


015

塗りつぶしメニューで
内容で「パターン」を選択、オプションのスクリプトにチェックを入れて「Screen_Pattern_ex」を選択し、「OK」をクリックします。


016

スクリーンパターンのパラメータが表示されます。

  • 【Pattern Gradation】
    グラデーションのパターンです。Noneを選べば普通のスクリーンパターンです。

  • 【Pattern Scale1】
    始点のドットのサイズ

  • 【Pattern Scale2】
    終点のドットのサイズ

  • 【Pattern per Inch1】
    始点の線数

  • 【Pattern per Inch2】
    終点の線数

  • 【Pattern rotate angle】
    スクリーン角度 45°が一般的かと思います。

  • 【Randomize Patterns】
    パターンのランダム度合い(Randomize PatternsとRandomize Sizeをいじると、いわゆる「砂目」になります)

  • 【Randomize Size】
    ドットのサイズのランダム度合い

  • 【Preview Zoom】
    プレビューの表示サイズ

017

はい、こんな感じになりました。洋服と髪にスクリーントーンを塗っています。

完成

あと吹き出しとか文字とか入れると、よりそれらしくなりますね。
作風に合った吹き出しとマンガに適したフォントを使ってみましょう。

…というわけで出来上がったのがこちら。

manga

いかがでしょう?
それっぽくなったように思います。 吹き出しとフォントはこちらを利用しました。


021

フキダシデザイン
http://fukidesign.com/


022

やさしさアンチック
http://www.fontna.com/blog/1122/

まとめ

いかがでしたか?
アドオンを使うことでマンガっぽい表現を簡単に作り出すことができます。
おそらくプロの漫画家さんはもっとマンガに特化したツールとか使っているんでしょうけど…

より詳しい使い方は、開発者の方がYOUTUBEで解説してくれているので、そちらを参考にしていただくと良いかと思います。

関連記事

被リンクでSEO効果を出すために私がやってみたこと... 近視眼的な被リンクに囚われてはいけない。 上記は単純な被リンクの構造を描いた図です。 あなたが運用するWEBサイトがポピュラーであるか否かはこれほど単純な被リンク構造で判断をされているわけではないのです。 だからいくら被リンクを増やしても近視眼的な被リンクばかりに囚われていては...
私の考える「本当に良いコンテンツとは」何なのか。... コンテンツを考えるときにもっとも重要な事とは何か。 それは「誰が」「どんな時」「どう役立つ」もしくは「どう楽しむ」記事であるのかという事。 私はこれに尽きると考えている。 よく詳細なペルソナを描けと言われている昨今。 私はペルソナを否定するつもりはない。 そして、ここで「そ...
スマホでも一眼レフで撮影したようなボカシ加工が簡単に出来る写真加工アプリTadaa SLR... 簡単に背景ボカシが出来るのがTadaa SLR 背景ボカシ加工が出来るアプリは無料でも様々出ていますよね「Blur」や「Blur Photo」など。 でも指で塗りつぶしていかないといけないし、ブラシの調整だのが面倒。 それが簡単にいい感じにボケ感を付けてくれるのがTadaa SLR。 h...
これまでとは違う!攻めの行政サイトでイケている地方自治体サイトまとめ... 京丹後市 https://www.city.kyotango.lg.jp/ リキッドデザインで京丹後市の景観を全面にPRした行政サイト。 ナビゲーションボタンもすっきりとまとめられていて好印象です。 その分クリック回数が増えますが、無駄な情報が目に入ってこないので目的の情報が探しやす...
1ヶ月間、無料ブログサービスを4種類運用してみた結果、比較してみてどれが良いのか?... アメーバブログ(アメブロ) https://official.ameba.jp/ 【アクセス数】★★★★★(注意が必要) 【エディター画面の書きやすさ】★★★★ 【ブログ記事内容の難易度】★ 【独自の特長】独自ドメインでの運用不可 【投稿した記事数】21記事 【記事の文字量】5...
BingWebマスターツールの使い方と便利な機能... なぜBingWebマスターツールへの登録が必要なのか https://www.bing.com/toolbox/webmaster/ BingWebマスターツールはマイクロソフトの検索エンジンBingにサイトをインデックスさせるためのツールです。 主にGoogleを利用しているからBi...
独自ドメインが無料で使えるAmebaOwnd(アメーバオウンド)でサテライトサイトを作成しよう。... まずはAmebaOwnd(アメーバオウンド)でデザインテンプレートを選ぼう https://www.amebaownd.com/ Amebaアカウントをお持ちの方はそのまま「無料でホームページを作成」ボタンをクリックして次に進んで下さい。 まだAmebaアカウントをお持ちでない方はアカ...
写真が美しいデザインが美しい温泉旅館のWEBサイト【厳選15サイトまとめ】... 石川県七尾市和倉温泉 多田屋 https://tadaya.net/ 和倉温泉の奥座敷にある多田屋 ここの温泉旅館のWEBサイトはWEB業界に長くいる人なら誰しもが知っているほど超有名です。 現在公開されているWEBサイトではないですが、2006年に公開されたFLASHのWEBサイト...

この記事を共有する

この記事を読んだ方におすすめの記事

その他の最新コラム記事

人気記事ランキング

コラムカテゴリ
  • このエントリーをはてなブックマークに追加
  • follow us in feedly
お問い合わせ