1. 🃏

   絵1枚を、傾けると立体に見えるカードにする：深度マップとWebGLのシェーダ

   2026/10/03

   • WebGL
   • 深度マップ
   • Depth Anything
   • 個人開発
   • カード
2. ✨

   ホロ・箔押し・ラメをブラウザで作る：color-dodge の虹とカード全体に乗せる1枚の層

   2026/10/02

   • WebGL
   • CSS
   • シェーダ
   • ホロ
   • 個人開発
   • カード
3. 💎

   レア度を「ふつう→ホロ→立体→飛び出す」の4段階で設計した話と、没になった案から分かったこと

   2026/10/01

   • 設計
   • UX
   • WebGL
   • 個人開発
   • カード
4. 🌈

   トレーディングカードのレア表現12種を調べてブラウザで再現した記録と、別の目での評価

   2026/09/30

   • WebGL
   • シェーダ
   • トレカ
   • 個人開発
   • カード
5. 🪙

   浮き彫り（レリーフ）加工をブラウザで再現する：写真の明るさではなく、線画を溝にする

   2026/09/29

   • 画像処理
   • OpenCV
   • WebGL
   • シェーダ
   • 個人開発
   • カード
6. 🎁

   パック開封の演出を three.js で作る：動画のコマ観察、キャンバスの罠、袋の質感、衣装がかぶらない抽選

   2026/09/28

   • three.js
   • WebGL
   • 演出
   • 個人開発
   • カード
7. 👀

   Webカメラで頭の位置を追い、窓を覗くようにカードの奥を見せる実装と検証

   2026/09/23

   • WebGL
   • MediaPipe
   • カメラ
   • JavaScript
   • 個人開発

すべての記事へ →