illustrator トレースの流れとコツ
受講日：2025年02月08日
トレース作業時のレイヤー管理
- 見本レイヤー
透明度40%くらいで置く。 - 色見本レイヤー
色をコピーしやすいよう、もう一個小さい見本レイヤーを置く。
Alt+ドラッグでコピー。 - レイヤーの管理
自分で描くレイヤーを見本レイヤーより下に置いていく。
レイヤーはこまめに分けると修正がしやすい。
- 画面スクリーンショット
Windowsキー＋shift+S
見本の取り扱いについて
- ポートフォリオに掲載する際は、参照元を明記する。
トレース元画像には著作権があるので、利用目的と取得先を記載する。
- 参照元：アンパンマンポータルサイトからお借りしました。
- 使用用途：illustratorでトレースの練習をするため。
- 入手方法：スクリーンショットで画像を切り取り。
配置した画像の取り扱い
- トレース元の画像の取り扱い
画像がローカル上にある場合、端末を入れ替えたり、データを削除すると、illustrator上でも画像を閲覧できなくなってしまうので、意識しておく。 - illustrator上で元画像を再表示する
ウィンドウ＞リンクにチェックを入れる。プロパティのリンクから、「再リンク」する。 - AIデータの中に画像を保持
プロパティ＞クイック操作＞埋め込み
トレース作業の手順と操作方法
- アンカーポイントを増やしたい・減らしたい時
ペンツールを使う。図形の線の太さをトレス元に合わせる。 - 同じレイヤー内で特定のオブジェクトにロックをかける
選択＞オブジェクト＞ロック - リフレクトツール
図形を反転して表示する。
オブジェクトを選択＞右クリック＞変形＞リフレクト＞コピー
shiftを押しながら図形を配置する。
曲線・ダイレクト選択
トレース
- トレースとは？
- 写し絵。
- トレース(完コピ)で図形の構造を理解する事で、重ね絵(レイヤー)という考え方の想像力を鍛える練習。
- 既存のイラストや写真を基に、トレース練習をしてみる。(著作権には注意する。)
- トレースのポイント
既存のオブジェクトのアンカーポイントを選択して、部分的に操作する事で、図形をなぞる。
オープンパス
選択ツールでオブジェクトを選択して、はさみツールでアンカーポイントを選択する。
ダイレクト選択ツール
- 図形を変形させる
オブジェクトを選択する
「②のアンカーポイント」をクリック
「①のハンドル」をドラッグすると、図形を変形する事ができる。 - 片方のハンドルだけを操作したい時は、altキーを押しながらハンドルを動かす。
曲線ツール
曲線ツール：歪みを修正したい場合は、ダイレクト選択ツールで、変更したいアンカーをダブルクリックして、ハンドルで修正できる。
リフレクトツール
- リフレクトツール
左右対称でオブジェクトを追加したい時に使用。 - リフレクトツール＋alt
オブジェクトの設置位置のプレビューが確認できる。 - コピー
元のオブジェクトと反転したオブジェクトが追加できる。 - コピー後に左右バランスを調整する場合
ダイレクト選択ツールでアンカーを調整する。
- オブジェクト同士の中央の取り方
ウィンドウ＞定規 で選択して、中央を取れるよう定規を当てる。
図形ツールをオブジェクトの両端をトリミングするように設置。
設置した図形にスマートガイドを使って、図形の中央を取る。
線と塗りについて
- 線と塗り、手前に来ている方に選択した色が反映される。
線と塗りを入れ替え、線をアクティブにすると、太さがリセットされるので注意する。 - スポイトツール
選択したオブジェクトの色をコピーできる。画像からは線の色をコピーできないので、塗りで色を取得してから、スウォッチパネルに色をストックして、線に色を反映する。 - カラーピッカー
色の彩度や明るさを調整できる。
実際にトレースして作成した画像
受講日：2025年02月10日
- 使用ソフト：illustrator
- 作業時間：50分
- 感想：目や眉など、左右対称に見えて、意外と左右非対称なパーツが多かった。曲線の描画が難しく、特に口の曲線の描画が難しかった。
イラストを選び、画像をトレースする。
- 参照元：星のカービィポータルさんからお借りしました。
- 使用用途：illustratorでトレースの練習をするため。
- 入手方法：スクリーンショットで画像を切り取り。
反省と次回の目標
実際にトレースした画像
- 使用ソフト：illustrator
- 作業時間：50分
反省
- 時間内(授業終了まで)に完成しなかった。
未完了部分：左足の影、帽子の色、模様、トレース元との線のズレの微調整。
- なぜ時間内に終わらなかった？
今の自分の習得度合いに見合わない絵をトレース元に選んでしまった。
- なぜ見合わないと思った？
トレース自体が初めてなのに、前面、本体、背面のような奥行きを表現するような複雑な図形を選んでしまった事で、時間内に対応する事ができなかった。
- どこが複雑だった？
帽子は、手前半分を身体より前面、奥半分を体より背面に配置する必要があり、この配置をするためには、帽子と身体をパスファインダーで分割したり合体したりする必要があるが、それに気付かずに、トレース元の線をなぞり始めてしまった。
- 次回の対応
前面、背面のみで構成できそうな題材を選び、自分の今のレベルで時間内で完成させる事を目標として課題作成に取り組みたいと思った。
- 今後の目標
今後奥行きの表現が必要な絵をトレースする際は、線を拾い始める前に、図形の置き方をきちんと考えてから取り組みたい。
トレースのコツ
作業日：2025年2月12日
- Illustratorのトレス作業の際、線ではなく面を置く事を意識！
- 下記の場合、帽子の線をペンツールでなぞるのではなく、
- なるべく図形ツールで大枠を捉える。
- ダイレクト選択ツールでパスをクリック
- ハンドルで図形を選択させて調整。
- 形が捉え切れない場合、アンカーポイントを増やす。
- ②～④を繰り返す。
図形ツールを置いた後、ダイレクト選択ツールでパスを調整
図形を置いたら…
パスファインダーで図形を同士を合体!!
塗りと線を分ける方法
- 最初に線＋塗りの図形を作成して、後で線オブジェクトと塗りオブジェクトに分ける。
- レイヤー前面にコピー：ctrl+F
レイヤー背面にコピー：ctrl+B - レイヤー整列
オブジェクトを複数選択してプロパティパネルで縦横を揃える。
illustrator トレース自主練習
バナーやアイコン等の作品を作るとなると、テーマやデザインを自分で決めたり、考える時間があるので大変そうですが、トレース練習は題材を選べば手を動かすだけなので、継続しやすそうでいいなと思いました。今後自分で考えて作品を作りたい！と思い始めた時、少しでも早く手が動くようにして、作業時間を短縮したいので、今のうちから練習を始めたいと思います。
練習作品1 カービィ
- 作業日：2025年2月12日
- 使用ソフト：illustrator
- 作業時間：80分
- トレース画像参照元：星のカービィポータルからお借りしました。
練習作品2 シェフカービィ
- 作業日：2025年2月12日
- 使用ソフト：illustrator
- 作業時間：80分
- トレース画像参照元：星のカービィポータルからお借りしました。
練習作品3 シェフワドルディ
- 作業日：2025年2月14日
- 使用ソフト：illustrator
- 作業時間：210分
- トレース画像参照元：星のカービィポータルからお借りしました。
- まずは好きなもので作業に慣れたいと思い、カービィのイラストが好きなので選びました。
- 1体描いたものをコピーして、目玉焼きの部分だけ個別で描きました。帽子や顔の肌色の部分が、以外と単純な図形で描き切れず、アンカーポイントの調整に手間取りましたが、楽しかったです。
練習作品4 リュックを背負って喜ぶ女性
- 作業日：2025年2月16日
- 作業時間：130分
- 参照元：イラストACからトレース練習用でお借りしました。
- ポートフォリオサイトのテーマはまだ悩み中ですが、人間のイラストが描けるというのは、どの企業でも需要を感じていただけるのではないかと思い、題材に選びました。
- 手や服のシワ等はカーブが多く、アンカーポイントの調整が複雑でしたが、手書きっぽいイラストでも線がハッキリしており、太さが一定のものであればトレースができるようになりました。
練習作品5 ビルのアイソメトリックイラスト
- 作業日：2025年2月21日
- 作業時間：95分
- 参照元：イラストACからトレース練習用でお借りしました。
- キャラクター、人間を練習したので、まだ練習した事がない建物を題材にしてみました。また、平面の図形で練習してきたので、立体的なイラストを選びました。
- 窓の数が多いので、再現するのが大変そうだと思いましたが、窓1つ分をトレースすれば、コピペとリフレクトでスムーズに完成させる事が出来ました。
