制作プロジェクト & ケーススタディ

React Three Fiber のインタラクティブな3Dシーンを、より構造化しやすく、テストしやすく、保守しやすくするための小さな制御レイヤーです。

r3f-interactive-flow は、React Three Fiber のシーンにおけるフェーズベースのインタラクション制御に焦点を当てたライブラリです。大きなアニメーションフレームワークを目指すのではなく、シーンのフェーズ、遷移、入力挙動を扱うための小さく読みやすいAPIを提供します。また、人間とAIコーディングエージェントの両方が安全に理解・拡張できるよう、AIフレンドリーなドキュメント、予測しやすいTypeScript型、コピーしやすい小さなサンプルを重視して開発しています。

プライバシー、ネイティブ性能、トラッキング・デスクトップUI・Webプレビューの責務分離を重視した、ローカルファーストなバーチャルアバタースターターキットです。

Local Virtual Kit は、ローカルファーストなVTuber・バーチャルアバター向けスターターキットです。カメラフレームをローカルに留めることを前提に、トラッキングやランタイム処理、Electronデスクトップシェル、Web Preview の責務を明確に分離する設計を重視しています。各レイヤーが不用意に壊れないよう、安定した MotionFrame 契約を中心に構成しています。現在はドキュメントや安全確認中心の段階から、より目に見える実装フェーズへ移行しています。

実務的なソフトウェア開発に向けた、エンジニアリング特化のAIエージェントテンプレート、ワークフロー、プロンプト指針をまとめたOSSです。

engineering-agents は、エンジニアリングに特化したAIエージェントとワークフローのためのOSSテンプレートライブラリです。Frontend、Design、Review、Codex workflow agents を中心に、再利用可能なプロンプト、PRテンプレート、エージェント作成ガイド、ロードマップ指針、公開OSS向けの衛生ルールを整理しています。すべての役割を一度に網羅するのではなく、実際の開発ワークフローで安全に再利用できる、安定した初期エージェントテンプレート集を目指しています。

Next.js、Framer Motion、React Three Fiber、パーティクル表現を使って構築した、モーション中心の個人ポートフォリオです。

このポートフォリオは、従来の静的なランディングページではなく、インタラクティブな入口として設計しています。トップページではビジュアル表現、モーション、創造的なフロントエンド表現を重視し、Projects、Lab、Blog、About などの補助ページでは読みやすいコンテンツ構造を採用しています。

開発の記録、進捗、技術的な判断を残すための、開発者向け proof-of-work コンセプトです。

Traceraft は、自分の開発プロセスを明確に記録したい開発者向けのプロダクトコンセプトです。日々の開発活動を、整理された共有可能な技術的実績として残すことを目的にしています。

React Three Fiber を使い、スキルアイコンをインタラクティブなビジュアル体験へ変換する手作りのパーティクルモーフシステムです。

Skills セクションでは、React Three Fiber を使ってインタラクティブなパーティクルステージを作成しています。技術スタックを単にテキストで並べるのではなく、選択したスキルをパーティクルの動きや手作りのアイコン点群生成によって表現しています。

Supabase、サーバーサイドデータ取得、Cloudflare R2 の画像アセットを使った軽量なブログシステムです。

このブログシステムは、公開ポートフォリオを軽量に保ちながら、構造化されたコンテンツ、画像アセット、詳細な技術記事を扱えるように設計しています。データ保存には Supabase、画像アセット配信には Cloudflare R2 を使用しています。

長期間稼働している LINE Messaging API と GAS 自動化アプリを、より現代的な構成へ置き換えるための構想です。

このプロジェクトでは、既存の LINE Messaging API と Google Apps Script による自動化アプリを、より現代的なアーキテクチャで再設計する方法を検討しています。元のアプリは数年間稼働し続けているため、置き換え戦略を考えるうえで実用的なケースになっています。