
United Carriers
APAC中心の国際物流会社。3Dヒーローから始めて、1つの貨物が陸・海・空を渡る流れをスクロールで辿らせる。
- クレジット
- Bearplus / Kenny Ho
- 使用技術
- Three.jsGSAPWebflowページトランジションスクロール連動
United Carriers はオーストラリア、ニュージーランド、中国、香港に拠点を持ち、100カ国以上のネットワークで貨物を扱うフォワーダーです。サイトは "One operator / Every leg of the journey" を掲げ、航空・海上貨物、通関、倉庫、陸送までを1社で通すという主張をそのまま導線に落としています。制作は Bearplus(Kenny Ho)。
制作側の説明では、企業サイトの定型レイアウトを避けて、1つの貨物が陸・海・空をまたいで進む流れを追う構成にしたとあります。Awwwards には、プリローダー、3Dヒーロー、スクロール連動のストーリーテリング、ページトランジション、専用404が要素として登録されています。基盤は Webflow で、タグには Three.js と GSAP が併記。ヒーロー以外では点で構成された世界地図のアニメーションや Sea-wave-2_mp4.mp4 という映像素材が使われています。
【参考になるポイント】
・Webflow の上に Three.js を載せる構成。3Dはヒーローに限定し、以降は地図アニメーションと動画で持たせている
・サービスページ(/services)と業種ページ(/industries)まで同じトランジション設計が通っており、トップだけの作り込みで終わっていない
・og:image は cdn.prod.website-files.com 配信で、Webflow 標準のアセットパイプラインをそのまま使っている
・※3Dヒーローに何が置かれているか(コンテナ船か地球儀か等)は WebFetch では確認できず。Three.js の使用も Awwwards のタグ表記が根拠
・※Awwwards は2026年8月3日時点で Nominee
