PerfectVector
著者: Jay

Claude CodeとMCPで画像フォルダーを一括SVG化:保存先の設計と検査

PerfectVector MCPを使い、Claude Codeでフォルダー内の画像を一括変換する計画を立てます。固有の保存先を割り当て、検証済みのローカルスクリプトで不足を見つけます。

2 分で読める
目次

アイコンのフォルダーを確認するとき、画像ごとにSVGの保存先が決まっていれば、変換漏れを見つけやすくなります。Claude Codeはローカル画像をPerfectVector MCPに送信でき、PerfectVectorはアカウントごとに一度に1枚を処理します。元画像と保存先を対応付けた一覧(マニフェスト)があれば、会話の終了後に確認が必要な結果を追えます。PerfectVectorの変換ガイド · PerfectVectorのトラブルシューティング

ここでは、公開されている手順に沿ったフォルダー処理用のプロンプトと、保存済みファイルをローカルで検査するPythonスクリプトを紹介します。スクリプトは出力名とSVGの構造を確認します。変換の送信は行いません。

お手持ちの画像で試す
フル機能のツールを開く
無料でお試しいただけます。画像をドロップすると、登録なしでベクターのプレビューを確認できます。

保存先が重複しないようにする

別の出力フォルダーの下に元と同じ階層を作り、拡張子を含むファイル名の末尾に .svg を付けます。サブフォルダーの異なる2つの mark.png を区別でき、logo.png と logo.jpg の出力も重なりません。

./rasters 内の元ファイル./vectors 内の出力ファイル
east/mark.pngeast/mark.png.svg
west/mark.pngwest/mark.png.svg
labels/logo.pnglabels/logo.png.svg
labels/logo.jpglabels/logo.jpg.svg
フォルダーの対応表
フォルダー内の元画像とSVGを対応付けた3行の一覧。2つの出力にはチェックマークがあり、1つは空欄です。
各元画像に固有のSVGパスを割り当てます。出力がない場合は、再変換を承認する前に既存の処理を確認します。

Claude Codeに処理範囲を指定する

設定ガイドに従い、リモートのPerfectVectorサーバーを設定して認証します。条件を満たす単一フレームのPNG、JPEG、WebPを使います。1ファイルにつき5 MB以下、各辺は100~4,096ピクセルです。Claude CodeのMCP · PerfectVectorのClaude Code設定 · PerfectVectorの画像要件

最初は一覧の作成だけを依頼します。変換前に保存先の重複や想定外の入力に気づけます。今回の処理で許可した元画像のパスだけを残してください。

List the PNG, JPEG, and WebP files under ./rasters.
For each, propose one output under ./vectors with the same
relative directory and .svg appended to the full filename.
Flag paths that already exist. Show the list before converting.

パスを確認し、少数のファイルから承認します。各SVGを一覧のパスに保存し、元画像を残して、不足や失敗があれば報告するようClaude Codeに依頼します。現行ルールでは、PerfectVectorは受け渡したSVG1件につき1クレジットを消費します。会話が途中で止まった場合は、同じ元画像で新規依頼を出す前に既存の変換を確認します。PerfectVectorのクレジットとダウンロード

保存したフォルダーを検査する

以下の検査スクリプトを check_svg_batch.py として保存し、python3 check_svg_batch.py ./rasters ./vectors を実行します。先ほどの命名規則と、一般的なSVG図形要素や画像要素の有無を確認します。「inspect visually」と表示されたら、元画像と目で見比べてください。拡張子やパスがあるだけでは、正確にトレースされたかは判断できません。

import sys
import xml.etree.ElementTree as ET
from pathlib import Path
 
source = Path(sys.argv[1])
output = Path(sys.argv[2])
formats = {".png", ".jpg", ".jpeg", ".webp"}
namespace = "{http://www.w3.org/2000/svg}"
 
for image in sorted(source.rglob("*")):
    if not image.is_file() or image.suffix.lower() not in formats:
        continue
    relative = image.relative_to(source)
    svg = output / relative.with_name(relative.name + ".svg")
    try:
        document = ET.parse(svg).getroot()
    except FileNotFoundError:
        print("missing", relative)
        continue
    except ET.ParseError:
        print("invalid XML", relative)
        continue
    has_shape = any(
        document.find(f".//{namespace}{tag}") is not None
        for tag in ("path", "rect", "circle", "ellipse", "line", "polyline", "polygon")
    )
    has_image = document.find(f".//{namespace}image") is not None
    status = (
        "inspect visually"
        if document.tag == namespace + "svg" and has_shape and not has_image
        else "inspect structure"
    )
    print(status, relative)

ローカルのテストデータでは、別々のフォルダーにある同名の元画像を区別できました。出力の欠落、壊れたXML、画像要素を含むSVGも検出しました。公開済みのPerfectVector製SVGと意図的に小さくしたテストファイルを使い、ローカルファイルに対する検査を確認しています。

missing は、予定したSVGが見つからなかったという意味です。アシスタントが処理を試みていないファイルも含まれます。記録済みの状態を調べ、取得できる結果がすでにあるか尋ねてください。次の変換を承認する前に、どのファイルを送るか確認します。XMLが壊れていたり画像要素があったりする場合は、保存ファイルを開いて何をダウンロードしたか確かめます。必要に応じて、既存の結果をもう一度ダウンロードします。新しい変換は、不足している出力を復旧できないか、元画像の再トレースが必要だと確認したときに作成します。PerfectVector MCPのトラブルシューティング

よくある質問

フォルダー全体を1件のリクエストで変換できますか?

PerfectVectorはアカウントごとに一度に1枚を処理します。Claude Codeを使えば、元画像ごとに変換を分け、想定したSVGの保存先を指定しながらフォルダー内の処理を進められます。PerfectVectorの変換ガイド · PerfectVectorのトラブルシューティング

SVGがすでにいくつかある場合はどうしますか?

出力フォルダーに置いたまま、先に検査します。形を目で確かめ、検証したファイルを完了済みにします。不足しているファイルは、新たに承認する前に既存の変換を調べてください。PerfectVectorのクレジットとダウンロード

参考資料

  1. Anthropic — MCPでClaude Codeをツールに接続する — リモートツールの設定。
  2. PerfectVector — アシスタントの接続 — Claude Codeの設定手順。
  3. PerfectVector — 画像を変換する — ローカルパスでの受け渡し。
  4. PerfectVector — 画像の要件 — 対応するラスター入力。
  5. PerfectVector — クレジットとダウンロード — 受け渡し時の課金と結果の取得。
  6. PerfectVector — トラブルシューティング — 順次処理と中断したリクエストへの対応。

PerfectVector MCPを開くと、Claude Codeへの接続方法を確認できます。画像を2枚選んで異なるSVGパスを書き出し、出力フォルダーをローカルで検査します。報告されたパスが計画と一致することを確認してから処理対象を増やしてください。

ブログのその他の記事

PerfectVector

画像を
きれいで編集可能なベクターパスに変換

ベクター化とプレビューの確認は無料で、1日あたりの上限はありません。