3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

GitHub CopilotでPlantUMLのシーケンス図作成が爆速になった話(プロンプト&実例つき)

Posted at

:santa: はじめに :santa:

最近、PlantUMLのシーケンス図を書くときにGitHub Copilotの補完がめちゃくちゃ効くと気づきました。
役割(participants)を数行書くだけで、やり取り(メッセージ)やalt/opt/loopなどの構造も“予測でどんどん”広がるので、手で全部タイプしていた頃と比べて体感1/3〜1/2の時間で図が完成します。

この記事では、私が普段使っている書き出しテンプレとプロンプトのコツ、実例、つまづきやすい点をまとめます。


:eyeglasses: 前提 :eyeglasses:

  • VSCode
  • GitHub Copilot(有効化済み)
  • PlantUML拡張(例: jebbs.plantuml
  • Java 環境(拡張機能の要件に準拠)

コツ:最初の3〜5行で“流れ”をCopilotに見せる

Copilotは直前のコンテキストをよく見ます。そこで、最初に以下のようなミニ要件を書いておくと補完の質が一気に上がります。
image.png

書き出しテンプレ

@startuml
' 要件: ユーザーがフロントから音声を送信し、サーバーがAzureで処理して音声を返す
' 期待: 成功フローとエラーフロー、並列でログ記録も入れる
participant User
participant Frontend
participant Server
participant AzureAI as Azure
participant TTS

ここまで書くと、次の1行目の矢印がCopilotからほぼ確実に提案されます。

実例1:基本フロー

以下は、ユーザーが音声を送って処理・応答が返ってくる流れを例にしています。

@startuml
participant User
participant Frontend
participant Server
participant AzureAI as Azure
participant TTS

User -> Frontend: 音声入力開始
Frontend -> Server: 音声バイナリ送信(WebSocket)
Server -> Azure: 音声→テキスト(STT)
Azure --> Server: テキスト
Server -> Azure: 応答生成(LLM)
Azure --> Server: 応答テキスト
Server -> TTS: テキスト→音声
TTS --> Server: 音声
Server --> Frontend: 音声返却
Frontend --> User: 再生
@enduml

実例2:分岐(alt/else)とループ(loop)

分岐や繰り返し処理もCopilotが提案してくれます。

alt STT失敗
  Azure --> Server: エラー
  Server --> Frontend: エラーメッセージ
  Frontend --> User: リトライ案内
else TTS失敗
  TTS --> Server: エラー
  Server --> Frontend: テキストのみ返却
  Frontend --> User: テキスト表示
end

loop チャンクごとに繰り返し
  Frontend -> Server: 音声チャンク送信
  Server -> Azure: チャンク処理
  Azure --> Server: 部分結果
  Server --> Frontend: 部分テキスト/音声
end

:anchor: 補完を誘導するテクニック :anchor:

  1. 粒度をコメントで宣言する
    例: ' 粒度: 高め(チャンクごと)'
    例: ' 粒度: 低め(成功パスのみ)'

  2. 語彙を固定する
    Frontend, Server, Azureなどを最初に定義しておく

  3. 期待を明示する
    例: ' 期待: alt/else と loop を使う'

:relaxed: よく使うスニペット :relaxed:

最小テンプレ

@startuml
' 目的: 〇〇のシーケンス図
participant A
participant B
participant C

A -> B: リクエスト
B -> C: 処理
C --> B: 結果
B --> A: レスポンス
@enduml
alt / loop / par
alt 条件A
  A -> B: Aパス
else 条件B
  A -> C: Bパス
end
loop N回
  A -> B: 繰り返し処理
end

par 並列処理
  A -> B: タスク1
|||
  A -> C: タスク2
end

:runner_tone2: よくあるつまづき :runner_tone2:

  • Copilotが別の図法を提案してしまう
    → ファイルを .puml / .plantuml にして、先頭に @startuml を置く。コメントで「PlantUMLシーケンス図」と明記。

  • participantsの名前がぶれる
    → 最初に全員列挙して as で短い別名を付ける。

  • 提案が長すぎる
    → ' 粒度: 低め' とコメントして調整。

:sunny: まとめ :sunny:

CopilotでPlantUMLを書くと、最初の5行で流れを示すだけで図が伸びる

コメントで粒度・構造・語彙を宣言すると予測の精度が上がる

成功パスを書いたら分岐やループを後付けして肉付けするのがオススメ

「手で全部打つ」から卒業して、書き出しで方向づけ → 提案を取捨選択のスタイルに変えると、PlantUMLは一気に楽になります。

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?