
Warm & Fuzzy
3D/VFXスタジオのポートフォリオ。作品側はCG中心だが、サイト自体はNext.jsと動画配信で組まれている。
- クレジット
- Neutral Studio / Warm & Fuzzy
- 使用技術
- Next.jsStoryblokMuxページトランジション
2016年設立のクリエイティブプロダクション Warm & Fuzzy の公式サイト。Andrew Jerez と John Bashyam の2人がクリエイティブディレクターを務める12人体制で、クリエイティブディレクション、プロダクション、ライブ体験、アニメーション、デザイン、VFX、エディトリアル&フィニッシング、AI & Emerging Tech の8領域を掲げます。Bose、Coca-Cola、Converse、Crocs、Instagram、Under Armour などの案件が Work に並びます。サイトのデザインは Neutral Studio。
フロントは Next.js で、画像は /_next/image 経由、作品動画は Mux(image.mux.com のサムネイル)で配信しています。CMS は Storyblok で、og:image も a.storyblok.com に置かれています。Awwwards は 3D タグを付けていますが、これはスタジオの作品内容がCG/VFXであることを指しており、サイト側にリアルタイムWebGLの痕跡は見つかりませんでした。
【参考になるポイント】
・3D/VFXスタジオのサイトが必ずしも WebGL で作られているわけではない、という好例。見せ場は Mux で配信される作品動画そのもの
・Next.js + Storyblok + Mux は、動画量の多いポートフォリオでは扱いやすい組み合わせ
・Awwwards のエントリー説明もイントロアニメーション、アイドルアニメーション、ホバー、ページトランジションと、2D演出と動画を中心に挙げている
・※Three.js / WebGL / canvas の使用は未確認。JSバンドルは解析していない
・※Awwwards のコミュニティスコアは 8.6/10 前後
