Meatopia

米国の食肉大手 Smithfield Foods が持つブランド群を紹介するキャンペーンサイト。制作は Arro Labs。「Take your taste buds on a trip」というコピーの通り、傘下ブランドをイラストで描かれた架空の土地に配置し、そこを巡って回るという建て付けです。Mayor of Meatopia のように、マップから入る個別ページも用意されています。 Awwwards の申告技術は Three.js で、サイトの主役は3Dのインタラクティブマップです。HTMLを取得しても本文がほとんど返らず Google Tag Manager のスニペットしか残らないため、マップもナビゲーションもJS側で組み立てられていることが分かります。CMS は Kontent.ai で、アセットが assets-us-01.kc-usercontent.com から配信されています。 【参考になるポイント】 ・アセット配信が kc-usercontent.com、つまりヘッドレスCMS の Kontent.ai をバックエンドにしている。ブランドの出し入れをCMS側で回せる作り ・og:image がロゴ画像で、3Dマップのスクリーンショットではない。SNSシェア時にこのサイトの一番の見せ場が伝わらない ・イラストは Adobe Illustrator、デザインは Figma と Awwwards のタグに記載がある ・※Three.js の使用は Awwwards の申告タグとサイト説明が根拠。バンドルを開いて WebGLRenderer などの実体は確認できていない ・※Awwwards は2026年8月18日時点で Nominee