#03 サイトレビュー　〜えほん×アプリで、親子で考える力を育てる【できるーと】〜

えほん×アプリで、親子で考える力を育てる【できるーと】

サイト名
えほん×アプリで、親子で考える力を育てる【できるーと】

カテゴリー
サービス・アプリ・ツール

概要
【できるーと】のサービスサイト

ターゲット
4〜6歳のお子さんの保護者の方

目的
サービスを知ってもらう、興味を持ってもらう
無料体験や購入をしてもらう

印象
学習ツールのサービスサイトなので、「知的」や「信頼」を感じる（青使用のため）。また、かわいいポップなイラストを使用しているので「子供らしさ」もある。

ファーストビュー
▷ メインビジュアル
　構成としては、左にテキスト、右に円にマスクされた画像。グローバルナビはハンバーガナビに格納している。ファーストビューの下部に購入へのリンクボタンを配置。
　背景にストライプやドットのパターンの円やロボットやお菓子などのイラストが子供っぽさや親しみやすい印象を与えてくれる。
　また、サービスの購入への遷移がしやすいようにモールへのリンクボタンを配置しているのもユーザー目線に立って配慮されている。

▷ グローバルナビ：ハンバーガーメニューに格納
　[お知らせ]
　[『できるーと』とは]
　[『できるーと』の3つの教材]
　[〈かず〉シリーズ一覧・購入]
　[監修者・応援メッセージ]
　[よくあるご質問]
　[つかい方]
　[アプリのダウンロード]

コンテンツ
・ 子供向けの教材のサービスなので、全体的にドリルのような雰囲気。
サービスの特徴や購入までの流れ、よくある質問などのユーザーが求めている情報をトップページにまとめているのが、離脱しにくいように工夫されている。
・ イラストがちょこちょこ動いていてかわいい。
・ 訴求したい部分のテキストが特に強調されて大きくなっているので、メリハリのある見やすいサイトになっている。
・ 購入リンクが3箇所（ファーストビュー、購入の流れのコンテンツ後、フッター前）に配置されている。また、無料体験のアプリへの遷移もしているので「試してみようかな」と思える。
・ リンクボタン
　 ホバーしても変化はなし。

・ フッター

カラー

フォント
▷ 本文：Noto Sans JP　16px

レスポンシブ
・ ヘッダーは上部に配置。左にロゴ、右にハンバーガーメニュー。
・ PC版MVでは、左：テキスト、右：画像だったのに対して、画像→テキストに並び変わっている。
・ PC版とほとんどレイアウトは変化していないが、「お客様の声」のコンテンツの部分やアプリの部分は若干の変化がある。
・ グローバルナビはハンバーガーメニューに格納（画面の右下の固定）されており、以下のように展開する。（PC版には画像があったがSP版ではなくなってグローバルナビのみになっている）

・ フッター
　 [購入はこちら]のボタンはスクロールしても画面下部に固定されている。