SUKUSUKUBALL　＃１日１サイトレビュー

おかしより、ごはんにちかいおやつ。SUKUSUKU BALL(スクスクボール）おかしより、ごはんに近いおやつ。SUKUSUKU BALL（スクスクボール）

【概要】

「おかしより、ごはんに近いおやつ」がコンセプトのお米と野菜で作った子供向けおやつのECサイト

【ターゲットと目的】

・ターゲットは小さい子供（パフ菓子が食べられる年齢〜幼稚園生？）を持つ比較的生活に余裕のある家庭

・添加物や塩分・糖分を取らずに安心して食べることができることを理解し、購入してもらうことが目的

・商品の特徴である砂糖・塩の不使用でお米と野菜で作った安心で栄養のあるおやつということを伝えたい

【印象】

・パッケージと同じ動物のイラストのあしらいがたくさん使われている可愛らしい印象

・カーニバルのような配色やイラストで楽しい印象もあるが、白がベースカラーで余白が多いため、優しくて安心感のある、かつ洗練された印象

【構成】

・商品の特徴と試食会での生の声を紹介し、安心感を与えてから商品ラインナップと購入コンテンツに導くという順番になっている

・TOPページには、バナー、コンセプト、お米のパワーを説明したコンテンツ、試食会の様子のギャラリー、試食会のみなさまの声、商品ラインナップ、購入コンテンツ、Q＆A、開発について、どうぶつ図鑑が含まれている

・NEWSはメインビジュアルの下部に配置

【メインビジュアル】

・フルスクリーン、白い枠で囲まれている

・背景に試食会の子供の様子の動画が流れている（角丸で優しい印象に）

・中央に大きく「SUKUSUKUBALL」の文字が配置し、動物のイラストのあしらいも配置

・ハンバーガーメニュー、カートアイコン、会員ログインボタン、SNSアイコンが右上に配置

・ハンバーガーメニューをクリックすると横並びに項目が開く（項目はTOPページの内容と同様）

【コンテンツ】

・2〜３カラムレイアウト

・コンテンツを横に2〜3敷き詰める配置が多い

・余白は少し多め

・商品のPOINTや試食会の声のコンテンツカードをマウスオーバーするとカードがひっくり返り、文章が表示される→クリックして別のページやウィンドウが出る手間や時間を省けるし、視覚的に面白い

・動きに注目しやすいため、ひっくり返るコンテンツカードに一番視点が集まりやすい？

・開発についてのカテゴリはサイトの中でも特に真剣なカテゴリとされるため、色やイラストをつけずにメリハリ

・右下に会員登録と購入を促すアイコンが固定で配置

・見出しやコンテンツ内にイラストを設けることで子供の商品らしく、楽しい印象にする

・見出しはアーチ型で統一、カテゴリでそれぞれ異なる動物のイラストがいて、イラストはあまり大きくなく小さめ

・どうぶつ図鑑ではパッケージやサイト内に登場する動物の特性を紹介していて、子供と一緒に読み、勉強できるようになっている

・子供向けの商品のため、漢字が少なく、「お」をつけるなどの丁寧語も多くあり、優しい印象にする

【文字組み】

・-apple-system、サイトタイトルや見出しは画像文字

・中見出しは24、30px、本文は13、14、15px、ナビゲーションは10px

・字間は詰めすぎず、行間は2〜2.4と広めでゆったりとした柔らかい印象に

・ジャンプ率は低めで落ち着いた印象に

【カラー】

・ベースカラーは白（#ffffff）

・メインカラーはパッケージ色に合わせて、オレンジ（#e8652bm）と青緑（#65bbb1）

・アクセントカラーはカートに入れるボタンの黄土色（#ca963a）

・ベースカラーが白のため、余白がより多く感じ、スッキリした印象に

・カーニバル感のある楽しい印象

・柔らかいトーンでまとめている

・派手すぎず、ぼんやりしすぎずな印象

【レスポンシブ】

・ハンバーガーメニューを開くと吹き出し型の小さいウィンドウが表示される

・横並びやグリッドレイアウトで敷き詰められていたコンテンツは縦並びに配置

【サイトを通じてどのように目的を達成するか】

目的：商品の認知と購入

・まず、メインビジュアルで子供が実際に食べている試食会の様子を動画で見せることで自分の子供に食べさせる様子をイメージしやすくなる

・商品の原料などの特徴を説明して、子供に安心して食べさせられることを伝える

・試食会を行い、生の声を聞かせることで信憑性や口コミの評価の高さを伝える

・安心感や信頼感を伝えたことで商品のラインナップを紹介し、購入コンテンツへ誘導する

（・可愛らしいイラストのあしらいや明るい配色で子供向けの商品らしさがあり、楽しくサイトを閲覧できる）

➡︎以上の動線で商品の認知・購入に繋がる