Website

KIZUNA COFFEE

焙煎カフェ「絆珈琲」のサイト。「一杯の余白を、大切に。」をテーマに、 手仕事の空気感と読みやすさを両立したデザインです。

KIZUNA COFFEE ウェブサイトのモックアップ
Role
Web Design / Front-end
Type
カフェサイト
Focus
余白 / タイポグラフィ / レスポンシブ

Overview

焙煎の手仕事と、一杯の余白を写真と縦書きで表現しました。 ヒーローでは豆をすくう手元を大きく見せ、コンセプト・メニュー・店舗案内へつなぐ構成です。

Approach

温かみのあるトーンと明朝の見出しで、焙煎所の空気感を前面に。 季節メニュー、スタッフ、豆のコラム、店舗情報までを一枚のトップにまとめ、 PC・スマホともに写真が主役になるレスポンシブ構成にしています。

Deliverables

トップページデザイン、レスポンシブ対応、フロントエンド実装。

Design

完成図

KIZUNA COFFEE 完成図(PC)
PC
KIZUNA COFFEE 完成図(SP)
SP