PlantUMLでのシーケンス図作成方法

こんにちは、みよしやです。

今回は、 ‘VSCode + PlantUML を使ったシーケンス図の作成方法’ について書いていこうと思います。

PlantUML とは

PlantUMLは、UML図を素早く書くことができるコンポーネントです。
プレビューを確認しながらテキストベースで作成することが可能です。

UMLとは

UML(Unified Modeling Language)は、機能や構造を図で表現する記法のひとつです。
ルールを統一することで設計書の可読性向上やコミュニケーションの効率化が期待できます。
UML図には以下の種類が存在します。
・クラス図
・コンポーネント図
・配置図
・オブジェクト図
・コンポジット構造図
・パッケージ図
・ユースケース図
・シーケンス図
・コミュニケーション図
・タイミング図
・相互作用概要図
・ステートマシン図
・アクティビティ図

本記事ではこの中のシーケンス図の書き方にフォーカスします。

環境構築

まず、公式サイトからVSCodeとJavaをダウンロード・インストールしてください。
https://code.visualstudio.com/
https://java.com/ja/
(MacやLinuxの場合はターミナルからインストールできます。)

次に、VSCodeを起動し、拡張機能メニューからPlantUMLを検索してインストールします。

シーケンス図の作成

拡張子「.pu」のファイルを作成し、下記PlantUMLコードを入力します。
( Alt + D で右側にプレビュー画面が表示されます。)

@startuml
title サンプルシーケンス
obj01 -> obj03: RequestA
obj03 --> obj01: ResponseA
obj01 -> obj02: RequestB
obj02 --> obj01: ResponseB
@enduml

メッセージを繋いだ順で自動的オブジェクトが並べられてしまうため、
上記の書き方だと意図していない並び順になっています。

下記のようにparticipant で定義することで並び順を指定することが可能です。

@startuml
title サンプルシーケンス
participant obj01
participant obj02
participant obj03
obj01 -> obj03: RequestA
obj03 --> obj01: ResponseA
obj01 -> obj02: RequestB
obj02 --> obj01: ResponseB
@enduml@enduml

最後に

図形を貼り付けたりレイアウトを整える手間が無いため
テキストベースで書けるPlantUMLはとても便利だと思います。

UML図を書く機会があったらぜひ使ってみてください。