「日常の中のコーヒータイム」等身大で飾らない、素朴さと温かみを

ヤマとカワ珈琲店

ブランディングサイト　ECサイト　更新システム（CMS）

Visit Site

Outline

「いつもの日がちょっとよくなるコーヒータイム」を提案するヤマとカワ珈琲店様のWebサイトを制作しました。「日常の中のコーヒータイム」を強く印象づけるために写真を大きくふんだんに使い、飾らない、角を取った素朴なデザインに仕上げました。
また、知りたい情報にアクセスしやすく、買いやすいサイトであることを重視し、既存のECサイトとの連携して商品ページからの購入もスムーズに行えるようにしました。

Planning

＜課題＞
・ECへの導線や購入ボタンの場所がわかりづらく、購入までにストレスを感じる
・公式とECが分離しており、行き来が面倒
・デザインにテンプレート感があり、ヤマとカワ珈琲店らしさが伝えきれていない

＜リニューアル方針＞
・購入ユーザーが商品を買いやすいように、UIを改善する
・ヤマとカワ珈琲店らしさを視覚的に表現する
・業務用、卸売り販売用のコンテンツを作成し、新しい顧客を獲得する
・はじめて訪れた人にはしっかりと説明をする

＜コンセプト＞
・訪れた人に気持ちよく接客できるWebサイトに（購買・各種サービス）
・「いつもの日が、ちょっとよくなるコーヒー」を表現する

Design

「いつもの日がちょっとよくなるコーヒータイムを。」というコピーと、その言葉を表すような、日常のなかで丁寧にコーヒー豆を挽いている様子の写真をメインビジュアルに用いました。
白地にネイビーの落ち着いた配色と、余白感のあるシンプルなデザインで、訪れた人に心地よさを与えることを目指しました。

Technology

商品詳細ページが充実しているので、カートシステムだとカートボタンを押すためにまた上までスクロールしなければならず使い勝手が悪いことが課題でした。

そこで、商品詳細ページはCoサイトで作成し、カートのみカラーミーを使用することに。商品詳細ページの自由度を高くすることで、これまでの使いづらさを解消しました。

自分好みのコーヒー豆をどのように選んだらよいか、わかりやすく伝えるコンテンツを作成しました。
選び方を伝えた後に商品詳細ページに遷移できるチャートも用意し、利便性を高めています。

Project Data

Client: ヤマとカワ珈琲店
Place: 長野県長野市
Launch Date: 2021.5
Url: https://yamatokawa.com/
Industry: 食品・飲料　暮らし

Director: 保科大輔
Designer: ハラヒロシ
HTML Coder: 小林宗太 [栗の木デザイン]
Engineer: 小林宗太 [栗の木デザイン]