今回は手書きのイラストとスマホアプリを使ってデジタルイラストにする方法を紹介します。
自分で手書きしたイラストをデジタル画像にしたいんだけどやり方教えて!
簡単な方法があるよ!
適当に書いた絵とスマホがあればアプリでちょちょいのちょいですわ。
必要なものは手書きのイラストとアプリ2つだけです。
僕が手書きのイラストをデジタル画像にしたかった理由はとりあえずSNSとかの似顔絵アイコンをてっとりばやく作りたかったからでした。
似顔絵アイコンとかが欲しいという方はココナラで作ってもらうのもいいかもしれませんね。
1,000円くらいからでも依頼ができるし、自分で書くよりは多少のコストはかかってしまいますがそのぶん愛着のわくアイコンがゲットできるのではないでしょうか。
とはいっても、自分でちょっとしたイラストを簡単にデジタル化できたら色々と便利なので知っておいて損はないと思います。
ではその方法を詳しく解説していきます。
たったの4STEPで完成してしまうのでさっそく一緒にあなただけのイラストアバターを作っていきましょう!
手書きのイラストをデータ化するために用意するアプリ
まずイラストアバターを作るために使うアプリを紹介していきます。
どちらも無料アプリです。
あとはイラストを描くための白い紙とペンを用意してください!
タッチペンもあると便利です。
Adobe Capture
このアプリはカメラで撮影した写真や、デバイスからアップロードした写真などを色々な画像に変換したり文字や色を抽出してくれるアプリです。
マテリアル、文字、シェイプ、カラー、Look、パターン、ブラシ、といった7種類の魅力的で面白い機能がありますが今回はシェイプを使います。
シェイプはどんな機能かというとカメラで撮影するか、デバイスからアップロードした写真を見やすいくっきりとした線に瞬時に変換するというものです。
アプリのインストールはこちらから
Adobe Illustrator Draw
Adobe Captureのシェイプ機能を使って線に変換した画像を読み込んで線を編集したり色を塗ったりしてくれるアプリです。Adobe製品で連携しているので簡単に読み込むことができます。
アプリのインストールはこちら
すでに持っているAdobeのアカウントか、Facebookアカウント、Googleアカウントのいずれかでログインできるのでどちらも同じアカウントでログインしてください。
手書きのイラストとアプリを使ってアバターなどを作る方法
ではさきほど紹介した2つのアプリと手書きのイラストを使ってアバターを作っていきます。
STEP1:紙にペンで好きなイラストを書く

描くものが決まっている方は問題ないと思いますが、何を描いていいか分からないという方はあまり深く考えずにとりあえず描いてみましょう。
絵が得意ではなくてもそれはそれで味なのでOKです。最終的に色をつけるのでそれなりにみえるので心配せずに描き進めましょう。
自分の顔の特徴がうまく表現できないよって方は好きな動物とか似ていると言われたことのある動物などを書いてみてはいかがでしょうか?
1つだけ注意しなければならないことがあります。
後で色を塗る時に線が繋がってないと色わけ出来ません。上の画像でいうと耳の部分です。今回は解りやすいようにわざ線を繋げないでそのままにしておきます。
STEP2:Adobe Captureのシェイプ機能で撮影

イラストが描けたらさきほど紹介したAdobe Captureというアプリのシェイプ機能を選択して撮影します。
イラストの以外の部分に黒い影のようなものが写ったりしても気にしなくても大丈夫です。
撮影後、消しゴム機能や切り抜き機能で編集できます。
STEP3:Adobe Captureで編集する
上の調整を選んで手書きのイラストを撮影した時に写り込んでしまった余分な線などを消しゴム機能で消していきます。
上の切り抜きを選んでイラストを残すようして余分な部分を切り抜きます。
スムーズ機能を使って線をなめらかに整えます。自動でやってくれます。
下のオン、オフはペンで描いたイラストの場合だとそこまで必要ないかなぁとは思いますが多少、線の雰囲気が変わるので一度お試しください。
全ての編集が終了したら右上の←を押してください。
保存する
←を押すと保存する画面に進むので保存を押します。

ライブラリに追加されました。
STEP4:Adobe Illustrator Drawで画像を呼び出す
ここからはAdobe Illustrator Drawを使ってさきほど作った画像に色をつけていきます。

「+」ボタンをタップしてプロジェクトを新規作成します。

好みの形式を選びます。ない場合はあとからリサイズすればOKです。

作業するスペースの大きさがわかりずらいので背景色を選んでタップします。
そうすると画像を変形させる機能がでてくるので変形をタップします。
「表示に合わせる」をタップして右上のレ点をタップします。
そうすると背景が表示と合うのでわかりやすいかと思います。

描画レイヤーを選んで上の画像の矢印のアイコンをタップします。

ライブラリシェイプをタップすると手書きのイラストをAdobe Captureでデジタルデータ化した画像がでてくるので色を塗りたいものを選びます。
画像が反映されてない場合がありました。もし画像がでてこない場合はAdobe Captureを終了させてみてください。

ライブラリシェイプから画像を選ぶと左の画像のように半透明のような状態で画像が呼び出されます。
左側のペンツールの一番下が消しゴムです。消しゴム以外を選んで大きさを決めてから画像の上を2回タップします。すると色がペンツールで選んた色に変わり描画レイヤーにも画像が反映されるので ☓(バツ)マークをタップします。
STEP4:Adobe Illustrator Drawで色を塗る
最初に呼び出したイラストの線の部分に色を塗ります。線の上を長押しでタップすると塗りつぶすことができます。
線に色をつけなて塗りつぶしたい部分をかこってあげないと塗りつぶしができないからです。
繋がっている線は全て色がつきますが離れている線は色がつかないので個別に色塗りをする必要があります。上の画像でいうと目とか鼻の部分にあたります。

スマホで作業する場合など小さくてやりずらいと思うのでズームなどの機能を使い画像を大きくしないと細かい線を塗ることが厳しいかと思います。
指での操作方法は上の画像の通り、左上のメニューをタップし「ジェスチャーについて」からみることができます。
ここからは楽しい作業です!
線に色を塗ってかこった部分を塗りたい色や不透明度を決めて長押しでタップすると塗りつぶされます。
色の選択はカラーをタップします。

カラーのテーマから決まった色を選ぶことができ、ピッカーから自分で色を調合した色を選ぶことができます。
他の部分も塗りつぶしていくと耳の部分の線がつながっていなかったので耳まで茶色になってしまいました。
STEP1の紙にイラストを描くところの注意点でも書きましたが線が繋がっていないとこんなふうになってしまいます。
こうなった場合は作業を1つ戻り線を描いてつなげなければなりません。

作業をする時に左右にあるレイヤーやペンツールが邪魔なら上の画像の矢印のところをタップすると消すことができます。

線の色とサイズを調整してつながっていなかった部分を描きたします。
線のサイズは長押ししながら上下することで変更できます。

あとは他の部分を同じように色を塗りつぶして完成となります。
完成したら保存先や保存形式を決めて終了です。
まとめ
スマホのアプリ、Adobe Captureのシェイプ機能とAdobe Illustrator Drawを使えば手書きのイラストが簡単にデジタルデータ化できます。
この2つのAdobe製のアプリで作ることができます。
スマホやタブレッドなどで編集する場合、タッチペンがあると作業もはかどります。
もう少しこだわったSNSアイコンが欲しい!というあなたはプロに依頼できるココナラに行ってみるのがいいでしょう。
たくさんのクリエーターがいて絵の雰囲気もそれぞれ違うのでみているだけでも楽しいですよ。