画像トレース | デザイン | お役立ち情報 | 岡山のホームページ制作会社。WEB戦略が得意なホームページ成績上げ屋さん！

岡山のWEB戦略・WEBマーケティング・ホームページ制作をしている会社、有限会社ニッティ・グリッティの太田です！

Illustratorの便利機能紹介第3弾です…！👏

手書き感のある文字やイラストを載せたい…！！

けど、手書きフォントにも限りがあるし、パスでイラストを書くのは難しい…

他にも、PNGデータじゃなくてオブジェクトとして画像を読み込みたい！

となったことはありませんか？

そんな時に使える便利機能があります…！👀✨

Illustratorを使い始めて3年…。 新米デザイナーとして働き始めて約3ヶ月…。 の、初心者目線から、

初心者さんに伝えたい あんまり使わないけど、実は便利！！な、Illustratorの隠れ機能をご紹介します！

今回はその中の一つ「画像トレース」についてご紹介していきます！

-----------------------------------------------------------------------------

＞「画像トレース」ってどこにあるの？

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿

上部メニューの「ウィンドウ」→「画像トレース」で画像トレースパネルを開くことができます！

画像トレースパネルを開いたら、読み込みたい画像を用意して早速使っていきましょう！

＞「画像トレース」って何？どう使うの？

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿

「画像トレース」はとは文字通り、画像をイラストレーター内でベクターデータ（図形）化ができる機能のことです！

自分で書いた文字や絵を取り込むことができます！

うまく行く場合と行かない場合がありますが、これが出来るとかなりの時短になるかも…！

①取り込みたいものを画像データにして、画像を配置して選択状態にしておきます。

(今回私はボールペンでりんごを書いて、スマホで撮影したものを読み込んでみました！)

そのまま、画像を選択した状態で画像トレースパネルを開きます。

この作業は、上部メニューの「オブジェクト」→「画像トレース」→「作成」からでも行うことが出来ます！

この時点では、まだベクターデータ化されておらず、事実上画像として扱われています。

一度ベクター化してしまうと、トレースの細かい設定が出来なくなってしまいますので、必ず「作成」を選択するようにしましょう！

この時、「作成して拡張」を選択しないように注意しましょう！

②画像トレースの設定を行います。

■プリセット

プリセットでは事前に準備されたトレース設定を選択することが出来ます。

初めのうちは細かい設定に慣れていないかと思いますので、このプリセットから自分の思うトレース設定を選択することをおすすめします！

■表示

トレースしたオブジェクトの表示を変更することができます。

変更後、画像トレースパネル左下のプレビューにチェックが入っていると反映されます。

右のアイコンを押したままにすると、元画像と重ねて比較することができます！

■カラーモード

カラーモードでカラーを指定し、パレットの設定に基づいて指定する項目です。

例えば、パレットで限定に設定した場合、トレースする色の数を指定することができます！

■パレット

パレットはカラーモードをカラーにした場合にのみ指定する項目です。

「自動」「限定」「フル階調」の3つを選ぶことができ、「フル階調」に行くにつれより写真に近い表現が可能となります！

■しきい値/グレー/カラー

この項目は、カラーモード指定したパレットの設定に基づいて設定します。

グレー/カラーでは、色の数を指定することができ、数値が大きくなるにつれより細かい表現が可能となります！

しきい値のみ、設定した数値より暗いピクセルは黒色になります。

そのため数値を大きくすると黒の面積が大きくなり、小さくすると白の面積が大きくなります！

■パス

オリジナルの画像をどのくらいの精度でトレースするかを設定できます。

精度を低くするにつれ、とがったパスの表現が目立つようになります。

■コーナー

曲線部の精度を調整します。値が大きくなるほど、スムーズな曲線が描かれます。

■ノイズ

指定したピクセルの領域を無視して、ノイズを減らします。

値が大きいほどノイズが少なくなります。

③画像のベクター化を行います。

最後に、画像トレースの設定を行ったらベクター化を行います！

プレビューをのボタンをオンにすると、設定が反映されますので、良いと思ったら「拡張」を押してください。

上部メニューの「オブジェクト」→「画像トレース」→「拡張」でも行えます。

これで、読み込み完了！

ボールペンで描いたリンゴを、オブジェクトとしてIllustrator上に読み込むことができました！！

-----------------------------------------------------------------------------

いかがでしたでしょうか！

手書き要素を入れると、デザインのちょっとしたアクセントにもなりますので、ぜひ使ってみてください…！！✨

Part1では「スムーズツール」について

Part2では「シェイプ形成ツール」について ご紹介しています！

ぜひ、こちらも読んでみてください！👀✨

▷「スムーズツール」について

▷「シェイプ形成ツール」について

明日のブログはは青木さんと長谷川さんです！お楽しみに！