【授業レポート】システム開発(3年) 第52週目
〜機能実装フェーズ:API・AI・UIをつなぎ「使える形」へ〜
第52週目は、最終プロジェクトの実装を一気に進め、
API連携・生成AI・UIを結合して“実際に使える機能”にするフェーズに入りました。
前週で整えた土台をもとに、
いよいよアプリが“それらしく動く”段階へ進んだ重要な回です。
■ 先生の導入:「今日は“つなぐ日”」
田中先生:「部品は揃いました。
今日はそれを“ユーザーが使える形”に組み上げます。
ただし、焦って構造を崩さないこと。」
先生は特に次の点を強調しました。
- UIから直接API・AIを呼ばない
- Service層にロジックを集中させる
- エラー時の動作も同時に作る
■ 今日のゴール
- APIデータをServiceで加工してUIに渡す
- 生成AI機能を実際のユースケースに組み込む
- UIでユーザー操作ができる状態にする
- 正常系と異常系の基本動作を確認する
■ 実習①:APIデータをServiceで加工
まずはAPIから取得したデータを
そのままではなく、使いやすい形に変換しました。
例(イベントアプリ)
def get_events(self):
data = self.api_client.fetch_events()
return [
{
"title": item["name"],
"date": item["date"],
"summary": item["description"][:100]
}
for item in data
]
ポイント:
- UIに渡すデータは最小限
- API仕様をUIに漏らさない
- 将来API変更に強くする
生徒A:「Serviceで整えるとUIがすごくシンプルになる」
■ 実習②:生成AI機能をユースケースに組み込む
次に、AI機能を実際の流れに組み込みました。
例
- ニュース取得 → AI要約 → UI表示
- 英文入力 → AI補助説明 → UI表示
def summarize_event(self, text):
prompt = self.build_prompt(text)
result = self.ai_client.generate(prompt)
return self.validate(result)
生徒B:「“ただ呼ぶ”から“役に立つ機能”になった感じがする」
■ 実習③:UIとの接続
CLIや簡易Web画面で、
ユーザー操作と機能を接続。
例(CLI)
print("イベント一覧")
events = service.get_events()
for e in events:
print(e["title"])
choice = input("詳細を見る番号:")
工夫した点:
- 入力エラー対策
- 分かりやすい表示
- AI出力には注記をつける
■ 実習④:結合テスト(Integration)
ここで、全体を通した動作確認を実施。
チェック内容
- APIが正常に取得できる
- AIが動作する
- UIで操作できる
- エラー時に落ちない
発生した問題
- API遅延で画面が止まる
- AI出力が長すぎる
- 入力エラーでクラッシュ
→ その場で修正しながら改善
生徒C:「単体では動いてたのに、つなぐと問題が出る!」
■ 実習⑤:フォールバック動作の確認
意図的に失敗を起こして確認。
- APIを止める
- AIを無効にする
確認したこと
- システムが止まらないか
- 代替表示が出るか
例:
※現在、AI要約は利用できません
生徒D:「“壊れない”のが一番大事だと実感」
■ クラス全体の気づき
- 結合すると初めて見える問題が多い
- Service設計の良し悪しが差になる
- UIは“使いやすさ”が重要
- AIは補助機能として扱うと安定する
■ 先生のまとめのひとこと
「今日で、皆さんのシステムは
“部品の集合”から
**“使えるアプリ”**に変わりました。
ここからは完成度を上げるフェーズです。
- 分かりやすいか
- 安定しているか
- 安全か
この3つを意識して仕上げていきましょう。」
■ 宿題(次週に向けて)
- 主要ユースケースを1つ完成させる
- エラー処理を強化(最低3パターン)
- UIの改善点を3つ挙げる
■ 来週の予告:最終調整&発表準備
次週は、
- バグ修正
- UI改善
- ドキュメント整備
を行い、
最終発表に向けた仕上げに入ります。
第52週目は、
プロジェクトが“実際に使える形”になった大きな節目でした。
生徒たちは、設計・実装・連携を一つにまとめ、
本格的なシステム開発の達成感を味わい始めています。
