無料で使えるSVGエディタを比較してみた

2018年4月3日エディタSVG, 比較

SVG(Scalable Vector Graphics)は古くからあるベクター画像形式ですのでエディタも沢山ありますが、今の用途や仕組みに求められる条件を満たす無料のエディタは限られています
色々触ってみたなかで機能や好みを考慮した3つのエディタを比較してみようと思います

Inkscape

Inkscape はベクター画像を作成・編集できる無料のWindows、macのアプリケーション
svg編集にも対応していて高機能
高機能ゆえの複雑さと機能重視でインターフェースが玄人より

Vectr

vectrはブラウザでSVGを作成・編集できる無料のWEBツール
ダウンロードするソフト版も用意されている

BoxySVG

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

ブラウザでsvgを作成・編集できるWEBツール

2018年4月3日エディタSVG, 比較

Posted by Yousuke.U