無料で使えるSVGエディタを比較してみた
SVG（Scalable Vector Graphics）は古くからあるベクター画像形式ですのでエディタも沢山ありますが、今の用途や仕組みに求められる条件を満たす無料のエディタは限られています
色々触ってみたなかで機能や好みを考慮した３つのエディタを比較してみようと思います
Inkscape
https://inkscape.org/ja/
Inkscape はベクター画像を作成・編集できる無料のWindows、macのアプリケーション
svg編集にも対応していて高機能
高機能ゆえの複雑さと機能重視でインターフェースが玄人より
Vectr
https://vectr.com/
vectrはブラウザでSVGを作成・編集できる無料のWEBツール
ダウンロードするソフト版も用意されている
BoxySVG
https://boxy-svg.com/
BoxySVGは無料で使えるchrome拡張機能だったけどWindows・Mac用のソフト版の提供も始めました
残念ながら現在は無料期間以降は有料となっていますが、10ドル
chromeの拡張機能機能版は979円で無料期間以降も利用できるようになります
機能比較
3DBOXのみ
| 機能 | Inkscape | Vectr | BoxySVG |
|---|---|---|---|
| 多角形 | |||
| 円 | |||
| ベジェ曲線 | |||
| PoliLine | |||
| path | |||
| pathの追加 | |||
| pathの削除 | |||
| pathの結合 | |||
| path間の操作 | 近くのパスで補完またはpathの追加 | 常にpathを追加 | 近くのパスで補完またはpathの追加 |
| フォント | |||
| フォント種類 | 100+ | 100+ | 100+ |
| フォントｲをpathに変換 | |||
| フィルタ | |||
| 透明度 | |||
| シャドウ | |||
| グラデーション | |||
| グループ | |||
| グループ化 | |||
| レイヤー | |||
| レイヤー | |||
| レイヤー名の変更 | |||
| inpo-to/ekusupo-to操作 | |||
| ショートカット | |||
| ショートカットの追加 | |||
| インポート・エクスポート | |||
| 複数ファイルの編集 | |||
| PNG | |||
| JPEG | |||
| WebP | |||
| SVGZ | |||
| レイヤー名をidに | |||
| レイヤー名をtitleに | |||
| 小数点以下の数値 | 整理可 | ||
と作ってみたもののおおよそ必要な機能は比較するまでもなく揃っていますね
※なんか表の中身が消えてて泣いた、すんません
個人的比較
まず多機能という面では「Inkscape」一択になります
ただ作るSVGの目的、フィルターやグラデーション、テクスチャなどを使わなかったり要件を満たしてるのであれば「Vectr」や「BoxySVG」の方が使いやすくて良いかな思います
1000円程とはいえ、有料になってしまいましたが「BoxySVG」が僕の用途ではやはり使いやすさと機能面で一番かも
path間のラインを触った時の補完が凄い良い感じ、「Inkscape」だとかなり拡大してやらないとカクつく
エクスポートのSVGZ（圧縮SVG）も良いですね
あとはレイヤー名（アイテム名）がidに付いてくれて小数点以下の整理ができれば最高ですね
要望はある部分だと思うのでアプデに期待です
「Vectr」は操作性とかもう一声ですが十分といえば十分
インポート時に同じアイテムが増えてしまうバグがあったのでしっかりは使えていないです
現状も開発ロードマップを公開しているなど機能追加に期待できますね
それ以外のSVGエディタ
現在もアップデートされている（であろう）エディタまとめ
Method Draw
http://editor.method.ac/
ブラウザでsvgを作成・編集できるWEBツール