
Ricardo Chance — Portfolio
ブエノスアイレスのデザインエンジニアの個人サイト。パーティクルのモーフィングとスクロール連動のリグ操作が全編の主役。
- クレジット
- Ricardo Chancé Chang
- 使用技術
- React Three FiberThree.jsGLSLGSAPパーティクル
ブエノスアイレス在住のデザインエンジニア/クリエイティブデベロッパー Ricardo Chancé Chang の個人ポートフォリオ。Home / About / Work / Contact の4ページ構成で、/nk.studio、Flixxo、Suku といったクライアントワークを載せています。About ページには、ビジネスからソフトウェアエンジニアリング、UX、WebGL へとまたがった10年以上のキャリアが書かれています。
技術面の記述が珍しくはっきりしているサイトで、meta description の時点で WebGL, Three.js, and GSAP を名指ししています。サービス紹介には "Custom GLSL shaders for transitions, distortions, particle systems" とあり、Awwwards のエントリー側も React Three Fiber / WebGL / GLSL / GSAP を並べています。Awwwards が挙げているインタラクションは、マウス追従のパーティクル、リグとスクロール歪み、パーティクルの変形、カルーセル、背景の切り替えの5つです。
【参考になるポイント】
・About ページのツール一覧が具体的。3D側は Blender / Spline / Unreal Engine、Web側は Three.js / React Three Fiber / GLSL / Theatre.js / Next.js / TypeScript と並ぶ
・Theatre.js を挙げている点が特徴的。スクロール駆動のカメラリグをタイムラインで作り込むタイプの構成が想像できる
・OG画像はページ別に用意されていて、トップは /og/og-home.png、それ以外は /og/og-default.png にフォールバックする
・Awwwards スコア8.23(15票)、2026年7月19日に Honorable Mention
・※パーティクル系の uniform 名やシェーダの中身は未確認。JSバンドルの内容までは追えていない
