webサイト分析27｜尼崎ボクシングジム

尼崎ボクシングジム｜尼崎・立花・武庫之荘 | 尼崎市で40年間運営しているボクシングジムです。ボクサープラン・フィットネスプラン・法人プランなど、気軽にご利用いただけます。

まとめ

・英語は大文字で、小見出しとのジャンプ率も大きく力強さを感じる。
・一歩を踏み出す、疑問点や不安を払拭できそうなTOPページ。

---

カテゴリー

フィットネス/ジム

概要

尼崎市で40年間運営しているボクシングジム

コンセプト

あなたの一歩が、あなたを支える。

ターゲット

プロボクサーを目指す人
ボクシングをやってみたい人

目的

体験会の申し込み

コンバージョンまでの動線

体験〜入会までのフローがステップごとに記載されている
CONTACTのナビはヘッダーに固定、コンテンツの最後もCONTACTが出てくる

---

メインビジュアル

大文字の英語は左方向に流れるアニメーション。人物の後ろで文字が流れることで、人物に立体感が出ている。
右下のMOVIEボタンは波紋を描くように、一定間隔で輪が広がる。

グローバルナビ

PLAN
FROW
PRICE
ACCESS
BLOG
CONTACT

ハンバーガーメニュー

ABOUT US,FEATURES,PLAN,FLOW,PRICE,ACCESS,CONTACT,
MEMBER,NEWS/EVENT,BLOG
会員向けコンテンツであろう項目は色が薄い

インパクト！
文字の後ろの真ん中部分は若干明るく、文字が強調される。

スクロールの度、文字が白色に。

・FEATURES

特徴が３つ記載。
右に写真、左に文章の構図。
ここは右側が動画になっており、練習の光景が分かる。

設備や歴史に関しては、カルーセルでさまざまな写真を見ることができる。

・PLAN

プランを一覧でタイトルのみ表示。
クリックすると各種プランの詳細が表示される。

・FLOW
このコンテンツの見せ方は結構好き。

入会までの流れ。ステップが大きくナンバリングされている。

写真はスクロールで一番上まで行くと、左側に固定され、右の文字だけスクロールできる。

02が中心を超えたあたりで左の写真も変更！

03も同様に変更。この写真は文字と一緒にスクロールでき、次のコンテンツにうつる。

・PRICE

表形式にわかりやすく表示。

・ACCESS

地図も白黒で、サイトの雰囲気を損なわない。

・MEMBER

人物写真はメインビジュアルと同じく、青っぽい加工。

・NEWS/ EVENT

・BLOG

マウスでドラッグすることで、過去のコンテンツも見ることができる。

・CONTACT

強調したい箇所がすごくわかりやすい。

・フッター

レスポンシブ

991px以下よりコンテンツは縦並びに。

私の好きだったFLOWのあしらいも、純粋な縦並びに・・。（みやすさ優先。仕方ない！）

600pxにもなると、背景の英語は少し動いてるのが見えるぐらい。

フッターにあった各コンテンツ名もなくなり、住所とSNS、コピーライトのみ。

配色

フォント

Anton　英語
Noto Sans JP

白黒トレース

発見と感想

背景はベタ塗りだが、ざらざらしたテクスチャが全体にあることでのっぺりしない。
・フォントのジャンプ率が大きく、ダイナミックさやインパクトを感じる。
・文字は全体的に白だが、小見出しの文字は小さくグレーっぽく、大きなタイトルがさらに強調され、あしらいとしてうまく活用している。