Paint.NETで画像をベクター化できる？プラグインを確認しよう

Paint.NETは通常の編集ではピクセルを扱いますが、コミュニティ製プラグインで画像をベクター化できます。この違いは重要です。SVGを開くこと、画像をトレースすること、ベクターパスを編集することは3つの異なる操作です。

otuncelliのScalable Vector Graphicsプラグインは、SVGの読み込みと基本的なラスターからベクターへのトレースの両方に対応します。作者はトレースを白黒の絵に推奨し、SVGとPaint.NET Shapeを書き出し形式に挙げています。Paint.NETではベクター化できないと断言するとこのプラグインを見落とします。一方、SVG読み込みのチュートリアルは逆方向の操作だけを説明している場合があります。

拡大縮小できる紋章や編集可能な輪郭が必要なら、プラグインがどの操作を行うかを確認し、書き出したファイルをベクターエディターで検査します。イラストに上描きしたりPNGを作ったりするだけなら、ラスターの手順ですでに十分な場合があります。

Paint.NETの各手順でできるもの

Paint.NETの公式機能ガイドは画像レイヤー、標準ファイル形式、形式を追加するプラグインへの対応を説明しています。SVGは標準形式一覧にありません。レイヤーのドキュメントはレイヤーをピクセルの積み重ねと説明しています。つまりレイヤーとベクターオブジェクトの編集可能性は異なります。

SVGを別々のレイヤーとして読み込むと描画しやすくなる場合があります。しかしPaint.NETがSVGの元の制御点を編集するエディターになるわけではありません。プラグインのREADMEは、読み込みを要素やグループのレイヤーへの描画と明記し、トレースを別機能として説明しています。

この違いはほかの画像エディターにもありますが、書き出し機能は異なります。GIMPのベクター化ガイドでは選択範囲からパスにする方法を解説しています。同じメニュー操作がPaint.NETにあると仮定しないでください。

チュートリアルに従う前にプラグインを確認する

作者の現在のREADMEから始めます。前提はPaint.NET 5.1以降で、インストール手順はClassic版とMicrosoft Store版を区別しています。また、別のファイル形式プラグインが同じ.svgと.svgz拡張子を扱わないよう警告しています。古いチュートリアルがDLLを1つコピーするよう指示する場合は特に、現在のプラグイン手順に従います。

次に、チュートリアルが何を実現するかを見極めます。SVGをどのサイズで描画するかを尋ねる読み込みダイアログは、Paint.NETキャンバス用のピクセルを準備しています。トレース書き出しは既存ピクセルから新しい図形を作ります。カスタム図形を描くチュートリアルは、さらに別の作業かもしれません。

初めてのトレースでは無地の背景にある単純な黒い紋章を選びます。写真や陰影のある絵より、作者が述べる得意分野に合います。元の.pdnを保管し、トレースの実験で作業用レイヤーを置き換えないようにします。

既存SVGをより大きなベクターファイルにするだけなら、プラグインのインストールは必要ありません。元ファイルにパスがあるなら、ベクターエディターで開いてそれを使います。Paint.NETへ描画して再トレースすると、不要な再構成の工程が増えます。

書き出したファイルをPaint.NETの外で検査する

SVGをPaint.NETで開き直すと、描画された見た目を確認できます。ベクターの編集可能性を確認するには、コピーをベクターエディターで開き、オブジェクトを調べます。鮮明なプレビューや.svgのファイル名だけでは内容を判断できません。

SVGはラスター画像も含められます。SVG仕様のimage要素はPNG、JPEG、別のSVGを参照できます。画像とベクター形状を混在させることもできます。パスが1つ見つかっても、見えるデザイン全体がベクターの絵である証明にはなりません。

小さな花の紋章を検査の練習に使います。花びらの輪郭、中央の周りの隙間、背景は別々に確認します。

1. 花を選択します。エディターがグループと表示するなら、検査用コピーでグループ内に入るか解除してから内容を判断します。グループ選択だけでは埋め込みビットマップの証拠にはなりません。
2. 花びらの輪郭にノードツールやダイレクト選択ツールを使います。配置画像を囲む長方形ではなく、花に属する編集可能な形状を探します。
3. 塗りを変えてから元に戻します。どの部分が変わるかを確認します。トレースは複数の花びらを複合パスにまとめる場合があるため、各花びらが個別に編集できるとは限りません。
4. 絵の背後に対照的な色の長方形を置きます。花びらの隙間に新しい色が見えるか、不要な白い図形があるかを確認します。
5. 予定のサイズで紋章を確認します。有効なパスでも、不自然な輪郭、閉じた隙間、余計な小さな点など、修正が必要な場合があります。

ファイル検査の概念図

2つ目の確認としてSVGをテキストで調べます。PNG、JPEG、対応するデータURLを指すimage要素はラスター内容を示します。形状にはpath、circle、rectなどの要素を使えますが、参照があると単純なテキスト検索では不十分な場合があります。ソース確認はエディターでの検査と併用します。ラスター画像を含むSVGのガイドで混在ファイルを詳しく解説しています。

合格条件は作業によって異なります。色を変える紋章には使える塗りが必要です。調整する輪郭にはアクセスできる形状が必要です。カット用ファイルには適切なカット境界も必要ですが、この確認だけで適合が保証されるわけではありません。

Paint.NETで準備し、PerfectVectorで別途トレースする

Paint.NETをピクセルエディターとして使い続け、別の画像からSVGへの手順を試したい場合にPerfectVectorが適しています。準備した絵のPNGコピーを保存し、その画像をベクターに変換して、ダウンロードしたSVGをベクターエディターで検査します。同じ花の確認を行います。輪郭が絵に属することを確認し、必要な色変更を試し、対照的な背景で隙間を確認します。

PNGの書き出し前に、無関係な印を削除し、デザインを切らずに余分なキャンバスを切り抜きます。細部を増やすつもりで小さい元画像を何度も拡大・保存するのは避けます。レイヤー付き.pdn原本とトレース用PNGを保管しておけば、重要な隙間や輪郭の結果が悪い場合に元画像を修正できます。

プラグインのトレース機能のリリースノートで述べる単純な白黒の絵には、そのプラグインも試すに値する方法です。紋章を手動で描くか曲線を大幅に調整する場合は、専用ベクターエディターが役立ちます。別の描画アプリでラスターとベクターのレイヤーを比較するなら、Kritaのベクター化手順を参照してください。

写真や描画の質感ではピクセルを保つほうが適する場合があります。トレースは見える領域を再構成しますが、元の絵の隠れたオブジェクト、編集可能な文字、ブラシ履歴を復元しません。そのピクセルが必要な絵ならラスターを保ちます。

よくある質問

Paint.NETは画像をSVGとして保存できますか？ 標準形式一覧にSVGはありません。コミュニティ製Scalable Vector GraphicsプラグインにはSVGへのトレース書き出しがあるため、すべてのSave Asが同じ変換を行うと仮定せず、プラグインと操作を確認します。

SVG読み込みプラグインはPaint.NET内で編集可能なベクターパスを保ちますか？ otuncelliのプラグインはSVG読み込みを、統合した1枚の画像または別レイヤーへの描画と説明しています。元SVGの形状を確認・編集するにはベクターエディターを使い、元ファイルを保管します。

Paint.NETのSVGプラグインは読み込み専用ですか？ いいえ。現在のREADMEは基本的な画像トレースとSVG・Paint.NET Shapeの書き出しも説明し、白黒の絵に最も適すると述べています。

Paint.NETで開いたSVGがピクセル化するのはなぜですか？ 読み込み手順は、選んだサイズのピクセルに描画します。パスが破損している、または再トレースが必要だと判断する前に、ベクターエディターで元SVGを確認してください。

参考資料

1. Paint.NETドキュメント — 概要と機能 — 標準形式、ネイティブPDN、プラグイン対応。
2. Paint.NETドキュメント — レイヤーの操作 — ピクセルを基にしたレイヤーモデル。
3. otuncelli — Paint.NET用Scalable Vector Graphicsプラグイン — SVG読み込み、トレース書き出し、要件、インストール手順。
4. otuncelli — プラグインのリリース — トレース機能と、述べられた白黒の絵の用途。
5. W3C — SVG 2の埋め込み内容 — SVG内で画像要素がラスターファイルを参照できること。

---

使えるパスがすでにあるなら元SVGを保管します。ラスターの紋章しかなくベクター編集が必要なら、準備した画像をPerfectVectorで試し、制作用素材を置き換える前に輪郭、塗り、穴や隙間を確認してください。