Works

ウェブサイト

2023.03.17制作

Lemonas

スクロール矢印

作品4

作品04デザインカンプ

デザインコンセプト

●商品名:Lemonas(レモナス)
ボディーソープ

●価格:2,500円(税込)300ml
商品で使用されているレモンには疲労回復に効果が高いといわれるクエン酸が豊富なのと香りでも癒されるので、日常の忙しさをお風呂の時間ではゆっくりしてほしいそんな思いから生まれた商品です。天然成分配合で体に優しく、安心して使えることを前面に押し出したいとのご依頼でした。

●商品パッケージ:デザイン制作

●ターゲット:女性20代後半以上をターゲット
仕事にもなれてきてバリバリこなし会社の重圧もかぶってくるあたりの年齢をターゲットとしました。

●設定:天然成分を使用し、体に優しい成分を配合

●会社名:BOTANIZM(ボタニズム)
ボディーソープ、シャンプー、化粧品などを展開

制作時間

●商品とWebデザイン構想「4時間」
●素材の選定や写真加工「8時間」
●デザインカンプ「6時間」
●コーディング「16時間」=合計34時間

レスポンシブ

非対応

使用ソフト・使用言語

Figmaアイコン

Figma

Photoshopアイコン

Photoshop

htmlアイコン

HTML LS

cssアイコン

CSS 3

Sassアイコン

Sass

JQueryアイコン

JQuery

書体

商品のロゴがゴシックのため、全体をNoto Sans JPにしました。商品にある筆記体の英語Minaをアクセントに、商品に入っている斜め文字と一緒に合わせて入れています。コーディングでは商品名はロゴを入れています。

使用色

黄色(レモン)、黄緑色(葉っぱ)の2色を使用。パステルカラー。

写真

加工・合成前の写真

メインビジュアル

メインビジュアル

写真はフリー素材
ですが、商品のパッケージはレモンのイラストも含め全てフォトショップで制作し
背景の写真と合成しました。

商品の写真が入っている写真は全てフォトショップで合成。
商品パッケージのアクセントに、Refrash(Mina書体)を斜めにしてここだけ黄緑にすることでシンプルなパッケージに動きを入れました。

商品パッケージの英文の訳は「この商品はレモンには疲労回復に効果が高いといわれるクエン酸が豊富。日常の忙しさをお風呂の時間で癒されてほしいそんな思いから生まれました。自然の素材を取り入れて体にいいものを取り入れています。お子様も使用できますので、ご家族みなさんで安心して使用できます。」

全体的に色補正をし全体的に統一感のある色味にしています。

こだわり

注目してほしい「プロダクトへのこだわり」をスライドにしユーザーにすべての項目を読んでもらえるような形にしています。メインビジュアルを大きく見せて背景に2色のアニメーションを入れることで引き立つようにしました。商品画像やこだわりの成分表示をスクロールすると動くようにし、すぐに目に入るようにしています。アクセントとして、パッケージにある斜めに配置されている文字をデザインとしてウェブサイトにも取り入れました。アニメーションの速度も遅めにし、全体的にゆったりした動きにしました。

Visit Website