calendar

S M T W T F S
1234567
891011121314
15161718192021
22232425262728
293031    
<< October 2017 >>

categories

archives

写真素材からベクターイラストを作る

0
    Flashでコンテンツを作るに当たって、背景絵などでベクター絵を作りたい時が良くあります。ゲームとかだと、キャラクターをベクター絵などで作ると、背景が実写だと全体のバランスとして違和感が出てしまいますので、できれば背景もキャラクタに合わせてベクターのイラスト素材で揃えたい、と言った欲が出てきます。

    しかしながら、自分はあまり絵が得意ではないので、自分ではなかなかイラストが描けません。そこで、ネットのフリー素材や、図艦等に載っている写真をトレースして、できるだけ手間をかけずにベクターイラストを作る方法を模索してみました。

    今回色々な方法を試してみて、PhotoshopやIllustrator等も使ってやってみたところ、それなりにきれいに作れたのですが、もっとシンプルに1素材10分くらいでザッと作れる方法はないかと色々試行錯誤した結果、Flashだけを使って作成する今回の手順に落ち着きました。

    以下写真付きで解説してみたいと思います。
    説明長いですが、慣れれば10分位で作れるようになると思います。

    _菫をステージに配置しシェイプ化する
    ・jpgなりの画像をステージにドラッグして配置する。(以後配置したレイヤーを「画像レイヤー」とします)
    ・画像を右クリックして「分解」→プロパティでビットマップがシェイプになる。




    背景部分を削除する
    ■背景が無い画像の場合
    ・投げ縄ツールを選択し、自動選択ツールが選択されている状態にする。
    背景をクリックすると、背景だけが選択されるので、Deleteで背景部分を削除する。




    この時、絵と背景の境界線がギザギザになる場合は、[Ctrl]+[Z]で戻してから、「自動選択ツール設定」の「選択する色の範囲」の数字を調正して何度かやり直してみる。

    ※背景がある場合は、上手く輪郭が選択できない場合があるので、投げ縄ツールの自動選択モードをOFFにし、輪郭をなぞって選択します。

    ※この後、色を塗っていきますが、この時点で画像レイヤーを複製してロックしておくと、あとでやり直したり、写真の色の確認がしやすくなります。

    色の境界線を引く
    画像レイヤーをロックし、上位レイヤー(鉛筆レイヤー)を作成する。鉛筆レイヤーに、鉛筆ツールを使って色の境界となる線を引いていく。

    ※真っすぐの線が上手く引けないときは、[Ctrl]+[+]で画像を大きくしてやったり、画像を斜めにしたり(あとで線と元画像を一緒に戻す)してやる

    ち澗里凌Г鯏匹
    画像レイヤーのロックを解除し、画像全体をバケツツールで色を塗る。

    ※グラデーションで色を塗る場合は、一度縦にして塗ってからまた横に戻す。(自由変形で回転時は[Shift]を押しながらやると45度,90度と正確に回転できる)

    テ睇瑤良分の色を塗る
    鉛筆レイヤーの線を全て、画像レイヤーに切り取り・貼り付けする。画像と線が同じレイヤーになると、各領域を選択できるようになるので、領域毎にグラデーションの色を調正したり、色を塗ったりしていく。


    線を消す
    消しゴムツールで線を消すを選択する。大きい消しゴムにして、画像全体をゴシゴシして線だけを消す。



    ★できあがり★

    コメント
    コメントする








       
    この記事のトラックバックURL
    トラックバック