AKASHIKI
BACK TO WORKS一覧へ戻る
WORKS/CAFE AOKI
CORPORATE

CAFE AOKI

カフェ・飲食 / 店舗サイト

自家焙煎カフェの店舗サイト。フルスクリーン動画×手書きサインのFVを起点に、動画16本で焙煎から一杯までの物語を紡ぐ全7ページ構成。

このプレビューは実サイトを埋め込み表示しています。レイアウトは実際の閲覧環境と異なる場合があります。

FVは4本の動画がクロスフェードするローテーションに細身の手書きサインを重ね、アーチ型の動画カードや歩みのマーキーなどエディトリアルな語彙で「静けさを焙煎する」世界観を構築。メニュー・豆販売・予約まで7ページで店の一日を描いた。

背景・課題

動画16本を主役にしながらIntersectionObserverで再生を制御して軽さを確保し、クリーム基調×セリフ書体の柔らかなトーンでカフェらしい上質さと来店導線を両立させた。

ジャンル
カフェ・飲食
サイト種別
店舗サイト
制作年
2026年
想定予算帯
¥150,000〜200,000
制作期間帯
要件に応じて調整
規模感
7ページ
担当範囲
企画・設計・デザイン・コーディング・実装・公開(すべて一人)
デザイン傾向
クリーム / エディトリアル
主な機能
動画演出アニメーションフォーム予約導線SNS連携Google Maps
使用技術
HTMLCSSJavaScript
CMSなし
フォームあり
アニメーションあり