Draw.io - 各種フローチャートやダイアグラムを作成できるオンラインサービス

S 20190909 114536

プログラミングの処理の流れを記述する図としてフローチャートが有名です。

近年は批判されることも多いフローチャートですが、プログラミングの入門者が処理の流れを把握したい場合、やはり便利な場合もあるかもしれません。

本日紹介する「Draw.io」はこのフローチャートをはじめ、各種ダイアグラムを作成できるオンラインサービス・デスクトップアプリです。Webサービス版はWebブラウザから使用可能で、デスクトップアプリはElectronベースでソースコードも公開されており各種プラットフォームで使用可能です。

以下使用方法を説明します。

Draw.ioの使用方法

Draw.ioを試してみたい場合はWebバージョン使用するのが簡単です。

ブラウザで公式サイトにアクセスし、初回は作成したデータを保存するストレージを選びます。

S 20190909 114605

▲「Google Drive」や「OneDrive」といった各種クラウドストレージのほか、ローカルデバイスを選択することも可能です。

S 20190909 114635

▲「Device」を選択した場合、「Create New Diagram」で新しダイアグラムを作成することができます。ローカルストレージ上のデータを開きたい場合「Open Existing Diagram」を選びます。

S 20190909 114650

▲次にテンプレートを選択します。ビジネスやチャート、クラウド、エンジニアリング、フローチャートなど大量のテンプレートが存在します。空のページから始めたい場合「Basic」の中にある「Blank」を選びます。

メイン画面はグラフィックツールで一般的な構成となっています。

S 20190909 120141

▲左側のエリアでパーツを選択するとパーツを追加することができます。パーツをダブルクリックすると内部の文字を編集できます。パーツの端にマウスカーソルを移動すると青い矢印が表示され、そこで「Ctrl+クリック」するとパーツを複製して接続し、「Shift+クリック」すると接続用の矢印が追加できます。

保存は「File」メニューの「Save」あるいは「Save as」で、画像ファイルとして出力したい場合は「Export as」を実行します。

その他操作方法の詳細はオンラインユーザーマニュアルで確認可能です。

まとめ

Draw.ioを使用するとオンラインで各種図表を作成することができます。

なお、作成した図はあらゆる目的のために無料で利用可能で、すかし等の制限もありません。企業ユーザー向けのサービスを有料で提供することでマネタイズされているようで、運営方法がしっかりしていそうな点も安心できます。

スポンサーリンク