Project
縁日ノ遊び箱の商品ページ制作
Client
キッシーズ株式会社
URL
scroll
Overview
概要- 担当
- コーディング、デザイン、素材作成、商品撮影、バナー作成
- ※イラスト素材はキッシーズ株式会社様ご提供のものをWebページ用に加工して使用しております。
- ターゲット
- イベント主催者、仕入れ業者、家庭、教育現場など
- 目的
-
組み立てのワクワク感や遊びの楽しさ、デザインの魅力を通して、
見た人が「これで遊んでみたい!」「イベントに取り入れたい!」
と思えるような体験を想起させ、購入意欲を高めること。 - 情報設計
- 今回は1ページですべて完結させたいとのご要望から、セクション構成を縦型スクロール型にし、
上から順に最新情報、商品の特徴、組み立て方、遊び方といった流れで、視覚的に理解しやすい
ように情報を整理しています。 - ファーストビューでは、商品名がゲームのタイトルのようにこちらに向かって現れるアニメーションを
つけています。また、3人の子供たちが元気よくジャンプして登場するようにして楽しげな雰囲気が
伝わるようにしました。 - ヒーロービジュアルにはパッケージ写真と商品名を大きく配置し、商品特徴が一目で伝わる構成に
いたしました。組み立て手順は番号付きの図入り解説で、パーツの組み合わせ方や遊び方を明確に
提示するようにしています。 - デザイン
-
【カラー&トーン】
明るい配色(赤・黄色・紺色)を基調に、お祭り感やワクワク感を演出。
また、昭和レトロの世界観を再現するため、当時の看板やパッケージ、ポスターに多く使われていた
カラーリングを参考に配色設計を行いました。 -
【イラスト&写真】
レトロな雰囲気を醸し出すイラストやパターンを効果的に配置しています。遊び方のセクションでは
射的、わなげ、たま入れをそれぞれ屋台で表し、実際に遊んでいる姿をイメージしやすいようにしました。 -
【レスポンシブ対応】
スマホ表示にも対応し、コンテンツが縦1列で整理されて読みやすくなるようにしています。また、
スクロール操作で順に情報が得られる設計になっています。特徴や組み立て方に使用している内角丸の
枠はPC版では横長、スマホ版では縦長で表示する必要があったため、画像ではなくコーディングで対応
いたしました。 -
#C30D23#F8B800#F29600#004267
- 制作時間
-
情報設計/WF4日
-
デザイン10日
-
コーディング10日
-
商品撮影4時間
- 使用ツール
- Visual Studio Code / Illustrator / Photoshop / Figma