ワークショップの概要
このワークショップでは Google Maps API と Laravel を活用して、地図を利用したオリジナルアプリケーションの作成を行なっていただきます。
- Google Maps API を利用すると何をできるのか確認する
- オリジナルアプリケーションを設計する
- チーム開発の流れを理解する
- オリジナルアプリケーションを開発する
という流れで進みます。
設計に利用するドキュメント
設計の際には
- コンセプトシート
- 機能一覧
- 画面遷移図・ワイヤーフレーム
- ER図（物理）
- WBS
の作成を行います。
コンセプトシート
コンセプトシートの雛形は以下になります。
このシートをコピーして 5W1H および
- サービスの概要
- 追加する機能
- 追加する画面
を記述しましょう。
この時、
- 既存のサービスにはどのようなものがあるか？
- 作成するサービスに類似したサービスはあるか？
- 類似サービスでは解決できない問題があるか？
- 作成するサービスではどのようにその問題を解決するか？
といったことを考えると、新しいサービスの発想の糸口になるでしょう。
コンセプト設計は ソフトウェア開発プロセス速習 2章・コンセプトの設計 を参考にしてください。
機能一覧
機能一覧の雛形は以下になります。
このシートをコピー（Excel の場合は ダウンロード > Microsoft Excel） して、機能一覧を作成しましょう。
機能一覧の作成は ソフトウェア開発プロセス速習 7-4・機能設計 を参考にしてください。
画面遷移図・ワイヤーフレーム
続いて、画面の遷移図とワイヤーフレームを作成します。
遷移図とワイヤーフレームのイメージは以下のようなものです。
上記のイメージをもとに、Google スライドや PowerPoint などのツールを活用してワイヤーフレームを作成しましょう。
最初に、必要な画面をリストアップしておくことが重要です。
画面設計については ソフトウェア開発プロセス速習 7-8・画面設計 を参考にしてください。
補足資料
- Web デザイン入門（PDF）
Web デザイン入門の資料 コンセプトシートのサンプルやワイヤーフレームについて、デザインの視点でまとめられている資料ですので、最初に見ておくととても参考になります。
以下の素材サイトも、デザインを設計する上で参考にしてみてください。
- web デザインで押さえるべき配色の基本
- 写真のフリー素材サイト
- フリーアイコン素材のサイト
ER図（物理）
ER図（物理）の雛形は以下になります。
このシートをコピーして、ER図（物理）を作成しましょう。
ER図（物理）の作成は
- ソフトウェア開発プロセス速習 5-4・概念データモデル図（概念ER図）
- ソフトウェア開発プロセス速習 7-13・2. データベース設計: 概要
- ソフトウェア開発プロセス速習 8-3・物理ER図とテーブル定義書
を参考にしてください。
WBS
WBS の雛形は以下になります。
このシートをコピーして、WBS を作成しましょう。
WBS の作成は ソフトウェア開発プロセス速習 6章・プロジェクトマネジメント を参考にしてください。
開発スケジュールのポイント
開発スケジュールを立てるときに、「最終日に全て出来上がり、動くようになる」ようなスケジュールの立て方は避けるようにしましょう。
できる限り「動く」状態を維持し続け、
- 最低限のCRUD機能を完成させる
- 最も重要な機能を見極め、それを完成させる
- 次に重要な機能を完成させる
というように進めることで、スケジュールを最大限に活かせるようになります。
「必ず、スケジュール通りに行かなくなる時が来る」ことを前提に、いつ時間切れになっても良いような進め方を意識しましょう。
毎日の流れ
- 毎朝・チームのタスクを確認する
- 毎日の終わりに個人KPTとチームKPTを実施する
というのがポイントです。
毎朝・チームのタスクを確認する
毎朝、チームで集合し、それぞれのタスクを確認しましょう。
「今日、私は〇〇を行います」と一人一人言っていくのが良いでしょう。
もし、作業分担を変える必要があったり、順番を変えた方が良い場合は積極的に提案しましょう。
毎日の終わりに個人KPTとチームKPTを実施する
毎日、終了前に集まり、まず個人で
- Keep: 今後も続けたいこと
- Problem: 発生した問題
- Try: 明日以降トライしたいこと
をまとめて発表します。
続けて、各個人の KPT をまとめて、チームの KPT を作成してください。
作成した個人KPT、チームKPTはチャンネルに投稿して講師にも共有しましょう。