bi..
- カテゴリー
- ウェブサイト
- クライアント
- アクセサリーブランド bi..（架空）
- 担当範囲
-
企画・ワイヤフレーム
アートディレクション
レタッチ
ライティング
デザイン
コーディング
- URL
- https://bidot.sakura.ne.jp/bi
架空のビーズアクセサリーブランド「bi..」のWebサイトを制作いたしました。 架空ブランドのWebサイト制作にあたり、ブランドの立ち上げからヴィジュアル用のスタイリング、撮影なども行いました。 「bi..」の特徴は、「クールな雰囲気のビーズであること」、「商品名にストーリー性があること」の2点です。 この2点をWebサイトで打ち出し、他ブランドとの差別化を行いました。
デザインコンセプト
大人の女性
ターゲット
20~30代のカジュアルなファッションが好きな女性
目的
ブランドコンセプトを視覚的に表現し、ファンを増やすこと
課題
他社との差別化
製作期間
企画
2週間
スタイリング
2時間
撮影
8時間
レタッチ
10時間
デザイン
3週間
コーディング
2週間
制作人数
2名（ 内1名カメラマン ）
使用ツール
Illustrator / Photoshop / Figma / Visual Studio Code
SP版 : TOPページ
- “bi..”らしさを捉えた写真
- アクセサリーを重ね付けしインパクトを。背景は無機質な鉄やコンクリートにすることで、媚びない女性らしさを演出。
- “bi..”について
- イメージソースの自然や花を撮影。ブランドの説明とともにイメージソースも認識してもらうことが狙い。
- “bi..”のこだわり
- 1つひとつの色に意味が込められているということから、それぞれのビーズの色がきれいに映る写真を撮影し背景に設置。
- 差別化：商品のストーリー性を伝える
- 商品名には花や自然にまつわる名前がつけられており、その特徴を伝えるコンテンツ。
- ホバーすると
イメージ写真が出現
- 商品名の由来となるエピソードを記載
- 差別化：実際に見に付けるイメージを沸かせる
- 購入する際の参考にしてもらうことが目的。また、「大人の女性」を視覚化し、世界観を提示する役割も担う。
SP版 : 下層ページ(gallery)
- 小道具
- 花を使用し女性らしさを演出。また、イメージソースが自然や花であることも印象付けたい狙い。
- 差別化：スタイリング
- 洋服はシンプルにし、クールで媚びない女性像を演出。
- レタッチ
- ビーズの色が実物に近づくよう、明るさや彩度等を調節。
PC版 : TOPページ
- “bi..”らしさを捉えた写真
- ビーズアクセサリーを扱っていることがわかるように、アクセサリーを重ね付けしインパクトを出しました。 また、モデルはターゲット層と同年代を起用、背景はコンクリートにすることでクールな雰囲気にしています。
- “bi..”について
- “bi..”のイメージソースが自然や花ということから、自然や花の写真を撮りました。 ブランドの説明とともにイメージソースも認識してもらえるよう、こちらのコンテンツに写真を配置しています。
- “bi..”のこだわり
- 色使いにこだわり、1つひとつの色に意味が込められているということから、ビーズの色がきれいに映る写真を撮影しました。 また、ブランドの裏テーマである「ビーズと美の可能性」を表現すべく、無限に広がる「宇宙」をイメージして撮影しました。
- 差別化：商品のストーリー性を伝える
- 商品名には花や自然にまつわる名前がつけられており、商品名は”bi..”の特徴の1つです。この特徴を伝えるコンテンツにするため、下記の2点を工夫しました。
- ホバーするとイメージ写真が出現
- 商品名の由来となる情景がイメージできるよう写真でイメージを付与しています。
-
ex.
「nagisa」をホバーすると、波打ち際の写真が現れます。
- 商品名の由来となるエピソードを記載
-
ex.
「nagisa」のどのような瞬間を表現した商品なのかをストーリー風に説明しています。
- 差別化：実際に見に付けるイメージを沸かせる
- どのようなテイストの洋服に合わせられるのか提示し、購入する際の参考にしてもらうことが目的です。 また、”bi..”のブランドコンセプトである「大人の女性」を視覚化し、世界観を提示する役割も担うコンテンツです。
- 既存のファンに向けて
- 既に一定数のファンがいらっしゃるブランドですので、ファンの方に向けてお知らせができるコンテンツを設置しました。
PC版 : 下層ページ(gallery)
- 差別化：写真の背景
- 「大人の女性」を表現するため、コンクリートやガラスなど、無機質な質感の背景を採用し、クールで媚びない雰囲気にしています。
- 小道具
- 花を使用し女性らしさを演出。また、イメージソースが自然や花であることも印象付けたい狙いです。
- 差別化：スタイリング
- 洋服はシンプルにし、クールで媚びない女性像を演出しました。 アクセサリーの色に合わせて同色のトップスでまとめたり、ビーズの色が映えるような落ち着いた色味のトップスを使用するなどしてスタイリングしました。
- レタッチ
- ビーズの色ができるだけ実物と同様になるよう、明るさや彩度等を調節しました。
PC版 : TOPページ
PC版 : 下層ページ(gallery)
SP版
PC版 / SP版 : 全体
