ゲーム制作記とゲーム制作に役立つ画像素材や情報記事を公開しています

どうも！　Illustrator大好きぴぽです！
IllustratorはPhotoshopで有名なアドビ社のイラストデザインソフトです。
Photoshopほどメジャーではないですけど、印刷物なんかを制作するお仕事には欠かせないソフトですねぇ。
最近はInDesignって同じアドビ社の別のソフトもありますけど。

そんなIllustratorで扱うグラフィックの形態をベクターグラフィックって言うんです。
画像を拡大縮小してもベクトルデータで構成されているため、画質の劣化がないんです。
逆に普通のグラフィック制作ソフトで扱うグラフィックの形態はラスターグラフィック・ビットマップグラフィックなんて言います。拡大縮小させちゃうと通常は画質が劣化してしまいますよね。
Photoshopなんかでもパスデータとか聞いたことあると思いますが、あんなかんじのものをIllustratorで扱うことができます。
他にはFlashもベクターグラフィックを扱うソフトウェアの一つですねぇ。


さて、そんなわけで、ラスターグラフィックなドット絵をIllustratorでベクターグラフィックに変換してしまおうという方法をご紹介です。まあ、メジャーなやり方なんでご存知な方多いでしょうけど、blogの記事ネタということでつらつら書いていきます。

まずは、なぜドット絵をベクターグラフィックにするか。ですが、ドット絵をデザイン素材としてIllustrator上のイラストに盛り込む時に便利、ベクターグラフィックでできる効果をドット絵に与えられるなど、ちょっとおもしろいからですｗ

使用しているIllustratorのバージョンはCS3ですが、9,10とかの古いバージョンでも同じようなことができたと思います。8はわからないです。


今回のサンプル素材はこちらの魔女キャラのドット絵を使います。


Illustratorを起動してアートボードに放り込みます。リンク状態です。


Illustratorで加工できるように、画像を選択したまま「埋め込み」ます。


画像を選択したまま「フィルタ＞クリエイト＞モザイク」を選択します。


「現在のサイズ」が画像の実寸法です。
これと同じ数値を「タイル数」に入力します。
そしてOKボタン！


このくらいのサイズだとPCの性能にもよりますが、けっこう時間かかります。
普通は32×32ぐらいのプチ素材にさくっとやるぐらいがおすすめです。


処理が終わると、ドット絵の1ピクセルごと正方形のベクターグラフィックに変換されたのが確認できます。


これからどう加工するかにもよりますが、隣接する同じ色同士は１つのベクターグラフィックとしてくっつけたほうが扱いが楽なのと見易いので、「パスファインダ＞合流」を実行します。


こんなかんじに。


あとは、３Ｄ効果つけてみたりと自由に加工していきます。


上の方のがワープ変形、真ん中のがパスファインダを掛けない状態でパスの変形などで加工したもの、下がブレンドツールで色を調整した右のキャラから左のキャラへの変化過程を出力したもの。



以上。お手軽ですねぇ！

関連記事

• フリーソフト「GIMP」でカラーバリエーションを作成しよう 2012/11/09
• Adobe Fireworks CS6を使ってみたくなった 2012/10/21
• ドット絵をIllustratorでベクター画像にしてみよう 2012/10/12
• ドット絵をそれっぽく拡大するツールを使ってみた 2012/10/11
• ウディタ用アニメーション制作ツール「NAnimEditor」導入編 2012/10/01

カテゴリ ： ソフト紹介 ｜ Comments (0) ｜ Trackbacks (0) ｜ 【記事編集】