こんにちは！
AYDesignです。
Adobeストックをお試しで使ってみたら、解約するのを忘れてうっかり3ヶ月も料金を払ってしまっていました！
1ヶ月10点まで、写真素材やイラストがダウンロードできるAdobeストック。
クオリティが高い写真や、ベクター画像が揃っていて便利です。
しかも10点使いきれなかったら、次の月に繰り越されます。
私は3ヶ月も放置していたので、使える素材が30点も溜まってしまっていました！
解約すると、せっかくの30点も使えなくなってしまいます。
もったいないので、この素材を使って、デモのWEBサイトを作ってみようと思います。
パン屋さんのデモサイトを作ってみよう
Adobeストックに、パンの素敵な素材があったので、パン屋さんのHPを作ることにします。
私も、自分が作りたい、こんなクライアントさんが来たらいいなあ〜という想定で作ります。
1.架空のパン屋さんにヒアリング
今回は、以下のようにふわーんと「HPがほしいな」と思っているパン屋さんを想定します。
店舗名は「Wonderful Bakery」。
オーナーは、パンダさんと言います。
「小麦や酵母などの素材を生かした、遊び心のあるおいしいパンづくり」にこだわっています。
奥さんと、スタッフを1人の3人体制でお店を回す、こじんまりしたパン屋さんです。
住宅街の中の目立ちにくい場所にあり、お客さんは近所の人が多く、認知度は「知る人ぞ知る」なのですが、美味しいと定評があり、愛されています。
パンダさんは、もうちょっと認知度アップして、隣町からもお客さんが来るようになればいいなあと思っています。
パンダさんは
- インスタグラムはやっているけど、HPは持っていない。
- どんなこだわりを持ってパンを作っているか、伝えたい。
- 定番メニューを一覧で紹介できるページがあったらいいなあ。と思っている。
- 最新情報や、新商品などはインスタで対応するから、HPの更新はあまり必要ない。
- 名刺代わりの簡単な、でも素敵なHPが欲しい。
- ゆくゆくは通信販売も考えている。
とおっしゃいます。
目指す完成イメージは
ナチュラルで、洗練された、でも少し遊び心のある、敷居が高くない雰囲気。
とのことです。
2..載せたい情報を洗い出しする
まず、HPに載せたい情報をヒアリングします。
- 住所、電話番号、営業時間など、店舗情報
- アクセスマップ
- お店のこだわり
- 定番商品の一覧
- SNSへのリンク（インスタ）
載せたい情報は、「どんなお店かがわかる」基本的な情報だけなので、縦に長い1ページのサイトで十分だと思います。
ここで、キャッチコピーや、載せたい文章、があればそれも送っていただきます。
リライトしたり、一緒に考えることもできます。
3.ワイヤーフレームを作る
載せたい情報と、ページ数が決まったので、ワイヤーフレームを作っていきます。
ここで、写真やイメージ画像をどのくらいの分量で使うのか、ボタンはどこに配置してどこに飛ぶのか、などざっくり共有理解します。
ワイヤーフレームが完成しました。
デザインではなく、ページの構成やリンクがどうなるかを確認するためのものです。
これをパンダさんにみてもらいます。
続きは、次回。
