見出し画像

梅花新体操スクールトップページ#1日1サイトレビュー

【サイトの種類】
・ブランディングサイト

【業種】
・新体操スクール

【概要】
「美しい心と美しい身体をつくる」をコンセプトに設立された、梅花中学校・高校が運営する新体操部のWebページ。基礎を学べるクラスから、選手としてレベルアップできるコースまであり経験豊富なコーチの元、レベルに応じた技能を習得できる。

【目的】
(メイン)これから新体操をやってみたい利用者に対して、教室と新体操の魅力を伝え、入校をうながす。
(サブ)サイトを名刺代わりにし、新体操部をキャラクターづけする。新体操スクールといったら一番最初に思い出してもらえる状態をつくる。

【提供できる価値】
・(希少性・権威性)梅花高校はチアリーディングや新体操がとても有名な学校で名前に定評があり、信頼性が高い。
・(希少性)大会入賞経験あるコーチによる指導。
・(希少性)練習環境の設備が整っている。

【ターゲットユーザー】
(悩み)娘が少し大きくなってきたので、習い事をさせたいなと考えていた。上品で所作がきれいな女性に育って欲しいのでクラシックバレエを習わせたいなと思っていたのだが、子供が近所のポスターをみつけてきたことで変わった。梅花高校の新体操スクールらしい。娘は昔から変身願望があって、プリキュアなどのアニメに憧れを抱いているタイプだ。習ってみたいと言うので、とりあえずホームページをチェックしてみることにした。確かにキラキラした印象で衣裳もキレイだし、大会入賞経験がある先生が居るみたいだ。クラシックバレエレッスンも受ける事ができる。OGの方も多いようで、かなりしっかりした所な気がした。近くに住んでいる事がラッキーだし、子供が一生の趣味をみつける機会かもしれない。習っても良いかもしれない。

(趣味)買い物 琴
(性別)女性 
(年齢)30代

【文字】
Noto Sans jp
見出しの明朝体は画像だった。(文字のレイアウト崩れを防ぐため?)

画像1

↑ピンクの見出し部分が画像だった。

見出しは明朝+本文は読みやすいゴシックという組み合わせ。
自分がやると変になりそうで挑戦した事がなかったけれど、女性らしい印象によく合うんだなあ。やってみようと思った。

【ボタン】
・ホバーすると矢印が右へ移動する。

画像2

画像3

【グローバルナビ】

・シンプルなナビでロゴマークの部分のみに白背景がついている。
ホバーすると、文字が弾むような動きついている。(ピアノなどの音楽教室のページにも使えそうな動き)
・見学・体験申込ボタンが右についている。(暖色系の背景に暖色で入っている。)

画像4

【キャッチコピー】
なし


【ページ全体の構成】
《1》MV・見学申込ボタン・エレガンスCUP告知
《2》活動報告
《3》各コースの案内(特典:バレエ習える)
《4》梅花中学校・高校新体操部の紹介
《5》ニュース欄
《6》利点の説明(コンセプト・設備・指導者・ユニフォーム)
《7》問合せ 見学申込
ボタン
《8》フッター

FireShot-Capture-1286---梅花新体操スクール-Baika-RG---梅花新体操クラブ-Baika-RG-&-梅花中学校・高等学校新体操部

【気になった所】
・背景のピンクの部分にホバーすると左右にずれるような動きがついている。
・変身物のアニメを彷彿とするような色使いだなと思った。キラキラ女子って感じ。
・前に体操教室のページを観察した時があったけれど、その時も競技を行う人の切り抜き画像がボタンや画像の端に配置されていて、動きが出ている。

画像7


・ファーストビューではタイトル部分にリボンがタイトルに配されていて、文字も払いの部分が強調されていて、新体操のページであることが理解しやすい。
・練習生の写真画像が背景に散っていて、すこしづつ動くようになっている。
・見学申込ボタン、最新ニュースを1項目だけ出している。

画像6


・見出しタイトルもスクリプト体を使っていて、新体操のリボンみたいな印象を出している。
・ボックスの形状が上手いな~と思った。角をへこませる最低限の装飾で女の子っぽい感じ?なんか返信できそうな感じを出していてすごい。自分も真似したい。
・写真画像の緑味を割と強調していて、鮮やかにみえるように工夫されている。すごいな~。

画像8

画像9

・活動報告をページの上にもってくることで、活発に活動を行う教室である事、生徒の様子がわかるようになっている。

画像10

・この部分のデザイン上手いな~服の色が青で中央に配されていてボタンまでがとても見やすい。
・グラデーションの背景の上に色の濃いグラデーションボックスを置いて白文字って、使えるな。と思った。ボックスの周囲に写真画像が散りばめられているのも良いと思った(ボックスがある事で、写真で視線が散ってしまうのを防いでいると思う)
・ボックスの中の上下デッドスペースにキラキラを入れてる。

画像11

無題

・テキストボックスにグラデを入れて、白文字

画像13

・各コースの紹介欄、一番上の部分に「バレエレッスンもできる:特典」を掲載している。

画像14


お疲れ様でした~><
Webサイトは工夫のかたまりですね。

この記事が気に入ったらサポートをしてみませんか?