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

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 による自動化アプリを、より現代的なアーキテクチャで再設計する方法を検討しています。元のアプリは数年間稼働し続けているため、置き換え戦略を考えるうえで実用的なケースになっています。