＃3D × Web
Face Portfolio
- Role
- Frontend Engineer
- Year
- 2025
- Type
- Personal Project
Three.js を活用した3Dキャラクターアニメーションをメインビジュアルに据えたポートフォリオサイト。スクロールに連動してキャラクターが切り替わり、サイト全体でインタラクティブな体験を提供します。
Features
セクション連動3Dモデル切り替え（4体）
Draco圧縮でモデルを最大86%軽量化
ホバー・クリックでエミッシブグロー演出
スクロール型・パネル型の2レイアウト
Works Admin（GitHub自動push対応）
Technical Highlights
GLTFLoader + DRACOLoader による効率的なモデルロード
UnrealBloomPass でシネマティックなブルーム効果
Raycasting によるメッシュ単位のインタラクション
IntersectionObserver でスクロール連動アニメーション
Express API + GitHub REST API でコンテンツ管理
Three.js / GLSL / Express.js / GitHub API / Vanilla JS / CSS
Next Knowledge Nexus→