概要

作図ツールの選択肢はいくつかありますが、下記の点に魅力を感じ、PlantUML（ http://plantuml.com/ja/ ）を選択しました。

ソースコードから画像を出力できる
バージョン管理できる（差分を見られる！）
レイアウトの微調整を自動でやってくれる

機能

シーケンス図、ユースケース図、クラス図、アクティビティ図、状態遷移図（ステートマシン図）などのUMLの作成だけでなく、ガントチャートやER図も作成できるようです。（私はUML以外では使用したことはありません）
画像の出力形式は、png, svg, eps, pdf, vdx, xmi, scxml, htmlに対応しています。
オンラインジェネレータ（ http://plantuml.com/ja/ ）もあるので、試用の上、検討すると良いかもしれませんね！

準備

Visual Studio Code（VSCode）＋ PlantUMLのプラグインを使いました。

VSCodeをインストール

https://code.visualstudio.com/ からダウンロードしてインストールします。

Javaをインストール

PlantUMLを実行するためにはJavaが必要です。
https://java.com/ja/ からダウンロードしてインストールします。

Graphvizをインストール

GraphvizはPlantUMLのソースファイルからUMLの画像ファイルを生成する際に必要となります。
http://www.graphviz.org/ からダウンロードしてインストールします。

VSCodeにPlantUMLをインストール

VSCodeを起動
ウィンドウの左下にある歯車アイコンをクリックして EXTENSIONSを開く。
検索窓に PlantUMLと入力すると、PlantUML Rich PlantUML support for Visual Studio Code.が現れるので、Install

（`Ctrl + P`→`ext install plantuml`だと早いみたい）

VSCodeを再起動

以上で、準備は完了！

使い方

1.ファイルを新規作成し、***.puで保存

2.試しにユースケース図を書いてみます。
詳細な説明は割愛しますが、図とサンプルコードを交互に眺めると書き方が掴めてくると思います。

.pu

@startuml

:管理者: as admin
:一般ユーザ: as user
(ユースケース) as use

admin -> use
user ..> use

note bottom of admin : 図中にコメントを書けます
note right of use
  このユースケースは、
  サンプルです。
end note

@enduml

3.Alt + Dでプレビューを見ることができます。

4.画像を出力する
Ctrl + Shift + Pでコマンドパレットを開き、plantと入力すると、PlantUML: Export Current Diagramが表示されるので選択します。画像形式を選択すると、ファイルがエクスポートされます。

こんな感じで簡単に図を作ることができます！

感想

最初はレイアウトが思ったように整わずもどかしいですが、慣れてくると綺麗にレイアウトできるようになると思います。（->を-->にしてみたり、-left->とかにしてみたり）
gitでバージョン管理できるのは素晴らしい。切り戻しが楽！

バージョン情報

VSCode：1.36.1
PlantUML：2.11.2
Graphviz：2.38