[ Web Design ] burr.

OVERVIEW

大学の卒業制作で作成したアクセサリーブランドの架空サイト。「年代・性別問わず手に取りやすいプロダクト」をテーマに作られたブランドの持つ、ナチュラルでシンプルな印象を与えられるよう作成。

YEAR 2023

□ 使用ツール:Adobe Illustrator,Photoshop,XD

□ 所要時間:8時間


企画

□ ブランドの特徴

「年代・性別問わず手に取りやすいプロダクト」のテーマのもと、真鍮で作られたアクセサリーのブランドサイト。

誰にでも身近である自然物の中から、一般的に「ひっつき虫」と呼ばれる植物をモチーフとして決定。抽象化し日常使いのしやすいシンプルさを追求。

複雑で捻りのあるコンセプトを整理し、サイトとしてわかりやすく伝える工夫が必要。


○ 制作意図・リサーチ結果などの詳しいブランディングデザインはこちらにまとめております。ご興味ある方はぜひご覧ください。


情報設計 / 印象設計

□ コンセプト:年代・性別を問わず手に取りやすいプロダクト


□ ターゲット

ブランドのコンセプトとしては、老若男女。

サイトとしては、見た人が家族・友人・恋人に紹介やプレゼントしたくなるような印象を与えられるように。


□ 目的

・商品紹介はもちろん、ブランドコンセプトをわかりやすく伝えられるように。

・自然をモチーフとしている優しい雰囲気も一緒に楽しんでもらいたい。


□ 印象

・すっきりとしたシンプルな印象。

・植物の写真や自然の色を使うことで、温かみのあるサイトに。




ロゴデザイン

ブランド名であるburr.[バー]は、「小さな棘を持つものたちでも、 新たなスタンダードとなって欲しい」という願いを込めて、”bur-イガ・トゲを持つもの”と”Bar-標準・基準となるもの”という2つの意味をもちます。そこで言葉の通り棒をイメージした線を使用。斜めに配置することで、棒高跳びのように物事を超えていく様を表現。


制作物

WEBサイト(PC)

※XDのテストサイトへ移動します。


・イメージがつきやすいよう実際の植物の写真を掲載。そこからアニメーションで着用写真へ移り変わるように設定。

・安っぽくならないように色味を抑え、余白を持たせた印象を与えられるよう設計。

ビジュアルの方向性

□ フォント

・本文には、柔らかい雰囲気と落ち着いた雰囲気を兼ね備えた筑紫A丸ゴシックを使用。

・ロゴや見出しの欧文では、スタイリッシュだが可愛らしい印象をもつBilo(ExtraLight)を使用。


□ カラー

・文章全体は#707070に統一。ロゴもこの色合い。

・ハンバーガーメニュー部分には、トップの写真色合いを元に馴染みやすい緑色のカラーを選定。


WEBSITE