HOMEPAGE TIPS BLOG

ホームページ制作TOP > Web技術Tips > Adobe Capture で手書き風のアイコンを作ってみる
Teambook -リモート時代のマニュアル・日報システム-
カスタムテンプレートサイト / KOTETSU
[期間限定] 標準クオリティープラン  WEBサイト制作20%OFF
失敗しないWeb制作会社の選び方
Illustrator

Adobe Capture で手書き風のアイコンを作ってみる

Illustrator2017.01.31

adobe-capture-img15

この記事では、紙に描いたアイコンの絵をキャプチャして、イラレで使えるようにする方法を紹介します。

Adobe Capture を使うと、スマホのカメラで撮影した写真をベクターデータにトレースして保存できます。

CC の Illustrator や Photoshop などでは、ライブラリから呼び出して使うことが出来ます。

イラレにも画像をトレースしてベクターデータにする機能はありますが、Adobe Capture はカメラで「撮影」するだけなのでお手軽です。

アプリをダウンロード

まずはアプリをダウンロードします。

iOS と Android に対応していますが、バージョンによっては対応していないようです。

実際に、手元にあった Android は対応しておらずダウンロードできませんでした。

アイコンを描く

キャプチャするために適当なアイコンを描いていきます。

カメラが認識しやすいようにコピー紙などの白い紙に黒いペンで描くのがおすすめです。

ルーズリーフなどの罫線が入っている紙は避けたほうがいいでしょう。

adobe-capture-img13

Adobe Capture でキャプチャする

Adobe Capture を使うには Adobe アカウントが必要です。

普段使ってるアカウントでログインします。

adobe-capture-img08

[シェイプ] タブの [ + ] アイコンをタップし、カメラを起動します。

adobe-capture-img09

緑色になっている部分がトレースする領域です。

下のスライダーを調整して、いい感じになったら撮影します。

adobe-capture-img10

トレース部分が表示されましたが、小さいゴミが残っているので除去します。

[パスの除去] でゴミ部分をなぞると色が薄くなり、ゴミがとれます。

間違えて要る部分を消してしまったら [パスの選択] でなぞり直すと復活します。

adobe-capture-img11

[次へ] を押すとプレビューになり、最終的な出力を確認できます。

下のオンオフで、トレースを滑らかにするか選択できます。

今回は無視して [次へ] をクリックします。

adobe-capture-img12

最期にプロパティを設定して保存します。

Illustrator や Photoshop のライブラリから使うことが出来る

adobe-capture-img05

Illustrator のライブラリパネルを見ると、さっきのアイコン達が追加されています。

adobe-capture-img06

拡大・縮小しても問題ありません。

adobe-capture-img16

色を変えたり効果をつけたりできます。

 まとめ

Adobe Capture でアナログなデータをキャプチャしてベクターデータに変換する方法を紹介しました。

Adobe Capture は「シェイプ」の他に「パターン」「カラー」「ブラシ」などのキャプチャができるので、

ぜひダウンロードして使ってみて下さい。

この記事は公開から 1369 日経っているため、情報が古くなっている可能性があります。

PAGE TOP