DOT's Wiki

この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。
====== 情報アーキテクチャ -情報の設計と実装- ======

===== 基本情報 =====
^ 項目 ^ 内容 ^
| 科目名 | 情報アーキテクチャ -情報の設計と実装- |
| 所要時間 | 24時間（1日6時間×4日間） |
| 対象者 | 情報工学を学んでいる学生 |
| 前提知識 | プログラミング基礎（JavaScript推奨）、データベース基礎 |

===== 教育目的 =====
情報アーキテクチャ（IA）を学ぶことで、情報をどのように扱えばより有意義（高価値）になるのか、根拠を持って考えられるようになる。情報アーキテクチャは「情報をわかりやすく伝え」「受け手が情報を探しやすくする」ための表現技術であり、本講義では座学と実習を通してプラクティス（効率の良い手法や方法論）を体得する。ペルソナの視点で情報を整理・分類し、情報の設計とシステムの設計を分離して開発を進められる力を養成する。

===== 到達目標 =====
^ No. ^ 到達目標 ^ 評価基準 ^
| 1 | 情報アーキテクチャについて説明できる | IAの定義、UXとの関係、情報の価値・可視性・多義性を説明できる |
| 2 | ペルソナの視点で情報を整理・分類できる | ペルソナを定義し、LATCH法・カードソーティングで情報を整理分類できる |
| 3 | 情報アーキテクチャを企画・設計・開発に適用できる | 情報定義書から情報モデルと状態遷移を定義できる |
| 4 | 情報の設計とシステムの設計を分離して開発を進められる | 情報モデルの状態遷移から機能とプレゼンテーションを抽出できる |
| 5 | プレゼンテーションと機能を分離して開発を進められる | RESTful API等を用いてUIとロジックを分離した実装ができる |
| 6 | 設計思想・アーキテクチャを理解し選択できる | DOA/MDA/SOA/ROA/OOAD、MVC/MVVM/DDDの違いを説明できる |

===== スケジュール概要 =====
^ 日数 ^ 内容 ^ 時間 ^
| Day 1 | 講義の説明・チーム分け・情報アーキテクチャ・情報の整理と分類 | 6時間 |
| Day 2 | 情報モデル・開発モデル・ユーザインタフェース | 6時間 |
| Day 3 | 設計・永続化・UIと機能の通信・実行方式・開発手法 | 6時間 |
| Day 4 | 実装・成果発表資料作成・成果発表 | 6時間 |

===== 学習内容 =====

==== 第1部：講義の説明・チーム分け・情報アーキテクチャ・情報の整理と分類（6時間／Day 1） ====

=== 1-1. 講義の説明とチーム分け（60分） ===
  * アイスブレーク
    * 講師紹介・自己紹介・オープナ
  * 講義の説明
    * 情報アーキテクチャ（IA）とは「情報をわかりやすく伝え」「受け手が情報を探しやすくする」ための表現技術
    * プラクティスは実践・失敗・再挑戦の繰り返しで体得する
    * 目的：IAを説明でき、ペルソナの視点で情報を整理・分類でき、企画・設計・開発に適用できるようになる
    * 心がけて欲しいこと（知識体系の理解と演習での体得、気づきの共有、PDCAを小さく沢山繰り返す）
  * チーム分け
    * チーム編成
    * 開発テーマの決定（情報処理を伴うものであれば何でも良い：家計簿システム、レシピ類推サービス、オークションシステム等）

=== 1-2. 情報アーキテクチャ（150分） ===
  * 知識体系「情報アーキテクチャ」の位置づけ
    * Webサイト設計から生まれた概念、UXの1要素
    * 情報産業の価値がハードウェアからソフトウェア・サービスへ移行し、IAの重要度が増している
    * The Elements of User Experience（目に見えない情報と目に見える情報を繋ぐIA）
  * 情報とは
    * （実習）点とは何か／情報とは何か
    * データに「価値」を与えたものを「情報」という
    * 暗黙知と形式知（SECIモデル）、情報の多義性
    * 「誰に価値を提供する情報なのか」を最重要視する
  * （演習）情報定義書の作成
    * 開発テーマで登場する情報を全て洗い出して列挙する（ブレインストーミング・清書）
    * （成果物）「情報定義書」
  * アーキテクチャとは
    * ソフトウェアの構造や設計、設計思想
  * 情報アーキテクチャの定義
    * 誰に価値を提供するのかを決定し、ソフトウェアの構造や設計として落とし込む手法
    * Information Architect（情報の整理をする役割）
  * 情報が持つ特性
    * 情報の「価値」（誰の価値か、何を提供する価値か）→ ペルソナ
    * 情報の可視性（見える情報・見えない情報）
    * 情報の「可視化」（SECIモデル、暗黙知と形式知）
    * 情報の「多義性」（こうもり問題）
  * （演習1）こうもり問題
    * こうもりが獣／鳥であることを三段論法で述べ、情報のペルソナとの関係を考察する
  * （演習2）ペルソナの定義

=== 1-3. 情報の整理と分類（150分） ===
  * 整理と分類の違い
    * 整理（必要な情報を残し不要な情報を捨てる）
    * 分類（カテゴリ分け）
  * 事例から見るIAの有効性・可能性
    * フレーム問題・ディープラーニングにおける「情報」
    * 甲骨文字における「情報の整理と分類」（SECIモデルの暗黙知と形式知の反復）
    * 「情報の定義→価値の確認→再定義→価値の確認」の繰り返しで価値ある情報の定義を完遂する
  * 情報分類の手法
    * LATCH法（Location, Alphabet, Time, Category, Hierarchy）
    * 「見出し」とは（情報を抽象的に捉えた際の情報）
    * カードソーティング（オープン／クローズド）
    * データマイニング、QC7つ道具
  * 情報整理と分類の課題と解決方法
    * 重要度の重み付け → 的確なペルソナを定義する
    * こうもり問題 → 要件を定義する
  * 情報整理と分類に必要な知識
    * ドメイン（業務）知識
  * 関係する分野
    * 図書館情報学、パターンランゲージ、ゲシュタルト心理学
  * （演習）情報定義書の整理・分類
    * ペルソナの定義、開発テーマの市場調査、情報の整理・分類（PDCAの手順を踏む）
    * 注意点：「情報」を整理し分類すること（「機能」ではない）
    * （成果物）「ペルソナのプロフィール」「整理分類済み情報定義書」

==== 第2部：情報モデル・開発モデル・ユーザインタフェース（6時間／Day 2） ====

=== 2-1. 情報モデル（150分） ===
  * モデルとは
    * モデリング（分類・名前付け・パターン・単純化）
    * なぜモデリングするのか（情報を普遍的に利用可能にし、コンピュータで扱えるようにする）
  * 情報モデルとは
    * ペルソナが価値を見出す情報を、コンピュータで処理可能な形に構造化したもの
    * 情報の属性・関係・制約条件を定義したもの
    * 要件（ペルソナの視点）と実装（システムの視点）を繋ぐ橋渡し役
  * 情報モデルの定義に必要なスキル
    * オブジェクト指向分析設計、データベース設計
  * 情報モデルの状態遷移
    * 状態遷移を定義することで、必要な機能とプレゼンテーションが抽出できる
    * CRUD（Create Read Update Delete）
    * 機能（新規入力・1件表示・一覧表示・更新・削除）とプレゼンテーションの抽出
  * 情報モデルと状態遷移の役割
    * 機能とプレゼンテーションを抽出する
    * 要件と実装の連動
  * （演習）情報モデルの抽出と状態遷移の定義
    * 情報モデルを抽出する
    * 情報モデルの状態遷移を定義する
    * お客様視点のレビューと再定義
    * 状態遷移から機能・プレゼンテーションを抽出する
    * 推奨ツール：draw.io
    * （成果物）「情報モデル一覧」「情報モデルの状態遷移図」「機能一覧」「プレゼンテーション一覧」

=== 2-2. 開発モデル（90分） ===
  * 開発とは（有用なものを生み出す、システム化する）
  * 開発モデルの例（ウォーターフォール、V字、アジャイル、スパイラル、RAD、インクリメンタル、プロトタイピング）
  * 開発の工程
    * 要件（機能要件・非機能要件）
    * 仕様、設計、実装、テスト
  * （演習）非機能要件の定義
    * （成果物）「非機能要件一覧書」

=== 2-3. ユーザインタフェース（120分） ===
  * UIとは（利用者とコンピュータシステムの入出力仕様）
  * （演習）良いユーザインタフェースとは
  * UIの種類（CUI/CLI/GUI）
  * クライアントサーバ型、Webブラウザ（HTML5、DOM、JavaScript、JSON）
  * RIA、スマートデバイス
  * UIの設計（マルチプラットフォーム、Universal、UX、ワイヤーフレーム）
  * 購買行動（AIDMA、AISAS、AISCEAS）
  * （演習）保守期間と情報処理システム（1年／5年／10年以上）
  * （演習）モックアップツールで試作品作成

==== 第3部：設計・永続化・通信・実行方式・開発手法（6時間／Day 3） ====

=== 3-1. 設計（180分） ===
  * UNIX哲学（設計思想）
  * 設計アプローチ
    * プロセス中心アプローチ（POA）
    * データ中心アプローチ（DOA）
    * モデル駆動型アーキテクチャ（MDA）
    * サービス指向アーキテクチャ（SOA）
    * リソース指向アーキテクチャ（ROA）
    * オブジェクト指向分析設計（OOAD、UML）
  * デザインパターン（GoF、ジェネレーションギャップパターン）
  * 多層アーキテクチャ
    * 3層アーキテクチャ（データ層・プレゼンテーション層・ロジック層）
    * MVC（Model View Controller）
    * MVVM（Model View ViewModel）
    * ドメイン駆動設計（DDD）
      * ドメイン、ドメイン層、ユビキタス言語、ドメインモデル
  * （演習）「アーキテクチャ」「設計」「駆動」「アプローチ」「パターン」の違いを情報アーキテクチャの手法で考察する

=== 3-2. 永続化（60分） ===
  * ACID（原子性・一貫性・独立性・永続性）
  * 永続化の方法（ファイル、データベース）
    * RDB（正規化）、Key-Valueストア
  * インピーダンス・ミスマッチ、O/Rマッピング
  * （演習）RDBの正規化と情報アーキテクチャの違いを考察する

=== 3-3. ユーザインタフェースと機能の通信（45分） ===
  * RPC、CORBA、HTTP
  * Webサービス（SOAP/XML/WSDL、REST/JSON/WADL）

=== 3-4. 実行方式（30分） ===
  * ネイティブアプリケーション、モバイルアプリ
  * Webアプリケーション
  * クラウドコンピューティング（SaaS/PaaS/IaaS、オンプレミスとクラウド）

=== 3-5. 開発手法（45分） ===
  * ウォーターフォール、反復型、インクリメンタル、イテレーション
  * アジャイル（XP、Scrum）
  * バージョン管理システム（WIP PR、Git-flow）
  * （演習）なぜ開発手法が複数あるのか考察する

==== 第4部：実装・成果発表（6時間／Day 4） ====

=== 4-1. 実装（240分） ===
  * 実装の進め方
    * 各単元の成果物をもとに実装を行う
  * 推奨ツール
    * apiary（APIモック）
    * Monaca（Universalアプリケーション開発）
    * GitHub（ソースコード管理）
  * 実装例
    * 実装例1：apiaryでRESTful APIを作成し、JavaScriptから呼び出す
    * 実装例2：MonacaのTwitterサンプルをapiary APIモックにアクセスするよう改修
    * 実装例3：Angular.js/React.js等でapiary APIモックにアクセスするプログラムを作成
    * 実装例4：Monacaサンプルを開発テーマに沿うよう改修
  * （演習）開発テーマに沿った実装
    * 情報の設計とシステムの設計を分離する
    * プレゼンテーションと機能を分離する

=== 4-2. 成果発表資料作成（60分） ===
  * 発表に含めるもの
    * チームの役割分担実績
    * 開発したソフトウェアの構成（開発ツール、フレームワーク）
    * 開発成果のデモ
    * KPT（Keep Problem Try）
    * その他アピールポイント

=== 4-3. 成果発表（60分） ===
  * チーム毎に成果発表
  * 提出物
    * 開発したソフトウェアのソースコード（GitHub等）
    * 成果発表資料