先日、ブログなどに載せる説明図の作成ツールをいろいろ紹介しました。
で、図説ドローツールとしては、CacooやGliffyを紹介しました。
けれども、「draw.io」というのを使ってみたら、完全に無料で利用できるうえに、日本語にも対応、さらには機能も豊富という何拍子も揃った素晴らしいドローツールだったので紹介です。
photo by David Goehring
目次
draw.ioとは
draw.ioは、WEB上で無料で使えるフローチャート作成ツールです。
インストールなどは必要なく、ブラウザからログインも不要で手軽に利用することができます。
通常、こういったドローツールは、「作業シート何枚まで無料であとは有料」などというサービスも多いのですが、draw.ioは完全無料で利用することができます。
やれることが豊富
このツールを利用するだけで、以下のような図を手軽に作成することができます。
チャートなんかも。
こんな回路図なんかも。
もちろんこんなフローも。
関連図。
マインドマップ。
モックアップ。
ネットワーク図。
スケジュール表とか。
ソフトウエアデザインなんかにも。
ベン図。
ワイヤーフレームも作ることができます。
まあとにかく、やれることが豊富で、大抵の図なら作れてしまうと思います。
パーツ（ステンシル）が豊富
これだけのことが簡単にできるのは、最初から用意されているステンシル（図のパーツ）が豊富だからというのもあります。
とりあえず、ざっと数えただけでも845個ものステンシルがデフォルトで用意されています。
カスタムして追加すると、もっとステンシルを増やすことができます。すべて合わせると2000以上（もっとかも）はありそうです。
有料ツールでも、ここまで多いものはそうないような気がします。
保存場所も選べる
保存場所も、Googleドライブ、OneDrive、Dropboxのサービスの中から選ぶこともできます。もちろんローカルディスクにも保存することができます。
好きなクラウドドライブに保存できるのは、どこからでも編集できて便利です。
情報をクラウドにあげたくない場合は、ローカルに保存できるというのもいいですね。
フォントも自由に設定
フォントの設定画面から、「カスタム」を選ぶことで
パソコンに入っているフォントなら、自由に使うことができます。
一度登録すれば、同じブラウザなら手軽に利用できるようになります。
draw.ioは、このようにフォントも自由に設定できます。同じ手軽に使える無料のGliffyは、日本語のフォントは選択できず、全てOSデフォルトのフォントになっていました。
draw.ioは、フォント以外にも随所でこういった細かな設定ができるようになっています。
使い方
draw.ioの使い方は、基本的に以下の2つを押さえておけば、ある程度利用できると思います。
- 配置する
- 図同士を繋ぐ
配置する
まずは、左側のステンシルから、図をドラッグ＆ドロップで作業領域に配置します。
図同士を繋ぐ
あとは、関連するステンシル同士を繋ぐだけです。
他にも設定はいろいろありますが、基本的な動作で、この2つを押さえておけば図の半分以上はできたも同然です。
あとは、ステンシル（図のパーツ）にテキストを挿入したり、大きさを調整したり、色をつけたりして、属性を変更するだけです。
保存
保存もメニューの「ファイル」から「Export as」を選択することで、いろいろな形式で保存することができます。
まとめ
draw.ioを利用すれば、大抵の説明図ならパパパっと作ってしまえるかと思います。
いろいろ使ってみたのですが、ぱっと思いつくだけでも以下の点が素晴らしいです。
- 登録不要で簡単に使い始められる
- 操作が簡単
- 操作が軽い （操作性が良い）
- 日本語対応
- ステンシル（図のパーツ）が豊富
- 機能が豊富（豊かな表現ができる）
- 保存方法を選べる
- 出力方法も豊富（一般画像、PDF、SVG、HTML、iframeで埋め込むなど）
- PCに入っているフォントなら自由に使える（要フォント名入力）
- 完全無料
有料ツールでも、ここまで機能豊富なものは、そうなさそうな気がします。
とりあえず、「図説用のドローツールはどれを使ったらよいかわからない」なんて場合は、draw.ioを選んでおけば、まず間違いないと思います。
素晴らしい記事です。私も時々使用しており全く同感です。一点タイトルに「無料で説明図を作るならドローツール「dwaw.io」に適うものはないかも」とdraw.io→dwaw.ioになっています。あれ、似たツールがあるのかな、と思いました。修正していただければ、このコメントは削除して頂いて構いません。