複雑な機能を持つシステムやWebサービスの開発においては、情報の整理と共有は重要です。
システム構成図の作成は全体像を把握したり、プロジェクトを円滑に進めたりする上で欠かせません。
しかし「システム構成図って何？」と疑問に思う方や「どうやって作ればいいの？」と戸惑う方も少なくないでしょう。
本記事では、そんなシステム構成図の基本から応用、そしてその作成がもたらすメリットやコツについて分かりやすく解説します。
また、作成を支援する便利なツールも紹介するので、ぜひ最後までご覧ください。
株式会社Jiteraは、独自のAI技術を使った高品質＆最短納期の開発が得意です。システム開発やアプリ開発に関する相談は、気軽にお問い合わせください。
そもそもシステムとは？
そもそも「システム」とは一体何でしょうか。
定義に従うならば「ある目的のために必要な要素が集まってできた組織・体系・手順」です。
これでは、少しわかりにくいですね。
ひとまず大枠では「ある目的を達成するための仕組み」だと考えてもらうのが分かりやすいのではないでしょうか。
- webシステムならば「webを動かすための仕組み」
- 管理システムならば「その情報を管理するための仕組み」
- 業務システムならば「業務を行うのに必要となる仕組み」
では、情報技術（IT）を扱う上での仕組み（システム）とは一体何でしょうか。
IT用語としてのシステム
IT用語でのシステムは、ハードウェア、ソフトウェア、ネットワークといった様々なプログラム及びデジタルデバイスの全体構成を指します。
それぞれ違う機能をもつハードウェアやソフトウェア、OSや周辺機器、場合によってはネットワークを組み合わせ、全体として何らかの機能を発揮する仕組み。
それがシステムです。
非常に簡略化した例となりますが、
| ハードウェア | 利用者のスマートフォン | WindowsPC |
|---|---|---|
| ソフトウェア | QRコード読み取りソフト
Webブラウザ |
売上表を入れたExcel
表から領収書を出すマクロ |
| 周辺機器 | アクリルスタンドに貼り付けたQRコード
スマホに搭載されたカメラ |
プリンタ |
| ネットワーク | サーバーに置かれたwebサイト | 社内LAN |
| ↓ | ↓ | |
| 機能 | 商品の紹介ページの閲覧 | 領収書の印刷 |
といったように、ITシステムは様々な電子機器やIT技術が組み合わさって必要な機能を発揮しています。
システム構成図とは？
システム構成図とは、システムの全体や特定範囲の構成を図で表したものです。
システムの機能やネットワークの構成、サーバーの配置やサービスの連携状況などがグラフィカルに一覧でき、システムの全体像を把握しやすくなります。
システム構成図の基本概念
ITシステムはそれぞれ異なる技術を用いた要素を組み合わせることで機能を発揮します。
しかしシステムの規模が大きくなると、個々の技術や要素は理解できてもシステム全体を把握することができなくなっていきます。
そのため、システム全体の中で個々の要素がどのように組み合わっているのかを明確に表現する手段、つまりシステム構成図が必要になります。
システム全体の繋がりが視覚的に一覧できることで
- 顧客やユーザーへの情報共有
- 現状や将来の変更点の共有
- 提案や要望に対する開発範囲の見える化
- 各担当者の役割範囲の明確化
- 各機能の目的の具体化
がしやすくなります。
システム構成図のメリット
システム構成図を作る最も大きなメリットは「メンバーやクライアント間の情報共有」と「問題特定の効率化」です。
その他にも、システム開発者ならば「拡張性の担保」という魅力も忘れてはいけません。
情報の共有
システム構成図の存在は、関係者同士の「イメージの共有」と「情報の明確化」を後押しします。
クライアントと開発者の間で認識のすり合わせが効率的に行なえ、各機能を担当するチームメンバー同士の連携もスムーズになります。
システム構成図に描かれたシステムの全体像を全員が共有することで、システムの機能と潜在的な課題について誰もが把握することができます。
問題発見の効率化
システム全体を図面で一覧することができるようになれば、現在起こっている問題がどこで起きているのかを明確に把握することができます。
システム構成図によって、開発時に起きる課題や運用時に起きる問題を素早く特定でき、迅速な解決に繋がります。
また、情報が明確に区別されることで、開発サイクルの計画も立てやすくなります。
拡張性の担保（スケーラビリティ）
システム構成図を利用することで、将来起こりうる「追加要求」に対して効率的にシステムを拡張することが出来ます。
例えばシステム構成図があることで、絶対に変更できない機能と変更が可能な機能が明確に区別できます。
どこを更新または交換すべきかを構成図を見ながら議論することもできます。
その他にも、潜在的なボトルネックや、それを回避するために手を加えるべき機能も容易に特定できます。
システム構成図の種類
一言でシステム構成図といっても、どのシステムを重点に置くかによって
- ハードウェアの関係に主眼をおいたシステム構成図
- ネットワークの関係に主眼をおいたネットワーク構成図
- サーバーの繋がりに主眼をおいたサーバー構成図
- ソフトウェアの繋がりに主眼をおいたアプリケーション構成図
- SaaSなどの複数のサービスがどう連携するかを主眼においたサービス構成図
など、様々な書き方があります。
また、近年AWSなどのクラウドコンピューティングサービスが注目を浴びたため、ネットワーク構成図とサーバー構成図、場合によってはサービス構成図も含めて一括で描くインフラ構成図もよく使われています。
何れにせよ、どこまで詳細に書くかは資料の目的に合わせる必要があり、ニーズに合わせて載せる情報を取捨選択する必要があります。
ここでは代表的なシステム構成図、ネットワーク構成図、サーバー構成図について紹介します。
システム構成図
機能を支えるハードウェアの繋がりに主眼を置き、システム全体の構成を表す構成図です。
ニーズや要件によってどこまでの粒度で情報を記載するのかが変わります。
どちらかというとネットワーク情報は省略される傾向があり、システム内で「何が何処で何のために使われているか」を表現します。
システム構成全体のことを「統合システム構成図」、ネットワークを介する場合「Webシステム構成図」と呼ぶことも多いです。
ネットワーク構成図
ネットワーク内のデバイスやコンポーネント、サーバやPCなどの情報と接続関係を表す構成図です。
- ネットワーク機器
- ルータやスイッチなど
- ネットワーク構成要素
- ファイアウォールやDMZ
- プロトコルやポート、トンネリング情報などを書く場合もあります。
- 利用者情報
- ユーザーやクライアントがどのようにネットワークにアクセスしているかも表現します。
などのネットワークを構成する様々な情報を図面に描きます。
ネットワークの物理的な配置状況を明確にすることで、ネットワーク管理者やエンジニアに情報を共有し、ネットワークの設計やセキュリティ対策の確認、トラブルシューティングにも役立てることができます。
サーバー構成図
サーバーやVM、クラウドサービスなどの構成情報や設定、それらがどのように連携しているのかを表す構成図です。
- ハードウェア情報
- サーバーのcpu、メモリ、ストレージ容量などの情報を書きます。
- GPUの性能など目的に合わせた「どんなスペックをもつか」の情報も記載します。
- ソフトウェア情報
- OSやアプリケーションソフトウェアなどの情報を書きます。
- それぞれのバージョンも記載します。
- ネットワーク接続情報
- どのサーバーとどのサーバーが繋がっているか、ポートは何を使いどんなプロトコルで連携しているかなどの情報を記載します。
などのサーバー連携に関わる様々な情報を図面に描きます。
サーバー構成図があることで、システム管理者や運用チームが現状を理解しやすくなり、問題の解決やシステム更新、保守点検などがスムーズに行えるようになります。
システム構成図の書き方・作成手順
では実際にシステム構成図の書き方はどんなものになるでしょうか。
システムの洗い出しや、クライアントへの聞き取り、専門用語の解釈の共有などサービスによって事前準備は様々ですが、大まかな書き方は以下の3手順を踏みます。
- システムの全体像について、適切な情報粒度でまとめる
- イラストやアイコン、文字装飾を使ってわかりやすくする
- 詳細情報を纏めた別紙を作る
システムの全体像を大まかにまとめる
システム構成図に書く情報の粒度は細かすぎても大雑把すぎても読みづらくなります。
必要に応じた粒度で、システムの全体像を簡潔にまとめましょう。
主に、
- システムへアクセスするPCやサーバーの情報
- 繋がっているデータベースなどのハードウェアや周辺機器情報
- 通信経路や外部サービスとの連携情報
などを記載します。
システムの全体像が一覧できることで現在の課題や状況が明確になり、プロジェクトに関わるすべての人と現状認識の共有ができます。
また、システム構成図を定期的に更新し共有することで、システム導入後の保守や点検がスムーズに行なえます。
イラストやアイコンを利用する
大まかにシステムの全体像を記載し終わったら、次はよりシステムの関係性がつかめるようにイラストや装飾を追加していきます。
システム構成図は開発メンバーや専門家だけが見るものではありません。
クライアントとの情報共有に使うケースや、営業や企画などの別部署の人間が参照するケースもよくあります。
ですので、色やアイコンを使って視覚的に誰が見ても分かりやすい図にする必要があります。
特に
- 重要な部分には枠や色をつけて強調する
- イラストやアイコンを用いてイメージしやすくする
- できるだけ簡潔な情報を書く
といった点に気をつけ、各要素の関係が把握しやすいシステム構成図を心がけましょう。
詳細は別紙にまとめる
すべての情報を記載すると、システム構成図が読みづらいものになります。
あくまでシステム全体の把握が目的であるため、細かい詳細情報は別紙にまとめるなどして読みやすさに気をつけることが大切です。
どこまでの情報を図の中に盛り込むのか、参照する詳細情報はどう記載するのかなど、構成図を作る際は事前に記載方式のルールを決めておくと良いでしょう。
システム構成図作成のポイント
システム構成図を作成する際には、「何の情報を指すのか」を明確することが重要です。
特に、
- 各要素の役割はなにか
- それはデータなのか処理なのか
- それはデータの流れなのか制御の流れなのか
といった点は明確に区別しましょう。
抑えるべき各ポイントについて詳しく解説します。
役割が伝わるように書く
システム構成図の目的は、「異なるコンポーネントや要素の役割分担と関連性を視覚的に明確化する」ことです。
そのために、サーバやデータベース、クライアントや外部サービス、周辺機器やネットワーク機器がどのような役割でどこに配置されているのかを明確に記す必要があります。
「このシステムは何をしているのか」を簡潔に記し、「このシステムは何処に繋がっているのか」を矢印やアイコンを使って明瞭に示しましょう。
データと処理を書き分ける
ITシステムは、基本的に「入力データ」を「処理」して「出力データ」を作ることを繰り返しています。
つまりシステムの全体を把握するためには、
- 入力されるデータ
- 適用される処理
- 出力または保存されたデータ
の3つを区別して書けばよいわけです。
データの入力・収集と出力・保存・転送がどこで行われているのか、そしてどんな処理が適用されたのかを明確に区別しましょう。
データフロー図と処理フロー図を併用することで、データと処理の関連性を明確に表すことが出来ます。
データと制御の流れの表現を変える
役割とデータ、処理内容について明確に区分できたら、最後はそのシステムの流れを矢印やアイコンを使って描きます。
その際に、データや通信のフローと制御フローを混同しないように注意して描きましょう。
- データフロー
- データや通信がどの要素からどの要素に移動するかを示します。
- 通常は矢印などで表現することが多いです。
- 制御フロー
- ソフトウェアや処理プロセスが実行される際の流れや順序を示します。
- 通常は構成図の添付資料として、処理フロー図を別途用意して表現します。
- 添付を減らしたい場合は、図面内で別枠に囲って明確にデータフローと区別できるようにします。
システム構成図作成後の注意点
システム構成図を作成したならば、その後の取り扱いにも気をつけましょう。
多くの構成図が、作った時点で満足してしまい、そのまま放置されるという粗雑な扱いをされているケースが多いです。
構成図は言ってしまえば「わかりやすくした取扱説明書」であり、定期的に整備し共有することで真の価値を発揮します。
システム構成図の更新ルールを定める
システム構成図は、バージョン更新や新規導入、外部サービスの終了などで常に変化する可能性があるため、メンテナンスと更新のルールを準備しておくことが重要です。
最低限、以下の3点だけでも事前に決めておきましょう。
- 更新頻度
- 定期的な更新スケジュールを設けることで、システム構成図が最新のシステム状態を反映したものに保つことが出来ます。
- 担当者
- システム構成図のメンテナンスを担当する責任者やチームを決め、責任を明確にしておくことで、メンテナンスが確実に行えるようになります。
- 変更履歴とバージョンの管理方法
- システム構成図は異なるバージョンが混在することも少なく有りません。
- システム構成図のバージョンと変更履歴を適切に管理することで、問題が起きたときにどのような変更が行われたかを追跡できるようになります。
システム構成図を共有する
システム構成図は共有してこそ意味があり、システム開発者の備忘録で終わらせるのは勿体ないです。
そのためにも、誰にシステム構成図を共有するかをはっきり決めておきましょう。
開発者、運用チーム、営業や企画担当者、管理者、クライアントなど、共有すべきステークホルダーは様々です。
各ステークホルダーが必要な情報を入手できるようにしておくべきでしょう。
その際には以下の点に気をつけてください。
- それは見る人が理解できるフォーマットか
- 別部署の人に専門用語満載の図を渡してもわかりません。
- クライアントには、詳しい実装形態よりもどのような機能と運用になるかを伝えたほうがいいことも多いです。
- セキュリティを考慮しているか
- システム構成図には、しばしば機密情報が含まれます。
- アクセスする人間は適切に管理する必要があります。
- 変更後の通知を行なっているか
- システム構成図が更新された際は、ぜひ関係者に通知しましょう。
- つねに新しいバージョンを提供しておくことで、関係者全員の認識が共有できます。
システム構成図を作成せず開発は可能か
中小規模のシステムであれば、構成図なしでも開発すること自体は可能です。
しかし、構成図がない開発は往々にして問題が発生し、多くの混乱を招くものです。
例えば
- システムが属人化して、保守が困難になる
- 例えば、用途不明のコンポーネントやライブラリの削除、ロードバランサの停止、新規デバイスの導入を行おうとしても、交換前のものがどのリソースから参照されているかが分からないため手が出せません。
- 各ソフトウェアのバージョンが明確になっていないため、新規システムとの互換性も確認できません。
- 全容を把握していた管理者がいなくなると誰もシステムに手を出せなくなり、新しい管理者を用意するためのコストが増大します。
- バグやシステム不備の調査や修正ができない
- 問題が起こったときにまず行うべきは要因の切り分けと追跡です。
- どことどこが繋がっているかが明確になっていない場合、問題が発生した経路の追跡が困難であり、「単に顧客が回線を間違ってつなぎ直した」というよくある人的ミスですら発見できなくなります。
- 顧客との間に致命的なズレが発生し、納品時に要件を満たしていないことがわかる
- 当たり前のことを当たり前とせずに明確にしておくことがシステム開発の基本です。
- ですが顧客にシステム全域について確認することは不可能であるため、開発範囲とゴールを明確化しておかなくてはいけません。
- システム構成図がなければ、その境界線を共有することが出来ないため、「聞いてない」「しらない」「勘違いしていた」「コレぐらい言わなくてもわかっているだろう」が頻発し、最終的には意味のない道具が出来上がります。
など、様々な場面で「問題が起こったのに原因が特定できない」という地獄のような状況に陥ります。
一枚も構成図がなくても開発自体は可能ですが、実際に現場で使えるものにはなりません。
システム構成図を作成できるおすすめツール
システム構成図の作成には、ブラウザで利用できるオンライン作図ツールがおすすめです。
おすすめのツールを3つ紹介します。
| ツール名 | 利用形態 | 特徴 | 価格 |
| CaCoo | ブラウザ上で利用 | 日本シェアNo1の作図ツール
日本語でのサポートが手厚く、チーム作成機能などが充実している |
月額660円(ユーザー1人毎)
無料トライアルあり |
| Draw.io | ブラウザ上で利用
オフライン環境で使えるデスクトップ版有り |
無料でつかえる高品質な作図ツール
VScodeやoffice365、G Suiteなど様々なソフトがプラグインを用意している |
無料
オープンソース（Apache License 2.0） |
| Cloudcraft | ブラウザ上で利用 | AWSやAzureのネットワーク構成図に特化した作図ツール
アイソメトリックな構成図が作れる |
機能制限プラン 無料
Proプラン 年額490ドル(ユーザー1人毎) エンタープライズプラン 要資料請求 いずれも無料トライアルあり |
CaCoo
ブラウザ上で動く、日本語対応でインストール不要の作図ツールです。
個人やチームでの作図作業機能が充実しており、様々な作図を行なうことでアイデアを共有することが出来ます。
| ツール名 | 利用形態 | 特徴 | 価格 |
| CaCoo | ブラウザ上で利用 | 日本シェアNo1の作図ツール
日本語でのサポートが手厚く、チーム作成機能などが充実している |
月額660円(ユーザー1人毎)
無料トライアルあり |
Draw.io
オープンソースで使える高品質な作図ツールです。
無料とは思えないほど多機能な作図ツールで、ローカル環境で使えるデスクトップ版もあり、様々なサービスが連携プラグインを用意しています。
| ツール名 | 利用形態 | 特徴 | 価格 |
| Draw.io | ブラウザ上で利用
オフライン環境で使えるデスクトップ版有り |
無料でつかえる高品質な作図ツール
VScodeやoffice365、G Suiteなど様々なソフトがプラグインを用意している |
無料
オープンソース（Apache License 2.0） |
Cloudcraft
AWSやAzureといったクラウドサービスでのネットワーク構成図に特化した作図ツールです。
3Dで立体的な構図が作れることや、特徴的なオブジェクトやアイコンが用意されていることなど、特化しているからこその特徴的な機能が使えます。
| ツール名 | 利用形態 | 特徴 | 価格 |
| Cloudcraft | ブラウザ上で利用 | AWSやAzureのネットワーク構成図に特化した作図ツール
アイソメトリックな構成図が作れる |
機能制限プラン 無料
Proプラン 年額490ドル(ユーザー1人毎) エンタープライズプラン 要資料請求 いずれも無料トライアルあり |
まとめ
いかがでしょうか。
システム構成図は、システムの全体像をプロジェクトの関係者たちが共有できる大変便利な手段です。
システムの開発や導入時には、ぜひシステム構成図を作成し情報共有に活用しましょう。
ですが、システム構成図を作っても運用ができていなければなんの意味もありません。
また、構成図にも様々な種類があり、意外と「分かりやすいシステム構成図」を作るのは大変です。
資料一つとっても複雑なシステム開発には、やはり実績のある開発業者へ依頼したいところです。
そこでおすすめなのが、株式会社Jiteraです。
株式会社Jiteraでは豊富な開発実績でITシステムの開発・導入を支援しており、以下の3つの特徴が挙げられます。
- プログラマーのコーディングが効率的に行え、開発速度が3倍になる
- プロジェクト円滑に進められる
- エンジニアの工数を削減できる
効率性やスピード感を重視している方にとって株式会社Jiteraは、最善・最適なサポートを行います。
システム開発や運用にお悩みの方、システムの導入を検討されている方はぜひ1度お問い合わせください。
メールマガジン登録
