Best Bean Best Cup

メルボルン Keilor Park のベトナムコーヒー焙煎所 Best Bean Best Cup のオンラインストア。No.72 Bold（ベトナム産ロブスタ）や Vina House ブレンドを扱い、フィン、エスプレッソ、プアオーバーといった抽出方法ごとに導線が切られています。ベトナムのコーヒー文化とメルボルンの焙煎という2つの軸を前面に出した作りです。制作は Nam Bui。 Awwwards のタグは 3D・Blender・After Effects・Figma。ストア基盤は Shopify で、アセットは cdn/shop/files 配下に置かれています。ヒーローは herobanner-desktop.mp4 と herobanner-mobile.mp4 のデバイス別動画、そこに bd-pattern.webp や Illus.svg といったイラスト素材が重なる構成で、Three.js・WebGL・model-viewer・Spline の参照はHTMLに存在しません。3Dは Blender で作って書き出した映像と画像です。 【参考になるポイント】 ・ヒーロー動画をデスクトップとモバイルで別ファイルに分けている。縦横比とビットレートを端末側で出し分ける、EC寄りの実直なやり方 ・Shopify テーマの上でこの見た目を作り切っており、リアルタイム3Dを一切持ち込んでいない。表示速度と購入導線を優先した判断として読める ・og:image が cdn/shop/files/1.png?v=1712898639 で、Shopify のバージョンクエリ付きURL。キャッシュ更新をクエリで回している ・※3Dライブラリ不使用の判定はHTML内に該当参照が無いことが根拠。Tier B のためバンドル解析はしていない ・※Awwwards は2026年8月16日時点で Nominee