【自主制作】りんご飴のWEBサイト作成

OVERVIEW

SHElikesの卒業制作でりんご飴の販売サイトを作成しました。

■要件

クライアント情報

りんご飴の販売を始めたばかりの方からのご依頼と想定。

日本各地の産地から、様々な種類のりんごを取り寄せている。 「何度も味わいたい、お祭りの味」をコンセプトにいつでも味わえるりんご飴のお店を開いた。 毎日一つ一つ丁寧に作り上げ、りんごと飴の美味しさを追求している。

目的
・HPを見たことによって来店をしてもらうことが目的。
・現在、飲食店に特化したホットペッパーやグルナビ、食べログに掲載しているため 媒体費用がかかっている。そのため、媒体を使わずに自社HPでの来店が目標。

概要
インパクトのあるサイト
メインビジュアルを見ただけでりんご飴のサイトとわかるようにした。

ペルソナ設定
27歳 女性。おしゃれな雰囲気のデザートが好きで、普段コンビニやスターバックス、タピオカ店などでデザートやドリンクをよく購入する。

■制作物

■ コンテンツアイデア

りんごにこだわっているお店のため、そのこだわりを記載。

■デザインアイデア

情報設計
今使用している媒体を使わずに来店してもらうことが目的のため、アクセス部分はgoogleマップにリンクできるようにした。

デザイン
・配色:パッと見た感じインパクトのある、りんごに合った赤をメインカラーに配色を組んだ。

・写真:りんご飴の素材が少なかったため、メニュー内のりんご飴の写真はお皿とりんごを合成させて作成。本当にお皿に載っているようにするために、シャドウの位置や明るさなどの調整に苦戦。

・ロゴ:METROPOLICEというフォントで、 RINGOの「R」を大きくしおしゃれ感が出るように作成。

・jQuery:メインビジュアルは関して、背景画像をそのままスライドショーにできるvegasを使用し、インパクトのある動きをつけた。
 全体的にふわっと出てくるような動きをjqueryで実装。
 ナビゲーション内をマウスでホバーすると、ホバー時に左から右へラインが出てくるように実装。