Conceptsで画像をベクター化できる？実際のパスを書き出す方法
Conceptsは編集可能なストロークを描きますが、読み込んだ画像にはトレースが必要です。元の絵を保ちながら標準のSVG書き出しか外部変換を選びます。
目次
Conceptsは編集可能なベクターベースのストロークを作りますが、写真を読み込んでも、その内容がストロークになるわけではありません。Conceptsで描いた絵なら、まず標準のベクター書き出しを使います。読み込んだPNGやJPGに編集可能な輪郭が必要なら、上から描くか、別の画像ベクター化ツールでトレースすることを考えます。
この違いは重要です。Conceptsは描画エンジンをベクターとラスターのハイブリッドと説明しています。鉛筆や水彩の印はアプリ内で調整可能なままでも、別のエディターへ同じブラシストロークとして持ち出せるとは限りません。スケッチの背後にある参考画像は、さらに別の種類のオブジェクトです。
書き出す前に、受け取り側に必要なのが元のConcepts描画、その忠実な画像、別の場所で形を変えられるパスのどれかを決めます。この3つは異なる納品物です。
キャンバス上のものを識別する
読み込んだ植物写真と、その上から描いた輪郭は1つの構図に見えても、扱い方は異なります。Conceptsの読み込みマニュアルは、画像を位置やサイズを変えられる選択済みオブジェクトとして配置することを説明しています。その配置操作は画像内容の自動トレースを説明するものではありません。
一方、公式のベクターでスケッチするガイドは、Conceptsで描いたストロークがブラシのスタイルや色などの情報を保ち、選択ツールやNudgeで後から変更できることを説明しています。写真を1つの長方形として移動することと、ストロークとして描いた葉を調整することは異なります。
各要素の出所から次の工程を選びます。
| 手元にあるもの | 必要なもの | 開始方法 |
|---|---|---|
| Conceptsで描いた線画 | 別アプリで編集可能な形状 | 標準のSVG書き出しを試す |
| Conceptsで描いた質感のある絵 | レイアウト内で同じ見た目の質感 | ラスターを書き出し、元の描画を保管する |
| 読み込んだ写真やスキャンしたスケッチ | 新しい編集可能な輪郭や塗りの図形 | 手動で上から描くか外部トレースツールを使う |
| 写真とストロークが混在する構図 | 別の環境で使うイラスト | ピクセルを残す部分とパスが必要な部分を個別に決める |
たとえば、植物写真から苗のラベルを作るとします。参考画像の上に葉を3枚と鉢をスケッチし、鉛筆の質感を加えます。ラベルには輪郭だけが必要かもしれません。大きなポスターでは写真や描いた見た目が必要かもしれません。目的を分けずにキャンバス全体を書き出すと、受け取り側が実際に編集できるオブジェクトがわかりにくくなります。
使用するプラットフォームのSVG書き出しを確認する
Conceptsの現在の機能一覧では、両方のプラットフォーム群でSVGとDXFは書き出し専用形式とされています。古い議論だけでAndroidにはSVG書き出しがないと仮定しないでください。一覧では購入できる機能と示されているため、インストール環境で有効になっているか確認します。
| プラットフォーム群 | SVG対応 | Concepts独自の描画形式 |
|---|---|---|
| iOSとiPadOS | 書き出しのみ | .concept |
| Windows、Android、ChromeOS | 書き出しのみ | .concepts |
同じ一覧は、iOSの独自形式はまだWindows/Android形式と互換性がない一方、Windows、Android、ChromeOS間で描画を移せると説明しています。したがって、複数プラットフォームのアカウントがあっても、すべてのConceptsの描画を交換できるわけではありません。
Conceptsで編集を続けるためConcepts独自形式のコピーを保管します。受け取り側のベクター作業用にSVGを書き出し、見た目が重要ならラスターのプレビューを添えます。SVGを元の描画の完全な保存物と扱わずに、視覚的な参照を渡せます。
Conceptsで描いたストロークをベクターの受け渡し向けに準備する
iOSの手順では、書き出しマニュアルがベクター書き出し用の作品にFixed WidthまたはWireを推奨しています。特殊なブラシの質感は別の環境で異なって見える場合があり、Hard MaskとSoft Maskのストロークは白い線として表示される場合があると警告しています。代わりにSliceで線画を切り詰めます。残したい絵が変わるならコピー上で変更します。
iOSでは意図したストロークを選び、ExportでSVGを選択して、選択範囲を書き出し領域にします。設定も確認します。Use Filtersはブラシと背景の質感画像を追加するため、全体がパスで構成される保証ではありません。マニュアルはIllustratorへの書き出しではFiltersを無効にするよう特に勧めています。
最初のファイルを互換性のサンプルとして扱います。コレクション全体を準備する前に使用先のエディターで開きます。質感のある印、切り詰めた線の端、重なりを1つずつ元の描画と比較します。保存成功は確認の始まりにすぎません。
植物ラベルで書き出しを確認する
自分の描画に適用できる、小さく繰り返し可能な方法です。大きな制作を用意せず、見た目と編集可能性を分けて確認できます。
- 原本を残します。 ブラシ変更や切り詰めの前に描画を複製します。作業用コピーには使用先がわかる名前を付けます。
- 小さなサンプルを選びます。 鉢、葉1枚、質感のある印1つを使います。切り詰めた線の端も含め、未変更のストロークだけのサンプルにしないようにします。
- 受け取り側に必要なものだけを書き出します。 輪郭のラベルでは参考写真ではなくConceptsで描いたストロークを選択します。ベクターファイルとともに見た目のプレビューを保管します。
- 使用先のエディターでオブジェクト種類を確認します。 葉を選び、小さな曲線編集を試して元に戻します。画像の長方形を1つ動かせるだけなら、編集可能な線画と呼ぶ前に内容を調べます。
- 色付き背景で重なりを確認します。 空白を期待した場所に白い印がないか探します。質感と線の端もプレビューと比較します。
- 実際の次の編集を試します。 鉢の色や葉の間隔を変えます。残りのラベルに手順を繰り返す前に、書き出し構造でその作業を実用的にできるか判断します。
これらの確認は、開けるかどうかより役立つ問いに答えます。次の担当者が、送った目的である変更を行えるでしょうか？ SVG内に画像オブジェクトがあれば、ラスター画像を含むSVGのガイドで混在内容の確認方法を説明しています。
新しいパスが必要な場合だけ読み込んだピクセルをトレースする
読み込んだPNG、JPG、スキャンしたスケッチに、別々の編集可能な図形が必要なら、元画像をPerfectVectorでSVGに変換します。結果をSVGエディターで使い、ラベルに採用する前に葉の輪郭、鉢の形、不要な背景領域を確認します。ピクセルから形状へのトレースが不足している工程の場合に役立ちます。
元のConceptsのブラシストローク、レイヤー、描画の判断は復元しません。使えるConceptsで描いたストロークがすでにあるなら、まずそれを書き出します。ラスター化してトレースすると、不要な場合もある再構成の工程が増えます。
戻す際にも重要な制限があります。Conceptsの公式SVG・DXF読み込みガイドでは、そのベクター形式を直接読み込めないとしています。外部で作ったSVGは、Concepts内で編集可能なパスを読み込む方法にはなりません。記載された代替方法は、上からスケッチできるラスターの参考画像です。描画作業で新しいストロークを作ります。
単純な植物の輪郭では、自動トレースを修復するより手描きのほうが意図した曲線を作れる場合があります。光や表面の細部が重要な写真はラスターを保ちます。別の描画アプリから来た素材なら、ProcreateとSVG、Clip Studio Paintのベクターレイヤーの関連ガイドで、それぞれの書き出しの境界を説明しています。
よくある質問
Conceptsは読み込んだ写真を自動で編集可能なストロークにできますか？ 画像の読み込みは参考画像をキャンバスへ配置し、写真内容をConceptsで描いたストロークにはしません。Concepts内で編集可能なストロークが必要なら上から描き、完成品をSVGエディターで使うなら外部で元画像をトレースします。
AndroidのConceptsでSVGを書き出せますか？ はい。現在の機能一覧はiOS/iPadOSだけでなく、Windows、Android、ChromeOS群にもSVG書き出しを示しています。購入できる機能とされているため、インストール環境で有効か確認します。
ConceptsのSVGはすべてのブラシの質感を保ちますか？ そうだと仮定しないでください。Conceptsは特殊な質感のストロークが別のベクターアプリで違って見える場合があると警告しています。Conceptsで描いた絵とラスターのプレビューを保管し、代表的なサンプルを使用先のエディターで試します。
変換したSVGをConceptsへ戻して読み込めますか？ Conceptsは現在SVGやDXFの直接読み込みに対応していません。ラスター化した参考画像を入れて上から描けますが、SVGのパスをConceptsで描いたストロークとして復元するものではありません。
参考資料
- デジタルアート：ラスターとベクター — Concepts独自のベクター・ラスター混合ストロークと調整可能な質感のある印。
- 読み込み — 画像配置、サイズ変更、対応する読み込み形式。
- ベクターでスケッチする、第2部 — Conceptsで描いたストロークのデータと描いた線を変えるツール。
- 機能一覧 — プラットフォーム別の書き出し対応とConcepts独自形式の互換性。
- 書き出し — ベクター書き出し設定、ブラシの見た目、マスクの制限。
- SVGやDXFなどのベクター形式を読み込めますか？ — SVGとDXFの直接読み込みの制限とラスター参考画像による代替方法。
手元のオブジェクトから始めます。Conceptsで描いたストロークで目的を満たせるなら書き出します。元がピクセルで、別の場所で編集可能な輪郭が必要なら、画像からベクターへの変換を試し、制作で必要な編集に照らして結果を確認してください。
