Learning site for website creation

draw.io の使い方

公開日:2024年07月30日

「draw.io」はブラウザから利用できる作図ツールです。

HTMLのワイヤーフレームやグループ構成図、プログラムのフローチャートを作成する時にも役に立ちます。

「draw.io」の利用準備

「draw.io」にアクセス

https://draw.io

作成した作図の保存先を指定

今回は作業中のPCに保存する為「デバイス」を選択します。必要に応じてGoogleドライブなどを選択することもできます。

編集するファイルを選択

新規ファイル作成

「新規ファイルを作成する」を選択します。

既存ファイルを開く

以前作成したファイルを開いて再編集したい時は「既存のファイルを開く」を選択します。

拡張子「.drawio」のファイルを選択して「開く」をクリックします。

ファイル名入力とテンプレートを選択

画面上部の入力欄にファイル名を指定してテンプレートを選択します。

今回は「白紙ファイル」を選択して「作成する」ボタンを押します。

※この画面がスキップされてしまった場合は、次の項目に進んでください。
 保存する際にファイル名や保存場所を指定できます

保存先とファイル名を確認して「保存」を押します。

作図

作図してキリのいいところで「ファイル」>「保存」をします。

名前を付けて保存

「ファイル名入力とテンプレートを選択」画面がスキップされてしまった場合は、「ファイル」>「名前を付けて保存」を選択します。

保存先とファイル名を指定して「保存」をクリックします。