最強のドローツール「draw.io」 - Alecriar Studioの中の人の技術メモ

皆さんはフローチャートやちょっとした図解用の絵を描くときのドローツールはどのようなものを使用していますか？当方は正直なところ、今までこの手のツールには無関心でした。いざ必要になれば、Windowsに最初から備わっているペイントや、Photoshopを使えば十分だろうと。

でもペイントってシンプルなのですが使いづらいですよね。単純な円や四角ならともかく、ちょっと凝った図形を作ったり、フローチャートのような複雑な図面を描こうと思えば、一つ一つ図形を書き込んでいかないといけないので大変です。Photoshopはそもそも写真加工用なので、このような作業は苦手です。

ならば、ということで本腰を入れドローに適したツールを探してみたところ、とても優秀なサービスがありました。draw.ioです。

draw.ioはオンラインで使用できるドローツールです。ブラウザとネット環境さえあればどこにいても使えるのはメリットです。結論から言えば、かゆいところに手が届くとてもいいサービスです。やりたいと思っていることが直感的にできます。ペイントとは何だったのか。

サイトにアクセスするとすぐさま保存場所を聞いてきます。Google Drive、OneDrive、Dropbox、GitHub、GitLabといったオンラインストレージに直に保存できますので、アカウントをお持ちの方はこちらが便利でしょう。また、Deviceを選べばローカルにも保存できます。

その後すぐに編集画面に移行します。トップページすらスキップして編集できるのがいいですね。画面はGoogle Driveとよく似ていますので、そちらに慣れている方は戸惑いもなくすぐに慣れると思います。

まず驚くのが、テンプレートの数が非常に豊富です。ビジネスやチャートといったプレゼンテーションで使用できそうな一般的なものから、エンジニアリングやUMLといった技術的なものまで色々取り揃えており、一から描き起こすより遥かに高品質なものが用意されています。

それに加え、図形（パーツ）の種類も豊富です。全部で800個以上用意されているそうです。大抵の表現はできそうです。

日本人の方なら日本語対応が気になると思いますが、ファイル名やメニュー表示、図形内など、ほとんどの箇所は日本語表示が可能となっています。

フォントについてはそのまま日本語を入力すれば自動的に日本語が表示できますが、「メイリオ」などあえて指定のフォントを使用したい場合は「カスタム」で直接フォント名を指定すればそのフォントで表示してくれます。

保存は最初に選択した場所に行ってくれますが、メニューから「形式を指定してエクスポート」を選べば指定の形式でローカルに保存もできます。現状ではPNG、JPEG、SVG、PDF、VSDX、HTML、XML、URLが選択できます。

こちらの図は次回以降の記事で使用する予定です。

draw.ioは優れたドローツールです。こちらを使用すれば大抵の図が作成でき、ペイント等には戻れません。ドローツールに迷われた方はdraw.ioを試してみてはいかがでしょうか。