ロゴ · ベクターファイル
生成した SVG のパスが多すぎる理由
ベクターのロゴを頼んだら SVG が返ってきて、エディタで開いてみると、すぐには開かない、きれいに色を変えられない、アンカーポイントが市街地図より多いファイルだった。
原因がトレース側にあることはほとんどありません。原因は与えた画像のほうです。2026年9月21日に同じプロジェクトで両方を実行して測ったところ、差は発注の仕方を変えるに足るほど大きなものでした。
画像トレースが実際にしていること
ベクター化ツールはあなたのロゴを理解していません。色の近い領域を探し、その一つひとつの外側に輪郭を描いているだけです。二色のフラットなマークなら形ごとに領域は二つか三つなので、きれいな輪郭がひと握り出てきます。写真ならそれが何千もあります。グラデーションも影もフィルムの粒子も、ツールから見ればすべて領域の境目だからです。
同じツールがある画像では見事に働き、次の画像では役に立たないのはこのためです。品質を判断しているのではありません。色の領域を数えているだけで、その数を決めたのは画像を選んだあなたです。
測定
同じデモプロジェクトの二枚を、同じツールで数分違いにベクター化しました。そのうえで生成された SVG をそれぞれ取得し、目分量ではなく path 要素を直接数えました。
フラットなロゴマーク——桟橋の杭にカップを載せた二色の線画、背景は白無地——は 5,851 バイトで 8 パス。写真の正方形投稿——港のテーブルのコールドブリュー、階調は全域——は 2,104,374 バイトで 3,908 パスでした。
パス数で 488 倍、ファイルサイズで 360 倍。違いは一つだけ、画像に何が写っていたかです。
二つのファイルはキャンバス上でどう見えるか
並べても違いは見えません。そこが罠です。トレースされた写真は写真に見えます。完全に忠実なベクターファイルであり、まったく使えないロゴでもあります。色は変えられず、看板屋には渡せず、書類に貼ればその書類が重くなります。
トレースされたロゴマークはその逆です。八つのパスとは、選んで、色を変えて、動かせるものが八つあるということです。印刷所が電話をかけてこないファイルです。
SVG を小さくするための画像の頼み方
画像を豊かに見せるものはすべて、トレースを悪くします。下のプロンプトは意図的に貧しくしてあり、それが要点です。
シンプルでフラットなロゴマークを作ってください。桟橋の杭にコーヒーカップが載った、最小限の二色の線画。ネイビーとクリーム、フラットなベクター調、背景は白無地、文字なし、正方形。効いている五つの言葉
フラット。グラデーションなし、やわらかい陰影なし、アンビエントオクルージョンなし。グラデーションは一つ残らず、入れ子になった輪郭の積み重ねに変わります。
二色。色の名前を挙げてください。色が一つ増えるたびに輪郭を取るべき領域が一組増えますし、トレースツールは頼んでもいない中間色を喜んで作り出します。
無地の背景。テクスチャのある背景も写真の背景もそのままトレースされ、たいていパス数を最も押し上げる単独の要因になります。
文字なし。描かれた文字は、文字に見えるだけの輪郭にトレースされます。本物の文字組みは後からエディタで置いてください。そこでなら編集も選択もできたままです。
線画。絵には輪郭があります。レンダリングには光があります。欲しいのは輪郭のほうです。
ファイルの確認と、エージェントにできなかったこと
SVG をテキストエディタで開き、`<path` を検索してください。その件数が答えで、十秒で済みます。おおむね五十パス未満ならロゴです。数百を超えていれば、ロゴのふりをした写真です。
数えるのをエージェントに頼んだところ、できませんでした。変換ツールが返したのはアプリ内の相対リンクで、参照できるソースもファイルサイズの情報もないため、パス数を検証できないという返答でした。ソースを貼れば数えると申し出ました。当てずっぽうの数字ではなくこれが正しい答えですが、確認は自分でやるしかないということでもあります。
すでに巨大なファイルがあり、作り直せないなら、たいていのベクターエディタに単純化やノード削減のコマンドがあります。多少は効きます。ただしトレースされた写真をロゴに変えることはできません。問題はアンカーポイントではなく、そのファイルが写真を記述していることだからです。
SVG についての質問
ロゴのパスは何本くらいが適正ですか
扱いやすいマークはたいてい五本から五十本のあいだに収まります。私たちの二色のフラットなマークは 8 パスになりました。数百本に入った時点で、そのファイルは形ではなく陰影を記述しています。
巨大な SVG は単純化すれば済みますか
ベクターエディタでノードを減らせばファイルは小さくなります。ただしトレースされた写真が編集できるようにはなりません。パスがデザインの部品ではなく階調の領域を記述しているからです。
元の PNG より SVG のほうが大きいのはなぜですか
トレースされた領域が一つずつ座標として保存されるからです。私たちのトレースされた写真は 2.0 MB のパスデータで、JPEG ならそのごく一部の容量で収まる画像を記述していました。
トレースの設定は多少なりとも影響しますか
端のところでは影響します。私たちの実行では、同じツールと同じ設定で 8 パスと 3,908 パスが出ました。効いた変数は入力のほうです。
フラットに生成してから、トレースする
無地の背景に二色のフラットなマークを頼み、SVG に変換し、どこかに送る前にファイルを開いてパスを数えてください。