[あべちゃん #03] Webサイト作成〜構成編〜
ワイヤーフレーム を作ってみました。
KNAPデザイナーのあべです(@abe44355904)
前の記事はこちらです!(今回の記事だけ読んでも大丈夫です)
----------------------------------------------------------------
紅茶の商品のブランドサイトを作っていこうということで、
ワイヤーフレームを作成しました。意図して作った点などを記録しておきます!(今回はトップページのみの作成になります)
■作成ツール:Adobe XD
01. メインビジュアル
・ロゴとキャッチコピーを置いています。ロゴは一部商品名ともなるので大きく打ち出します。
・右上のボタンはオンラインショップに飛べるものになります。スクロールしても追従させることで、興味を持った時点ですぐ購入できるようにします。
・メイン画像は、実際 自分の部屋にIROCHAがあるような、"空間"が伝わるものにする予定です!
02.コンセプト
このブランドの一番の目的は、
「商品を通して、素敵な空間を作り、自分だけの特別な時間を過ごしてもらう。」というものになります。
購入者にこうなって欲しい、そうするために自分たちがいる。というメッセージ性のあるブランドなので、コンセプトを一番に持ってきました。
03.<紅茶1>定番商品
定番商品を大きく載せて、下で他の商品を見せていきます。
(クリックで商品詳細ページへ飛びます)
04.<紅茶2>はじめてセット
普段紅茶を家で淹れたりしない方がターゲットにいるので、基本のセットを次に大きく載せます。「自分でも始められそう!」と思わせられる工夫をしようと思います。
05:<空間>グッズ商品等
テーブル周りのグッズで空間づくりの商品を載せます。
また、その下では紅茶時間を楽しくする音楽やお話のコンテンツに飛べるバナーを置きます。
06:ニュース/フッター
あとはニュースなど入れる予定ですが、
もっと分かりやすくするためにコンテンツ増やすかもです。
IROCHAは商品で日常を彩る役割を担っているので、背景は白系にしようと思ってるのですが、シンプルになりすぎないように色々デザインで考えなきゃと思っています・・・!
次回予告
次回は、、ロゴが、、できてると、いいよね、、
こうご期待!
この記事を書いているメンバーが働いている会社
よかったら見に来てください!