はじめに

現代のソフトウェア工学において、「コードとしての図（DaC）というアプローチは、システムアーキテクチャを文書化する方法を根本から変革しました。VPasCodeは、Visual Paradigm によって開発された、PlantUML、Mermaid、Graphviz などの複数の構文をサポートする統一されたブラウザベースのプラットフォームとして際立っています。図を生成するためにコードを書くことは精度を確保しますが、複数のサブクラスに属性を追加するなど、複雑な構造を手動で更新するのは面倒な作業になりがちです。

VPasCode の AI 駆動図-as-Code ワークフロー：手動コーディングと会話型 UML クラス図の洗練を比較。

ここで登場するのがVPasCode の組み込み AIです。自然言語処理をエディタに直接統合することで、VPasCode は開発者が対話形式で視覚モデルを洗練させることを可能にします。このガイドでは、「AI 変更」機能を活用して、ワークスペースから離れることなく、テキストコードと視覚設計の間のギャップを埋めながら、UML クラス図を瞬時に更新する方法を探ります。

主要な概念

手順に入る前に、関連する中核技術を理解しておくことが役立ちます：

コードとしての図（DaC）：マウスで手動で描画するのではなく、テキストベースのソースコードから図を生成する手法です。これにより、図のバージョン管理が可能になり、容易に再現できます。
PlantUML：UML 図を作成するためにシンプルなテキスト記述を使用する人気のあるオープンソースツールです。以下の例では、PlantUML 構文で顧客, 注文、および支払い.
組み込み AI による変更：コードを往復してコピー＆ペーストする必要がある外部 AI ツールとは異なり、VPasCode の組み込み AI は現在のファイルの文脈を理解します。既存の PlantUML コードを解析し、要求された変更（例：属性の追加）を適用して、コードを自動的に書き直します。
リアルタイムレンダリング：VPasCode は、左側のコードへの変更が右側の視覚図に即座に反映される分割画面ビューを提供し、即時フィードバックを確保します。

ステップバイステップガイド：VPasCode の組み込み AI を使用してクラス図を洗練する

VPasCode内で外部ツールを使わずにクラス図を素早くかつ簡単に洗練させることは、組み込みのAI機能を用いて数ステップで実現できます。

出発点

PlantUMLで定義された基本的な電子商取引のクラス図があると想像してください。あなたは「支払い」というクラスを持っており、その子クラスは3つあります：「現金, 小切手」、および「クレジットカード」です。現在、これらの子クラスは空の殻であり、親クラスから継承するものだけです。

（注：実際のインターフェースでは、これは提供された最初の画像に対応しており、左側にコード、右側にレンダリングされた図が表示されており、子クラスは空です。）

VPasCode インターフェース：空の Cash、Check、Credit 子クラスを持つ基本的な EC 向け PlantUML クラス図を表示。
図1：VPasCode内のクラス図の初期状態。「現金, 小切手」、および「クレジットカード」クラスには特定の属性がありません。

ステップ1：AIメニューを開く

洗練プロセスを開始するには、エディタインターフェース内のAIコントロールを探してください。

「AI」というドロップダウンボタンをクリックしてください。これはコードエディタの上部左側に位置しており、このメニューはインテリジェントな図操作への入り口です。

VPasCode インターフェース：「修正」と「翻訳」オプションが選択された AI ドロップダウンメニューを表示。

図2：AIドロップダウンをクリックすると、図コードを変更または翻訳するオプションが表示されます。

ステップ2：変更オプションを選択する

AIメニューはあなたのニーズに応じて異なる機能を提供します。構造的な変更には、変更機能を使用します。

ドロップダウンメニューから、「変更」というオプションをクリックしてください。隣にはAIアイコンが表示されています。これは、システムに対して新規作成ではなく、既存の図のロジックと構造を変更する意図があることを伝えます。

ステップ 3：希望する変更を記述する

これは、自然言語が手動コーディングに代わる最も重要なステップです。新しい属性の正確な PlantUML 構文を知る必要はありません。望む内容を記述するだけでかまいません。

次のAI 変更ダイアログボックスが表示されたら、図をどのように改良または変更したいかという自然言語による記述を入力してください。
プロンプトの例： 「クラス図における Payment クラスの子クラスにいくつかの属性を追加する」
次のAI 変更ボタンをクリックしてリクエストを送信してください。

VPasCode AI 修正ダイアログボックス：UML 図の Payment クラスの子クラスに属性を追加するためのプロンプトを表示。 図 3：AI 変更ダイアログボックス。ユーザーは自然言語によるプロンプト（1）を入力し、プロセスを開始します（2）。

ステップ 4：改良された図を表示する

プロンプトを送信すると、VPasCode エンジンが動作を開始します。リクエストを分析し、対象となるクラス（Cash, Check, Credit）を特定し、標準的なドメイン知識に基づいて関連する属性とメソッドを注入します。

AI は記述を自動的に処理し、コードを更新して、追加された新しいクラス、属性、またはメソッドを視覚的なクラス図に直接反映します。
結果：以下に示すように、Cashクラスには、cashTendered、Checkクラスには、bankIDおよび銀行名、およびクレジットクラスには番号および有効期限。左側のコードは、右側のビジュアルに合わせて更新されました。

VPasCode 生成の UML クラス図：新しい属性とメソッドを追加して更新された Cash、Check、Credit クラスを表示。

図 4：洗練された図。AI は子クラスに適切な属性とメソッドを正常に追加し、コードとビジュアル表現の両方を更新しました。

結論

VPasCode などの Diagram-as-Code ツールへの AI の統合は、ソフトウェアアーキテクトや開発者の生産性を飛躍的に向上させるものです。この簡単な 4 つのステップに従うだけで、骨格のクラス図を数秒で詳細な設計ドキュメントに変換できます。

「Payment の子に属性を追加する」と入力して、コードと図が同時に更新されるのを見守ることで、手動での構文編集に伴う手間がなくなります。複雑なエンタープライズシステムをモデル化する場合でも、シンプルなアプリケーションの場合でも、VPasCode に組み込まれた AI が、あなたのドキュメントがあなたのアイデアと同じ速度で進化することを保証します。

自分で試してみませんか？VPasCodeにアクセスして、テキストを即座にプロフェッショナルな図に変換し始めましょう

Visual Paradigm の VPasCode に関する参考記事とリソース

以下は、統一されたテキストから図への変換プラットフォームである Visual Paradigm の VPasCode を取り上げた、厳選された記事とリソースの一覧です。これらのリソースは、コア機能、AI 機能、エコシステム統合を理解するために整理されています。

コアガイドと機能概要

Visual Paradigm による VPasCode 完全ガイド：Diagram-as-Code (DaC) の哲学、マルチエンジンアーキテクチャ（PlantUML、Mermaid、Graphviz）、およびコアのデュアルパネルエディタインターフェースを解説する基礎ガイド。
VPasCode の完全マスター：AI 搭載 Diagram-as-Code の究極ガイド：自然言語から図への変換を行う AI チャットボットなど、AI 搭載機能を活用する方法を詳しく解説するチュートリアル、および AI 生成の図を VPasCode エディタに直接転送する方法。
VPasCode 深掘り：Mermaid、PlantUML、AI を一つのプラットフォームで統合：この記事では、プラットフォームが Mermaid、PlantUML、Graphviz をどのようにサポートしているかについて技術的な深掘りを行い、詳細な機能比較と実用的なユースケースを提供します。

クイックスタートと実践ガイド

60 秒クイックスタートガイド | VPasCode テキストから図への変換ガイド：クラウドネイティブエディタを使用して、1 分未満で最初の図を作成、カスタマイズ、共有するためのステップバイステップチュートリアル。
コードから明確さへ：VPasCode と OpenDocs を使用したシームレスな図作成のための初心者ガイド: リアルな図（シーケンス図、C4、クラス図）の作成と、パイプライン統合を介して VPasCode から OpenDocs ドキュメントへ送信する方法を実践的に解説します。

統合とエコシステム

図面作成とドキュメント作成をシームレスに接続：VPasCode が OpenDocs と統合: 直接パイプライン統合を発表し、「OpenDocs パイプラインへ送信」機能を使用して図を生きたドキュメントに変換する方法を詳しく解説します。
OpenDocs を使用してコードベースの図をドキュメントにシームレスに接続: VPasCode が図の作成とドキュメント作成の架け橋として機能し、即時更新を可能にすることで、図が古くなるという問題を解決する方法を説明します。

AI 機能と事例研究

Visual Paradigm – AI 駆動の可視化モデリング: Visual Paradigm の広範な AI エコシステムを紹介し、VPasCode に特化したセクションでは、テキストからの図生成機能や AI によるエラー修正能力を解説します。
VPasCode の新機能 – リリース機能まとめ: 主要機能を紹介するリリースまとめ：複数構文のサポート、AI によるコードエラー修正、グローバルチーム向けの AI 翻訳、および OpenDocs 統合。
事例研究：VPasCode を活用したソフトウェアアーキテクチャドキュメント作成の加速: 自動レイアウト、AI 生成、統一エンジンサポートを通じて、VPasCode がソフトウェアアーキテクチャドキュメント作成をどのように加速するかを示す事例研究。

公式製品ページ

Visual Paradigm VPasCode：統一された図-as-Code プラットフォーム: 対応図タイプ（PlantUML、Mermaid、Graphviz）、中核的な技術機能、およびよくある質問（FAQ）を詳細に記載した公式製品機能ページ。
VPasCode 公式ドキュメントとプレイグラウンド: 無料の VPasCode プレイグラウンドエディタ、公式ドキュメント、およびプラットフォームの最新アップデートにアクセスするための中央ハブ。