WEBデザイン・開発講義WEB Design&Development Lecture

システム設計とWEBデザイン

システム設計のデータを中心にした利用機能の設計

機能要件定義の明確化(事例)※画像クリックで拡大表示

「機能要件定義書」のシステム設計

「機能要件定義書」の作成内容
項目内容
システム名

専用のコンテンツ共有サイトの作成

目的

グループ内やイベントごとに撮影した写真、ビデオのコンテンツを参加メンバーで共有する専用サイトを作成する。

業務概要
  1. サイト管理者により、各グループやイベントごとのタイトル、秘密キーを設定して、該当するメンバーへ秘密キーをメール等で通知する。
  2. メール等で秘密キーを受取った人がメンバー登録して、該当するサイトへログインすることができる。
  3. ログインしたメンバーが撮影した写真等のコンテンツをアップロードして、該当メンバー間でダウンロードや内容表示などのコンテンツを共有できる。
  4. 登録者名を表示しており、コンテンツをアップロードした人は、そのコンテンツの権利保有しているので削除する操作ができる。
処理概要 【1】グループ・イベント登録
  1. サイト管理者がグループやイベント単位でそのタイトル、秘密キーが登録できる。登録した内容の変更や削除も可能とする。(掲載期間の設定ができる)
  2. 登録したタイトルは、コンテンツ表示のタイトルとして利用し、秘密キーは各グループ・イベントの限定化されたサイトとして機能する。
  3. 「グループ・イベントマスター」のDBテーブルを作成する。
【2】メンバー登録・パスワード変更
  1. メール等で受け取ったサイトのURLから、メールアドレスを入力して、受信メールで仮のパスワードを受け取る。
  2. ユーザーIDがメールアドレスとし、受取った仮のパスワードで、該当するサイトへログインする。
  3. ログインが成功した場合に、仮のパスワードを変更することができる。
  4. プライバシーポリシーを考慮した「メンバーマスター」のDBテーブルを作成する。
【3】コンテンツ登録・削除
  1. デジタルコンテンツ表示ページ内に「コンテンツ登録」ボタンを設けて、簡単にコンテンツのアップロード(登録)できるようにする。
  2. アップロードのコンテンツタイプは、写真(拡張子:jpg,png,gif)とビデオ(拡張子:m2ts)とし、コンテンツに対する撮影メモが登録できるようにする。
  3. 写真のコンテンツは、アップロードしたコンテンツから、サムネール画像、拡大表示画像を自動生成する。
  4. ビデオのコンテンツは、アップロードしたコンテンツの動画フレームからサムネール画像を生成し、クリックで動画が表示できるように拡張子「mp4」の動画(フレーム幅:962)を生成する。
  5. ビデオのアップロード最大容量は、800MBまでとし、AVCHDビデオが5分まで、1920x1080フレーム(29フレーム/秒)を可能とする。
  6. コンテンツごとにログインしたメンバーの名前を登録し、コンテンツ登録メンバーが削除できるようにする。(削除処理は、テーブルに削除フラグをセットして、表示しないようにする)
  7. 「コンテンツデータ」のDBテーブルを作成・追加する。(秘密キーを持って、「グループ・イベントマスター」と連携する)
【4】デジタルコンテンツ表示・ダウンロード
  1. 秘密キーとユーザーID(メールアドレス)、パスワードを入力して、ログイン処理をすると秘密キーの限定サイトが表示される。
  2. 各コンテンツ表示は、サムネール表示して一覧表示されており、サムネール画像をクリックすると拡大表示されて内容を確認できる。(jQueryのlightbox等を利用)
  3. 各コンテンツは、「コンテンツタイプ」、「ダウンロード」ボタン、「登録者名」、「登録日」が表示され、登録者のコンテンツの場合は、「削除」ボタンも表示される。
  4. 「ダウンロード」ボタン押下により、該当するアップロードデータを各メンバーのパソコンへダウンロード処理をする。
  5. 「コンテンツデータ」のDBテーブルを参照する。(秘密キーで「グループ・イベントマスター」と連携する)

機能要件定義書(事例)のフォームファイル
『機能要件定義書』ファイル(xlsx)のダウンロード

DOA中心とした業務フローの作成

  • 「専用のコンテンツ共有サイト」業務フローは、
    データベース利用を前提として「グループ・イベントマスタ」「メンバーマスタ」「コンテンツデータ」のDOA中心とした内容を明らかにします。
    コンテンツ共有サイトの業務フロー
  1. 利用者は、「サイト管理者」と「メンバー」であり、サイト管理者が「メンバー・イベント」の登録をして、関係するメンバーへ「秘密キー」などの通知(メール等)をして、メンバーが利用可能になります。
  2. 通知を受け取ったメンバーは、該当するサイトにメンバー登録します。(既にメンバー登録済みの場合は不要)
  3. メンバー登録後に、ログイン処理と「秘密キー」を入力して、限定されたメンバー共有サイトのコンテンツデータを表示することができます。
  4. 各メンバーが撮影したコンテンツ(写真、ビデオ)をアップロードすることで、各メンバー間でコンテンツを自由に表示・ダウンロードできるようになります。
  • 「機能要件定義書」からプログラミングして実装したサイト「コミュニティ会員情報の案内(追記:2016.2.15)では、
    具体的に「コンテンツ登録・削除の処理」「デジタルコンテンツ表示・ダウンロードの処理」「会員の有効期限の処理」について記載していて、詳細設計とプログラミングを通して開発する上で相違点などを明記する必要があります。

処理概略フローの作成

  • 「専用のコンテンツ共有サイト」処理概略フローは、
    上から下への処理の流れを考慮した処理内容を中心にフローチャートで記述します。
    コンテンツ共有サイトの処理概略フロー
  1. サイト管理者が「メンバー・イベント」のDBに、登録内容の「グループ・イベントのタイトル」になる項目と、メンバー共有が限定できるように「秘密キー」を登録追加します。
  2. サイト管理者が登録した「サイトURL」と「秘密キー」を関係するメンバーへ通知(メール等)をします。
  3. 通知を受けったメンバーは、既にメンバー登録済みの場合は不要ですが、未登録のメンバーは該当するサイトにメンバー登録します。
  4. メンバー登録は、メールアドレスのみを入力すると「仮パスワード」付きの空メールを受信することができます。
  5. メンバーは、空メールにある「仮パスワード」とメールアドレスを入力することで本人確認したこととして、一般メンバーのログイン処理が可能になります。パスワードの変更も可能になります。
  6. ログイン処理は、メールアドレス(ユーザーID)とパスワード及び「秘密キー」を入力し、「秘密キー」に該当する限定されたメンバー共有サイトのコンテンツデータを表示することができます。
  7. 各メンバーが撮影したコンテンツ(写真、ビデオ)をアップロードすることができ、各コンテンツには、サムネール画像、「ダウンロード」ボタン、撮影メモ、登録日、「削除」ボタン(登録者のみ表示)が表示されます。サムネール画像をクリックすることで、拡大画像や動画を表示することができます。

DOAによる設計の補足説明

参考のシステム設計資料

pagetopへ