ディープなシューティングゲーム

使用したデータ

無人航空機飛行計画データ

技術スタック

フロントエンド

• Next.js 15.5.3 Reactベースのフルスタックフレームワーク（Turbopackモード使用）
• React - UIライブラリ （Hooks API活用: useState, useEffect, useCallback, useRef, useMemo）
• TypeScript 型安全な開発
• Canvas API 2Dゲームレンダリング

バックエンド

• tRPC タイプセーフなAPI通信
• Prisma ORM（SQLiteデータベース使用）
• Zod スキーマバリデーション
• WebSocket スマホの操作共有

AI活用ポイント

• ディープフェイクをAIツールを使って作成しています。

• MCP serena使用

• やりたいタスクに合わせてモデルやツールの使い分け

AWS関係

Q Developer

基本的な開発タスク

Codex、 Claude

自然言語が必要なタスク

Gemini CLI

• 音を鳴らす afplayを使って、タスク開始時やタスク終了時に音を鳴らすようにした

自慢したいこと

• 「ディープ」というお題にかけてディープフェイクを作ってみました。 （深夜に友達に踊ってもらった動画にドリーさんの顔を混ぜています。）
• ディープフェイクを作るに当たって、いろんなツールやオープンソースを試しましたが、FaceFusionというオープンソースのツールで今回は作成しました。動画データや写真データを外部送受信されないようにローカルで動かせるツールを使いました。
• DeviceMotionEventとWebSocketを組みわせて、スマホでキャラクターの操作をできるようした

使用したAWSサービス

Amazon EC2 Amazon Bedrock