概要 Overview

新宿駅のNEWoManに新たにオープンするジェラート店「Gelateria MAKO」(架空)のWebサイトを制作。

• 制作期間：8日間
• 担当箇所：デザイン、コーディング
• 使用ツール：Photoshop、Figma
• URL：https://gelateria-mako-satsukitakada.netlify.app

リクエスト

• クライアント企業：Gelateria MAKO
• 特徴：ジェラートの本場イタリアで10年間修行した店主が作る本格ジェラート
  　　 　　 オーガニックな素材を利用し、身体に優しい
• 依頼内容：Webサイトの制作（オープンに伴い）
• その他：パソコン(PC)版 / タブレット(Tab)版 / スマートフォン(SP)版を作成して欲しい

プロセス

ターゲット

• 女性
• 20代後半
• 都内の1LDKでひとり暮らし
• シンプルなものを好む
• オシャレに関心がある
• 装飾より機能を好む

ペルソナ

デザイン

ファーストビュー

１枚の写真→aboutに書いてある食感「なめらかさ」を、
２枚の写真→自然をバックにしている写真を使用し「オーガニック」を、
３枚の写真→ジェラートならではの鮮やかな色で「食欲」を、
４枚の写真→旅行気分を味わってもらいたいという「店主のメッセージ」と「世界観」を、
スライドショーを用いて視覚的・瞬間的に伝えています。

サイトデザイン

ペルソナに合わせ余計な装飾を使わず、シンプルかつ洗練された印象与えることを軸に作成しました。

オーガニックな素材を利用し身体に優しいというお店の特徴から素材のもとが分かる果物の写真を使用することで身体に優しいことをアピールしました。

全体的に十分な余白を取ることで、メインコピーやペルソナに合わせ、ゆったりとした一人の上質な時間を過ごせるイメージを連想させられるように表現しました。

配色

青や緑、ポップな印象が多い競合他社のジェラート店との差別化をはかるため、落ち着いた上質さを感じさせる配色にしました。

フォント

文字の線が細いNanum MyeongjoとHiragino Mincho Proを使用し、シンプルな文字かつ、可読性のが高いこと、また、洗練された上品な印象にしました。