Warning: Undefined array key "host" in /home/azuldesign/mrzw-design.com/public_html/wp-content/themes/simplicity2/lib/punycode.php on line 80
こんにちは、デザイナー・ブロガーの
ゆっきー（@elcielo_design）です。
今回は、「Adobe Illustrator」の代わりに
使える無料ツールを紹介しようと思います。
この記事の目次
無料でも優れたベクター画像作成
ツールは意外に沢山ある。
Webデザインやグラフィックデザインを
制作する上でソフトは欠かせないもの。
本格的にデザインの制作を取り組んだり、
プロのデザイナーを目指しているなら
デザイン業界で良く使われている有料の
ソフトに目が行きがちだと思います。
デザイン業界で特に有名だから、
「Adobe Illustrator CC」
「CorelDRAW Graphics Suite」など
を購入するのは悪いことではないですが、、
実は、あまり知られてないだけであって、
有料のデザインソフトに匹敵するくらいの
無料のデザインツールも沢山存在します。
なので、この記事ではそういった無料で
優秀なベクター画像の作成ツールを
比較して特徴を一通りまとめました。
特に、ちょっとしたデザインをしたい人や
ソフトにそこまでお金をかけれない人など
確認して欲しいものになっています。
ベクター画像
ベクター画像とは簡単に言えば、
拡大縮小や変形で荒くならない画像のこと。
描画のに、アンカーポイントと呼ばれる点と、
それらを繋いだ直線やカーブで構成される。
なお、Adobe CCが少し高いなと感じて
ベクター画像作成ツールを探していたなら、
次記事で安く購入する方法を紹介しています。
無料のベクター画像(SVG)作成ツール
「無料ベクター画像作成ツールの比較」
| 無料ツール | おすすめ度 | 特徴 |
| Inkscape |
★ ★ ★ ★ ★ | Illustratorに変わるフリーソフトの王道 |
| Vectr | ★ ★ ★ ★ ☆ | 基本的なベクター制作機能を全てカバー インターフェイスもシンプルで使い易い。 |
| Gravit Designer | ★ ★ ★ ★ ☆ | Inkscape、Vectrの機能に並ぶツール。 Vectrと同じく直感的に利用できる。 |
| Boxy SVG | ★ ★ ★ ★ ☆ | 動作・ファイル読み込み・書き出しも 素早くできるオールラウンドのツール。 |
| Method Draw | ★ ★ ★ ☆ ☆ | ベクター画像作成ツールの中でも、 複雑な機能がなくとてもシンプルなもの |
| SVG-edit | ★ ★ ☆ ☆ ☆ | ベクター画像制作の標準的機能が整う。 昔のペイントソフトを思い出すツール。 |
| Janvas | ★ ★ ★ ☆ ☆ | 13〜14年頃人気があったベクターツール |
| DRAW SVG | ★ ★ ☆ ☆ ☆ | SVG-editと同じように昔のデザイン |
| primalDraw | ★ ★ ☆ ☆ ☆ | ベクター画像作成の一般的な機能がある 分かりやすいUIデザイン設計。 |
| LaTeXDraw | ★ ★ ☆ ☆ ☆ | 図形やグラフ、イラストを作るときに 利用されている少し高度なソフト。 |
| FatPaint | ★ ★ ☆ ☆ ☆ | 90年代頃のレトロなデザインができる。 |
| rollApp | ★ ★ ★ ☆ ☆ | アプリケーションを任意のデバイス上で Webアプリで動作チェックできるツール |
※ ★がある程、各度合いは高い。
※ 「おすすめ度」はぼくの経験した感じです。
以下では、それぞれ詳しく紹介しています。
① Inkscape (インクスケープ)
Inkscapeはオープンソースで開発された
ベクトル画像編集ソフト (エディター)。
ベクターアプリ版GIMPとも呼ばれていて、
無料でありながら多数の機能が整っている。
(有料として販売していてもおかしくない。)
Adobe Illustratorのワークフローに
一番似ていて慣れれば代用として使えます。
| ソフト名 | Inkscape (インクスケープ) |
| 開発元 | The Inkscape Team |
| 利用環境 | macOS・Windows・Linux |
| 価格 | 無料 |
| 入手方法 | 公式サイトよりダウンロード (macの場合は「XQuartz」というシステムの ダウンロードが必要) |
| チュートリアル (基本操作) |
・公式サイトに初心者から上級者まで 幅広いコンテンツが準備されている。 ・YouTubeでは「Logos by Nick」の チャンネルでInkscapeを見て学べる。 |
| 特徴 | ・多機能でありIllustratorに匹敵する互換性 ・複雑な手描きのベクター画像の制作が可能 ・ペンタブも快適に使える。 ・拡張機能も豊富 ・2003年にリリース、90の言語に対応。 ・ビットマップトレース機能もあるが、 Illustratorまでは高度でない。 ・SVG、JPG、PNG、PostScript等の 一般的なファイル形式をサポート。 |
| その他 | ・たまにサイズが大きいファイルだと、 パフォーマンスエラーになるので注意。 |
Inkscape (インクスケープ)
② Vectr
Vectrは、Inkscapeと違っていて、
数年前に公開された新しめのソフト。
ですが、定期的なアップロードも多く、
どんどん良くなっている注目を置かれる
無料のベックターツールの１つです。
インターフェイスもシンプルで、
初心者ユーザーからベテランユーザーまで
どんな人でも使い勝手が良いと思います。
| ソフト名 | Vectr |
| 開発元 | Vectr Labs Inc. |
| 利用環境 | macOS・Windows・Linux・Chrome |
| 価格 | 無料 |
| 入手方法 | 公式サイトよりダウンロード (使用にはアカウント登録が必要。) |
| チュートリアル (基本操作) |
・公式サイトに初心者から上級者まで 幅広いコンテンツが準備されている。 |
| 特徴 | ・基本的な機能を全てカバー ・チュートリアルを見なくても 数分で直感的に使える機能設計。 ・ダウンロード版以外にオンライン版もあり ネットの環境があればどこでも操作が可能。 ・作成画像を直接リンク、埋め込みなど SVGのホスティングサービスとして使える。 ・プロジェクトの共有、管理がしやすい。 (Google Docに似たワークフロー) ・WordPresに導入が可能。 ・Ai、ESP、SVG、PNG、JPGなどの形式で インポートが可能になっている。 |
| その他 | ・SVGファイルを他から取り組む際に たまに上手くいかないことがある。 |
「WordPressで使われている動画」
Vectr
③ Gravit Designer
(グラビット デザイナー)
Gravit Designerは、無料で使える
ベクター画像編集・作成ツールです。
機能は、InkscapeとVectrの間ぐらいで
Vectrと同じく直感的に利用できます。
| ソフト名 | Gravit Designer (グラビット デザイナー) |
| 開発元 | Gravit社 |
| 利用環境 | macOS・Windows・Linux・Chrome OS |
| 価格 | 無料 |
| 入手方法 | 公式サイトよりダウンロード (使用にはアカウント登録が必要。) |
| チュートリアル (基本操作) |
公式YouTubeチャンネルで基本操作から、 難しいデザイン制作方法など閲覧できる。 |
| 特徴 | ・直感的なUIデザインとワークフロー (Photoshop＋Power Pointのような画面) ・ベクター画像制作で必要な機能は しっかり問題なく用意されている。 ・ツール内には、イラストやアイコン、図形 絵文字等のベクター素材セットが豊富。 (それを用いたデザインは、商用利用も可能) ・プロジェクトを違うプラットフォームから 取り込んで編集ができる。 ・JPEG、PDF、SVG、EPS、Sketch等の 形式のエクスポート・インポートに対応。 ・利用開始15日間はPRO版が使える。 |
| その他 | ・Inkscapeのように高度なソフトではない。 |
Gravit Designer
④ Boxy SVG
Boxy SVGはChromeアプリとして出ている
シンプルな無料のベクター画像制作ツール。
| ソフト名 | Boxy SVG |
| 開発元 | Jaroslaw Foksa |
| 利用環境 | macOS・Windows・Chrome OS |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
|
| 特徴 | ・ベクトル作成ツールが一式搭載。 ・適切で効率的で、分かりやすいSVG設計。 ・UIオプションを制限しSVGの特長が体験可 ・コードインスペクターあり。 |
| その他 |
Boxy SVG
⑤ Method Draw
Method Drawは、とてもシンプルで
動作も快適なベクター画像制作ツール。
| ソフト名 | Method Draw |
| 開発元 | Mark MacKay |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
|
| 特徴 | ・高機能ではないが動作も軽く 基本機能もしっかり整っている。 |
| その他 | ・SVGファイルの読み込みの際に 編集できないパスが発生する時がある。 |
Method Draw
⑥ SVG-edit
SVG-editは、Webベースで
オープンソースのベクターツール。
ベクター画像制作の標準的機能が整った
だいぶシンプルなインターフェイスです。
(2000年頃のペイントソフトを思い出しそう。)
| ソフト名 | SVG-edit |
| 開発元 | SVG-edit Team |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
「Github」 |
| 特徴 | ・JavaScriptで開発したSVG編集用エディタ ・オープンソース型プログラムをサイトに 埋め込み・自由に作成と編集ができる。 ・サーバーでの機能はなくブラウザで機能。 ・他ツールより機能は少なめ。 ・ノードの管理はそこまで完璧でない。 ・Githubポジトリでソースコード変更可能。 ・SVG、WMP、JPG、BMP、GIF、TIFF等の 一般的なファイル形式にエクスポート可能。 |
| その他 |
SVG-edit
⑦ Janvas
Janvasは、2013年〜2014年頃に
かなり人気があったベクターツール。
まだ利用はできますが、他のツールと
比べると少し機能面で衰えてしまいます。
| ソフト名 | Janvas |
| 開発元 | Canvas.com |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
|
| 特徴 | ・テキスト、シェイプ、レイヤー、 描画ツール、バス、マスク等の機能があり。 |
| その他 | ・ファイル保存の時、ブラウザで ログインして接続の許可が必要。 |
Janvas
⑧ DRAW SVG
DRAW SVGは、多くの機能を搭載した
スタンダードなSVGエディターソフト。
| ソフト名 | DRAW SVG |
| 開発元 | DRAW SVG |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
|
| 特徴 | ・オブジェクトの描画、レンダリング、修正 基本的なシェイプ、ベジェ曲線などが可能。 ・メニューが左側にあり、クリックし開く タイプのサブメニューがある。 |
| その他 | ・SVGからPNGにエクスポートができる。 |
DRAW SVG
⑨ primalDraw
primalDrawはベクター画像を作成可能な
無料のWebツールの１つになります。
| ソフト名 | primalDraw |
| 開発元 | Armen Ovakimyan |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
|
| 特徴 | ・ブラウザ上でシンプルなベクター画像を 作成できる一般的な機能がある。 ・分かりやすいUIデザイン設計。 |
| 補足 | ・SVG、JPEG、PNG等による書き出し可能。 |
primalDraw
⑩ LaTeXDraw
LaTeXDrawは、LaTeX用のグラフィカルな
オープンソースのPSTricksコードジェネレータ、
またはPSTricksエディターになります。
| ソフト名 | LaTeXDraw |
| 開発元 | IntelliJ Idea |
| 利用環境 | macOS・Windows・Linux |
| 価格 | 無料 |
| 入手方法 | 公式サイトよりダウンロード |
| チュートリアル (基本操作) |
|
| 特徴 | ・数学や物理の教科書等で見るような 図形やグラフ、イラストを作るときに 利用されている少し高度なソフト。 |
| その他 | ・Javaで開発され、OSから独立している。 |
LaTeXDraw
⑪ FatPaint
FatPaintもベクター画像が
制作できるツールの１つ。
| ソフト名 | FatPaint |
| 開発元 | Mersica Inc. |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトより利用 |
| チュートリアル (基本操作) |
|
| 特徴 | ・90年代頃のレトロなデザインが可能？ ・webブラフィックやロゴなど十分に 制作できる基本機能がある。 |
| その他 | ・商用のために利用する場合は、 Proバージョンへの定額制に変更が必要。 |
FatPaint
⑫ rollApp
rollAppはInkscapeなど色んなデスクトップ
アプリケーションを任意のデバイス上で、
Webアプリで動作チェックできるツール。
(ツール自体はベクター描画ソフトではない。)
つまり、単一のアプリで使うものでなく、
アプリのパッケージにあたるもので
Web版SVGエディターはそのうちの1つ。
| ソフト名 | rollApp |
| 開発元 | rollApp Inc. |
| 利用環境 | Web |
| 価格 | 無料 |
| 入手方法 | 公式サイトよりダウンロード |
| チュートリアル (基本操作) |
|
| 特徴 | ・rollAppでのInkscapeは便利。 (Inkscapeのブラウザーベイスのバージョン) ・サーバーでアクションを行なっているで、 大きくて複雑なファイルの編集は不向き。 |
| その他 | ・使用にはアカウントの登録が必要。 |
rollApp
まとめ
以上がAdobe Illustratorの代用にも使える
ベクター画像作成ツールの紹介でした。
12つもあると迷うかもしれませんが、
特に以下4つは使っている人も多いので
抑えてきたい無料のツールですね。
- Inkscape (インクスケープ)
Illustratorに変わるフリーソフトと聞けば
大体一番に挙がってくる有名なソフト。 -
Vectr
基本的なベクター画像作成機能を全てカバー。
初心者からプロまで直感的に使えるツール。 - Gravit Designer (グラビット デザイナー)
InkscapeとVectrに並ぶレベルのツール。
-
Boxy SVG
シンプルでわかりやすいツールの１つ。
個人的にスムーズに編集・制作などできる。
※ 「Inkscape」以外はオンライン上の
サービもあるのでダウンロードの手間がいらず、
パソコン環境があればどこでも使えるので便利。
ブラウザ上で作成ツールできるものも
最近はかなり多いくなってきました。
今使っているIllustratorなどが使えない時、
または有料ソフトまではいらないけれども
デザインやイラスト制作などをしたい人は
一度、使って見ると良いと思います。
なお、デザインツールを探している人は、
以下の記事でも、他のデザイン系ソフトや
お絵描きソフト・アプリをまとめてるので、
是非、参考にしてみて下さいね。
