VectorizeThisについて

実際の作業上の問題を解決するために作ったベクトル化ツール

VectorizeThisは、10年以上の経験と深いWordPressの知識を持ち、実用的なSVGやCSSツールに長年取り組んできたフロントエンド開発者Maxime Desrosiersが作成しました。

VectorizeThisを作ったのは誰ですか?

VectorizeThisの開発者、Maxime Desrosiersです。10年以上にわたりウェブサイトやフロントエンドのインターフェースを開発しており、特にWordPressを得意としています。装飾的なSVGのセクション区切りと、それを使うためのCSSを生成する ShapeDividers.com も作成しました。

ShapeDividersの開発を通じて、SVGの構造と圧縮の重要さを学びました。画面では単純に見えるベクターにも、不要な点、属性、コードが含まれることがあります。生成するCSSを軽く保つために、見た目を維持しながら余分なコードを減らす方法を学びました。

開発した理由

VectorizeThisのきっかけは、ホームページのリニューアルで遭遇した問題でした。ChatGPTに新しいデザインを依頼すると、魅力的なアイコンがいくつか使われていました。元のアイコンは小さすぎたため、1つずつ大きな画像を依頼しました。届いたのはPNGファイルでした。見た目は使えても、サイズが大きく、色を変えにくく、ウェブサイトで管理しづらいものでした。

オンラインの画像からSVGへの変換ツールをいくつか試しました。試した一括変換ツールはトレースが不十分なことが多く、単一ファイル向けツールの中には、必要のない線を追加するものもありました。結果の多くは必要以上に大きく、使用前に SVGOMG で処理する必要がありました。

複数のトレースを評価し、有用な構造を残し、余分なコードを減らしながら、利用者が結果を確認して調整する。この一連の作業を1つのツールでもっと適切に行えるはずだと考えました。

VectorizeThisの機能

VectorizeThisは対応するラスター画像をブラウザ内でSVGパスに変換します。複数のトレース設定を試して候補を比較し、選んだSVGを最適化して、用途に関連するチェックを表示できます。設定の調整、検出した小さなパレットの編集、コードのコピー、個別または一括ダウンロードが可能です。

変換はローカル処理を基本としています。画像のデコード、トレース、比較、SVGの準備は利用者の端末上で行います。製品分析には改善のための操作や設定を記録しますが、元画像のバイト列やファイル名は含めません。画像を送信するのは、利用者がフィードバックに自ら添付して送信に同意した場合だけです。

VectorizeThisによるベクトル化結果の評価方法を見る。

保証していないこと

自動トレースはピクセルの解釈であり、デザイナーの元のベクターファイルを復元するものではありません。写真、グラデーション、圧縮による乱れ、柔らかい影、小さな細部、低解像度の画像は結果に影響します。

加工向けのプリセットやチェックは形状の準備と確認を助けますが、特定のカッター、レーザー、CNC機械、材料、他社アプリケーションに対する認証ではありません。本番前にダウンロードしたSVGを確認し、自分の作業環境でテストしてください。

改善へのご協力

出力に問題がある場合は、変換ツールのフィードバックを送信を使うか、VectorizeThisにお問い合わせください。明確な説明、選んだ用途、問題につながった設定が役立ちます。問題の再現が難しい場合は、任意で元画像を送信できます。

データの取り扱いと利用条件については、プライバシーポリシーと利用規約をご覧ください。

最終更新: