ラッシュの速さ比べか...

https://github.com/progate-hackathon-enpower/andere-boxing

Swift

TypeScript

Kubernetes

AWS

Rust

無駄無駄無駄無駄無駄無駄無駄 オラオラオラオラオラオラオラ

まる

monokamo

石原佳晴

推しアイデア

リアルでラッシュバトルしようぜ!

作った背景

2月28日に、アーケードゲーム『ジョジョの奇妙な冒険ラストサバイバー』の全国大会があるから。

推し技術

web transport, eks, apple watch

プロジェクト詳細

👊 概要

こんにちわ

____それは、スタンドバトルの心理戦!

Apple Watch の加速度センサーをトリガーに、iOS アプリ経由で Rust 製の低遅延同期サーバーと通信し、リアルタイムにラッシュバトルを体感できる、黄金のような夢 です。

web UIのスクショ

スタート画面 image

対戦画面 image

🛠 技術スタック

image

フロントエンド(Web)

image

フロントエンド(モバイル)

image

バックエンド

image

インフラ

image

構成図 image

(ML)

AppleWatchで「時間軸、ユーザー加速度、回転速度」の情報を持つCSVから、CoreMLでモデルを作成。ユーザーがパンチしたり、パンチに似た他の動作をしたりした時、動作を識別し、適切な操作を可能にし...ようとしていました。(後述)

🤖 AI活用

.claude/CLAUDE.md + .claude/rules/ で、基本の規則とコーディング規則を分けた。rules/以下の方はファイルパスや言語に対して自動適用される。

claude-code-action を使った PR 自動レビューワークフローを入れた。人間が怒られる時代になってしまった。(´・ω・`)

image image

GitHub Agentic Workflow

2/16に出ていた記事 を読んで導入してみた。

作った仕組み

・PR マージ後に README の更新要否を判断して、よしなに更新 PR を作成してくれるやつ:

立ち止まれてえらい: image

・毎日定時にリポジトリの状態を分析し「Repo Report」としてIssueを発行してくれるやつ:

report ラベルをトリガーに Discord へ自動配信する仕組みも組み合わせた: image

スプライト画像生成

Nano Banana 2にスプライト画像を作らせた。

結果/プロンプト image

CI/CD

ArgoCD(GitOps)

GitHub リポジトリの infra/argocd/ 配下にある Kubernetes マニフェストを ArgoCD が監視し、変更があれば自動で EKS クラスタに同期する GitOps 構成を採用。ApplicationSet でディレクトリを自動検出し、selfHealprune を有効にすることで、手動変更の自動復旧や不要リソースの削除も実現している。

DockerのECR Push

sync-server(Rust 製の対戦同期サーバー)を GitHub Actions でビルドし、AWS ECR にプッシュするパイプラインを構築。Rust のマルチステージビルドでイメージサイズを最小化し、GitHub Actions Cache(cache-from/to: type=gha)でビルド時間を短縮。PR 時はビルドのみ、main マージ時にプッシュする制御を入れている。

lambrollを用いたPreviewURL

Web フロントを Nitro の aws-lambda プリセットでビルドし、lambroll で Lambda にデプロイ。PR ごとに pr-{番号} のエイリアスを作成して独立した Function URL を発行し、Preview URL として PR コメントに自動投稿する仕組みを実現。PR クローズ時にはエイリアスと Function URL を自動削除してクリーンアップする。

TopazのCD <=NEW!!!!

topazのmdを、actionsで指定したmdの内容で置き換え自動更新する仕組みを作成しました。

topazの認証フローを理解し、actionsのflowとして公開しています。 詳しくはこちら

マルチルート+S3backendによるセキュアなTerraformインフラ管理

各分野や責務ごとにステートを分けて、Terraform上で起こりうるバグを未然に防いだ。 それぞれのルート同士がOutputsを用いて必要な値を受け渡し合いつつ、ステートは分離している疎結合な設計。 S3Backendを用いて複数人でTerraformを触る場合でもインフラの同期を取れる状態を作った。 基本的に通信がゼロトラストになるようにネットワークを設計。 Kubernetesでの運用を見据え、VPCをPublic/Privateサブネットに適切に分離。あわせてSG,CIDRポリシーを最小権限で設計し、不要な到達性を排除した。

😭 苦労した点

Apple Watchでの開発がキビしすぎる 最初はパンチ/防御/Core MLを使った機械学習を予定しており、専用のデータ収集用アプリなども作っていたのですが、途中からどのメンバーもApple watchとの接続が不安定になり、学習データの取り出しができなくなりました。 加速度を取得するシンプルな方針に切り替えて、ことなきを得ました。(大事!)

どのタイミングで寝るかの判断

✍️ チームメンバーからひとこと

yomi4486

・ProtoBufferを初めて開発で使った。面白い。 ・CoreMLを初めて使った。Apple製品だけで速攻で学習モデルが作れるのすごい。 ・iOSでネイティブにHTTP/3 + QUICでWebTransportサーバーに接続可能にした。

mono0218

・個人開発で培ったProtoBufferとその型を使ってイベント駆動のおかげで、安定したシステムを作成できた。 ・疎結合の設計にしたとこで、分業をすることができ、夜寝れた。 ・三人で1年間開発してきたので、issueやPRを適切なタイミングできれるようになった。

まる

・ProtoBuffer, WebTransportが初めてでした。 ・ゲーム作り/Pixi.jsも初めてでした。状態管理が難しかったけど、スプライトが動いて超嬉しかったです。 ・AI活用点を稼ぐために最新の公式ドキュメントを読みました。 ・中間発表時間使いすぎてすみませんでした...

チームでの議論の様子

https://docs.google.com/document/d/1f6zE-57OmT5L-dAcSo0-VrYepTxJQxTSe5KO5Ckiy3E/edit?usp=sharing

まる

@__Riochin2623