3. 外部設計

オンライン教材 > Web開発設計の基礎

システム設計の概要

システム設計とは

システム設計は要件定義を具体化し、システム開発を効率的に構築するための工程です。プログラミング、テスト、システム運用を問題なく実現するために必要です。

外部設計と内部設計

外部設計と内部設計は密接に関連しており、外部設計で定義した要件を満たすように、内部設計を行います。 逆に内部設計が外部設計に影響を与えることもあり、バランス良く設計し、整合性を保つことが重要です。

外部設計とは

外部設計は、システム外部からの見え方や振る舞いにスポットを当てた設計です。システムとユーザーや他のシステムとのインターフェースを定義します。Webアプリケーションでは主にHTMLベースにUI/UXを最適化します。

外部設計の種類

外部設計は、システム開発プロセスの中で、システムの動作を具体化するための設計段階です。ユーザーや他のシステムとのインターフェース部分に焦点を当て、システムの要件や機能を実際のインターフェースとして定義します。

  • UI/UX（GUI、レイアウト、メニュー、フォーム、エラーメッセージなど）
  • 画面遷移図
  • ユースケース図
  • セキュリティ設計

ユースケース図

ユースケース図とは

ユースケース図はシステムがどのような機能を提供し、どのユーザーが、どのような操作をするかを視覚化します。主にシステム設計の初期段階で使用し、開発会社と顧客などの関係者がシステム動作を理解しやすくする図です。

ユースケース図
  • プロセス設計の初期段階や要件定義として利用

ユースケース図の要素

項目 説明
Actor（アクター） システムの外部にあるユーザーや他のシステムなど、システムとやり取り
Use Case（ユースケース） システムが提供する個々の機能やサービス、目的を示す
Association（関連） アクターとユースケースの間の接続を表し、アクターがユースケースを実行

プロセス設計

プロセス設計とは

プロセス設計は、システムや業務のプロセス（流れ）を定義し、効率的に処理を実行するための設計を行う工程です。

項目 説明
内容 システムや業務の処理の流れを最適化し、効率的で無駄のない作業手順を定義
目的 システムの動作手順、業務フロー、タスクの順序、データの流れなどを定義
成果物 フローチャート、アクティビティ図、シーケンス図

フローチャート

プロセスや作業手順を視覚的に表現た各ステップの流れを示す図で、業務プロセスの分析、システムのアルゴリズム設計などで利用されます。

アクティビティ図

システムのアクティビティ（動作）をフローチャート形式で表現する図で、ビジネスプロセスのモデリング、ユースケースの詳細化などで利用されます。

シーケンス図

オブジェクト間のメッセージのやり取りを時間軸に沿って表現する図で、システムの動的な振る舞いの分析、オブジェクト間のインタラクションの詳細化などで利用されます。

UI設計

UI（ユーザーインターフェース）設計は、システムやアプリケーション全体でユーザーが使用するインターフェースの設計を指します。ボタン、入力フィールド、アイコン、レイアウト、色彩、タイポグラフィ、インタラクションなど、ユーザーが視覚的に認識し、操作できるすべての要素を設計します

画面遷移図

画面設計は、ユーザーが直接操作するUI（ユーザインターフェース）を設計します。ユーザーがシステムをどのように操作するかを定義し、レイアウトやボタンの配置、表示内容などを決める。

項目 説明
内容 各画面のレイアウト、入力フォーム、表示内容、ナビゲーション方法、エラーメッセージなど
目的 ユーザーにとって直感的で使いやすいインターフェースを提供
成果物 ユースケース図、画面モックアップ、ワイヤーフレーム、UI設計書

画面遷移図のイメージ

画面遷移図の要素

項目 説明
画面（ページ） アプリケーション内の各画面やページ ホーム、ログイン、プロフィール画面など
遷移（トランジション） 画面間の移動を矢印や線で表現し、遷移の方向と条件を記述 ボタンクリック、キーボード入力など
行動（アクション） ユーザーが特定の操作後、どの画面に遷移するかを表示 例）入力データを登録ボタンで送信し、DB保存後にトップページに遷移

その他設計

帳票設計

帳票設計は、システムから出力される帳票やレポートのレイアウトや内容を設計し、帳票の形式や必要な情報を具体的に決定します。

項目 説明
内容 帳票のフォーマット、項目の配置、データの表示方法、集計項目、出力形式
目的 システムから生成される帳票がユーザーにとってわかりやすく、必要な情報を正確に提供
成果物 帳票設計書、サンプル帳票（PDF、CSV、HTML、紙など）

内部データ設計

データ設計は、システム内で扱うデータの構造やフローを定義し、システムがどのようにデータを取り扱うかを論理的に設計します。

項目 説明
内容 データ項目の定義、データの整合性、入力/出力フォーマット、データ間の関係、エンティティリレーションシップ図（ER図）など
目的 ユーザーが入力・取得するデータが整合性を持ち、効率的に扱う
成果物 データ項目定義書、ER図、データフローダイアグラム

外部データ設計

外部データ設計は、システムが外部データをどのように取り込み、処理後にどのように処理するかを定義します。

項目 内容 成果物
データフロー設計 外部システムからデータを取得し、システム内で処理する流れを設計 データフロー図
データフォーマットの定義 外部システムとのやり取りで使用するデータ形式（JSON、XML、CSVなど）や項目の構造を設計 インターフェース仕様書、データフォーマット仕様書
インターフェース設計 API、ファイル転送、Webサービスなど、外部システムとの通信手段やプロトコルを定義 インターフェース仕様書、通信プロトコル仕様書
データマッピング 外部システムから取得したデータを内部システムに変換するための対応付けを定義 データマッピング定義書

セキュリティ設計

セキュリティ設計は、システムのセキュリティ要件を満たすための設計を行い、潜在的なリスクを特定してセキュリティ対策を立案します。

項目 説明
内容 認証・認可の方式、アクセス制御リスト、暗号化方式、ログ管理、データバックアップ、脆弱性対策
目的 システムが不正アクセスやデータ漏洩から保護し、データが安全に取り扱われることを保証
成果物 セキュリティ設計書、アクセス制御ポリシー
<< 要件定義

Web開発設計の基礎