エンジニアのための無料で使えるドローイングツールまとめ

eyecatch
617件のシェア(とっても話題の記事)

今回は、ローチャート、UML、システム構成図、などなどなど、 エンジニアがよく使いそうな図を書くためのツールを紹介したいと思います。
無料でMac/Windowsの両OSで使えるという条件でチョイスしてみました。
(あ、タイトルには「エンジニアのための」と書きましたが、今回紹介するのは別にエンジニア専用のツールではないです(念の為))

汎用的

とりあえず、色々な図が書けそうなツール

Cacoo

cacoo1cacoo2

【URL】

https://cacoo.com

【特徴】
  • 無料版では25シートまで
  • 無料版での書き出しはPNGのみ
  • だいたい何でも書ける
  • 複数人でチャットしながら1つの図を作成出来る
【メモ】

特に有料版は高機能だと思う
会社で有料アカウントに入っているのであれば、このツールを使う選択肢で良いと思う

draw.io

draw_io1draw_io2

【URL】

https://www.draw.io/

【特徴】
  • とりあえず会員登録しなくても始められる
  • 書き出しが豊富(PDF,SVG,HTML)
  • 保存先はGoogleドライブ、Dropbox,ローカルなど選べる
  • グリッドが良い感じ
【メモ】

Scratchpadという機能が便利。(よく使うMyパーツグループみたいなのを作っておける)
無料で使うという前提では一番使えると思う

gliffy

gliffy1gliffy2

【URL】

https://www.gliffy.com

【特徴】
  • サイト版だと無料では独自形式(Gliffy)でしか書き出せない
  • Chromeアプリ?のGliffy Diagramsの方はPNG、Jpegで書き出せる
【メモ】

レビューを見るとシンプルで使いやすいと書いてあった。個人的には使ったことがない。

Inkpod

Inkpod1Inkpod2

【URL】

http://inkpod.carabiner.jp

【特徴】
  • 書き出しはラスター形式(JPEG,PNG)、ベクター形式(SVG,EMF+,SWF,PS,PDF)に対応している
  • 図を途中で修正したりするのが凄く楽(形を後から変えられる)
  • 以下の機能を抑えておくと他のツールより書くスピードが速くなると思う
    ---で図形の中に線を引くことが出来る
    [shift]押しながら図形から図形へマウスをドラッグすると矢印が引ける
    線にカーソルをあてて[command]+ピリオドを押すと途中にアイテム追加出来る
【メモ】

すごく良いツールだと思う

マインドマップ

マインドマップはトニー・ブザン(Tony Buzan)が提唱した思考・発想法の一つ。頭の中で起こっていることを目に見えるようにした思考ツールのこと (引用:Wikipedia

Text Mindmap

Text Mindmap

【URL】

https://www.text2mindmap.com

【特徴】
  • テキストを書くと自動的にマインドマップにしてくれる(すごく手軽)
  • 書き出しはPDF、Jpegで書き出せる
【メモ】

図をドラッグした時のエフェクトが好き

XMind

XMind

【URL】

https://jp.xmind.net/

【特徴】
  • 高機能
  • 無料版で書き出し機能は無く、Evernoteに保存できるらしい
【メモ】

使いこなせたら凄そうだけど、残念ながら使ったことがない。(感想)

シーケンス図

オブジェクト間のメッセージの流れを時系列的に表現したいあなたに。

Web Sequence Diagrams

websequencediagrams

【URL】

https://www.websequencediagrams.com/

【特徴】
  • 決められた記法に則ってテキストを書くだけで自動的にシーケンス図が作成される
  • 無料版では書き出しはPNG
【メモ】

図形を置くなどの操作が一切必要無いのが良いと思う

アウトライナー(TODO/Tree などに)

ツリー構造を持ったリストを手軽に作りたい場合に良さそう。(16/6/21 追記)

WorkFlowy

WorkFlowy

【URL】

https://workflowy.com/

【特徴】
  • Tab or shift + Tab で階層切り替え
  • Command + Enter 完了切り替え など
  • 書き出しはFormatted、Plain text(Markdown)、OPML
【メモ】

シンプルでちょっとしたリストを素早く書ける

インフォグラフィック

ンフォグラフィック(英語: infographics)は、情報、データ、知識を視覚的に表現したもの (引用:Wikipedia
ビジュアルに特化した感じの図を書きたいあなたに。

easel.ly

easel.ly1easel.ly2

【URL】

http://www.easel.ly/

【特徴】
  • テンプレートが豊富
  • 書き出しはPDF/Jpeg(High/Low)
  • とりあえず会員登録しなくても始められる
【メモ】

今回取り上げたインフォグラフィックツールの中ではデザインが一番選べる

infogr.am

infogr.am1infogr.am2

【URL】

https://infogr.am/

【特徴】
  • チャートに特化している
  • excelやcsvデータをアップロードして反映させることが可能
  • 無料版ではプライベートシェア、ダウンロードなどは出来ない
【メモ】

色々なチャートを試してみるのに良いかもしれない。

Pikto chart

piktochart1piktochart2

【URL】

http://piktochart.com/

【特徴】
  • 無料版では使えるテンプレートが限られている(10種類くらい)
  • 無料版での書き出しはPNG/Jpeg(MEDIUM)のみ
  • チャート機能もちゃんとあってexcelやcsvをインポートできる
  • Googleのスプレッドシートと連携も可能
【メモ】

(インフォグラフィックツールの中で)ツールとしてのバランスが一番良いと思った。

追記:Markdown風のテキストから図を生成出来るツール

テキスト形式で管理出来るのはすごく便利。(気になっていたものを幾つかメモです)

uiflow

マークダウン風のテキストからUI Flowsのグラフを生成するコンパイラ

https://github.com/hirokidaichi/uiflow

guiflow

uiflowのGUI版。素敵ツール。

https://github.com/hirokidaichi/guiflow

MarkDownDiagram

Markdown風のテキストで、ER図やブロックダイアグラムのようなチャートを描けるツール。ローカルのブラウザ(Chrome推奨)で動作する。こちらも素敵ツール。

https://github.com/wakufactory/MarkDownDiagram

まとめ

改めて、まとめてみて世の中には色々なツールがあるのだなと思いました。用途に併せて使いこなしていきたいです。
上記のツールはどれも無料で始められるので、自分に合ったツールを探してみるのも良いかもしれません。