Works
ATEMPO
Leather Bag Brand — Store Build
Year
2026
Role
ストア構築・オープニング演出・商品一覧
商品ページのUI実装
商品ページのUI実装
Industry
Fashion / Leather Bags（EC）
Overview01
ATEMPO
「At your own tempo.」——流行に追われず、
自分にとって心地よい速度で日々を歩く。
そんな思いから生まれたレザーバッグブランド
ATEMPO（アテンポ）のオンラインストアを構築しました。
Overview02
写真と映像を大きく見せ、
余白を生かした静かなデザインで、
ブランドの世界観をそのまま伝える構成です。
トップは、ロゴが浮かび上がるオープニングから
全画面の映像へ。
Overview03
TOTE BAG・MINI BAG・PHONE BAG の写真を押すと、
一覧の該当するカテゴリーへ直接移動します。
一覧では商品カードの上で写真を送ったり色を
切り替えたりでき、商品ページは横に並ぶ
大きな写真と、PC では画面下に固定した購入バーで、写真を主役にしたまま迷わず購入まで進めます。
Details
サイトを開くと、ロゴが下から浮かび上がり、
白い幕が上がって全画面の映像へ。
最初の数秒で、ブランドの静かな空気感に引き込みます。
一覧の商品カードは、マウスを乗せると
別カットに切り替わり、矢印で写真を送れます。
色のチップを押せば、ページを移動せずに
その場で別の色の写真に切り替わります。
商品ページは大きな写真を横に並べ、
矢印で送るたびに
下の線で今の位置が
分かる構成にしました。