PatiPuro.vscode

プロダクトの概要

PatiProは、VSCode上でコードをタイピングするたびにパチンコの玉が発射される、VSCode拡張機能です。単調になりがちなコーディング作業にエンターテインメント性を掛け合わせることで、開発者のモチベーション向上と脳汁体験を実現します。

主な特徴

- タイピングと連動した物理演算アクション VSCode上で文字を打ち込むたびに、Webviewパネル上のパチンコ台に玉が打ち出されます。またビルドなどのコマンドを実行することで成功・失敗判定などにも影響が出ます。

- 物理エンジンによるリアルな挙動 2D物理エンジン（Matter.js）を採用しており、釘に弾かれる玉のリアルな軌道や「へそ（中心穴）」への入賞判定などをブラウザ上で忠実に再現しています。

- 「自分だけのパチ台」を自作・カスタマイズ可能 専用フォーマットのパチ台データ（.patidai / zipファイル）を読み込ませることで、台の背景画像・BGM・演出動画（通常リーチ、成功、ラッシュ時など）を自由に差し替えることができます。自作の台を作って友人と共有することも可能です。

ユーザーフロー

.patidaiファイルを準備する（ファイル構築は下記に記述）
Dockerアプリを立ち上げる
ルートディレクトリーで　docker-compose up server web
F5、またはfn+F5を押して、patipuro-vscode/out/extension.jsを起動する
shift + command + P　で　「PatiPro: 開始」を実行
zipファイルを開いて遊ぶ。

変更可能なパチ台フォルダ構造

A.patidai/
├── assets/                        # ゲームで使う素材ファイル
│   ├── bgm/
│   │   └── toudai.mp3             # BGMファイル（.mp3/.ogg/.wav）
│   ├── images/
│   │   └── jyogi.png              # 盤面背景画像（.png/.jpg/.jpeg/.webp）
│   └── movies/
│       ├── reach_01.mp4           # リーチ演出動画
│       ├── reach_02.mp4
│       ├── reach_03.mp4
│       ├── success_01.mp4         # 大当たり演出動画
│       ├── fail_01.mp4            # 外れ演出動画
│       └── fail_02.mp4
│
└── configs/                       # 台の設定ファイル群
    ├── stageconfig.json           # メイン設定ファイル（必須）
    └── effects/                   # 演出設定JSONフォルダ
        ├── normal/                # 通常時の演出
        │   ├── reach/             # リーチ演出設定
        │   │   └── A.txt          # 演出ごとのJSON（拡張子はtxtだがJSON内容）
        │   └── success/           # 大当たり演出設定
        │       └── A.txt
        └── rush/                  # ラッシュ（確変）時の演出
            ├── reach/
            │   └── A-R.txt
            └── success/
                └── A-R.txt

使用技術

フロントエンド (パチンコ画面): React (v19), TypeScript, Vite, Matter.js (物理演算) バックエンド (中継サーバー): Node.js, WebSocket (ws) エディタ拡張機能: VS Code Extension API, TypeScript 開発環境: Docker, Docker Compose

テーマ:「未来のコラボレーションをつくる」

PatiPro最大の魅力は、背景画像・BGM・演出動画をカスタマイズした「オリジナル台（.patidai形式）」を自作し、読み込める点です。チーム内のミームや、プロジェクトのテーマを詰め込んだ台をチーム内で共有し合うことで、単なるソースコードの共有を超えた「開発環境の楽しさ」をシェアする、新しい非言語コミュニケーションを実現します。

1. Try First.（常識にとらわれない開発体験） 「エディタは真面目な作業ツールである」という現状のボーダーを打ち破りました。 コーディングやビルドという無機質な作業に、あえて「パチンコの物理演算」という極端なエンターテインメントを掛け合わせるという挑戦（Try First）をしています。また、私たち自身も触ったことのない技術領域等に挑戦している者もおり、常に挑戦の心を持ち開発を行いました。

2.Love Differences.（「自分だけの台」で個性をリスペクト） それぞれの「好き」を開発環境に持ち込み、楽しい雰囲気を作ります。 PatiProは、画像やBGMをカスタマイズした「オリジナルのパチ台（.patidai）」を自作し、読み込めるModエコシステムを備えています。自分の推し、好きな音楽、あるいはチーム内のミームを詰め込んだ台をシェアし合うことで、オープンマインドで「楽しい雰囲気」を生み出し、メンバーの嗜好や文化の違い（Differences）をポジティブな力に変えます。また、開発時においても、プロダクトの仕様決めの際に多くの話し合いを重ねお互いのアイデアを共有し合いました。

3.Goal Oriented.（喜びや悲しみを、エンタメとして分かち合う） 孤独な作業時間を、チームの共通言語に変えます。 長いビルド時間や、テストが通らない苦悩は、エンジニアにとって孤独な時間です。PatiProはそれを「リーチ演出」や「ハズレ」「大当り（ラッシュ）」に変換します。エラーが出た時の「悲しみ（激アツ外し）」も、本番デプロイが成功した時の「喜び（確定演出）」も、PatiProを通じてチームの雑談や熱狂のタネになります。感情を分かち合いながら、共にプロダクトのゴール（目的地）を目指すための最高のスパイスになります。

PatiPuro.vscode

開発中でも手軽に脳汁体験！！コードを打つことでパチンコができる！

推しアイデア

作った背景

推し技術

プロジェクト詳細