Excalidrawとは何ですか？

手描き風のスタイルでホワイトボードのように自由に図を描けるオープンソースツール。リアルタイム共同編集にも対応している。

Excalidrawのポイントは？

手描き風のスタイルが特徴のオンラインホワイトボード・作図ツール。ブラウザ上で動作し、リアルタイムの共同編集でチームでのブレストや設計議論に最適。シンプルなUIで直感的に使え、テキスト・矢印・図形を自由に配置できる。VSCode拡張やObsidianプラグインなど、エディタとの統合も充実

【エクスカリドロー】

Excalidraw とは？

💡 デジタルなのに温かみのある手描き風ホワイトボード

📌 このページのポイント

手描き風のスタイルが特徴のオンラインホワイトボード・作図ツール
ブラウザ上で動作し、リアルタイムの共同編集でチームでのブレストや設計議論に最適
シンプルなUIで直感的に使え、テキスト・矢印・図形を自由に配置できる
VSCode拡張やObsidianプラグインなど、エディタとの統合も充実

Excalidrawの手描き風ホワイトボードのイメージ

ひよこ

Excalidrawって手描きっぽい図が描けるの？

ペンギン先生

そうだよ。線や文字がちょっとゆらいだ手描き風のスタイルで描画されるんだ。PowerPointみたいにカチッとした図ではなく、ホワイトボードに書いたような温かみのある見た目になるよ

ひよこ

どんなときに使うの？

ペンギン先生

設計の初期段階でアイデアをざっくり図にしたいときや、チームでブレインストーミングするときに最適だよ。リアルタイムの共同編集ができるから、オンラインミーティング中にみんなで同じキャンバスに書き込めるんだ

ひよこ

draw.ioとはどう使い分けるの？

ペンギン先生

draw.ioは正式な技術ドキュメント用の図、Excalidrawはアイデア出しやラフスケッチ用、と使い分けるのがおすすめだよ。Excalidrawの手描き風スタイルは「これはまだ確定じゃないよ」というメッセージにもなるから、レビュー段階の図にぴったりなんだ

ひよこ

データはどこに保存されるの？

ペンギン先生

デフォルトではブラウザのローカルストレージに保存されるよ。ファイルとしてエクスポートもできて、.excalidraw形式はJSONベースだからGitで管理もできるんだ。画像としてPNGやSVGに書き出すこともできるよ

ひよこ

エンジニアに人気があるって聞いたけど、なぜなの？

ペンギン先生

まず完全に無料でオープンソースなこと。そしてVSCode拡張やObsidianプラグインがあってエディタ内で直接使えること。さらにライブラリ機能で回路図やAWSアイコンなどの素材を読み込めるんだ。React製のコンポーネントとして自分のアプリに組み込むこともできるから、技術ブログにExcalidrawの図を埋め込んでいる人も多いよ

まとめ：ざっくりこれだけ覚えればOK！

「Excalidraw」って出てきたら「手描き風のスタイルでチームと一緒に図を描けるツール」と思えればだいたいOK！

📖 おまけ：英語の意味

「Excalidraw」＝ Excalibur + Draw

💬 伝説の剣「エクスカリバー（Excalibur）」と「描く（Draw）」を組み合わせた造語だよ。ペン一本で何でも描ける、という意味が込められているね

← 用語集にもどる