爽やかさ重視！「スポーツ業界」のWebサイトデザイン14選！

スポーツへのハードルを下げる”親しみやすい”デザイン事例

アスキスハイポ（株式会社岐阜スイミングスクール）

https://askisshyp.gifuss.com/（制作：株式会社リーピー）

岐阜県岐阜市にあるスイミングスクールのサイトです。初心者向けのスポーツジムで、青色をベースに爽やかかつ、親しみやすく明るい雰囲気のサイトに仕上げました。また強みや目的を明快に打ち出しているため、アピールしたい内容がユーザーに直球で届くサイトになっています。また、複雑になりがちな料金情報などが表でまとまっているので、入会を検討する際にもストレスなく閲覧できます。

制作実績ページ：『株式会社岐阜スイミングスクール｜サービスサイト｜制作実績｜株式会社リーピー』

株式会社サギサカ

https://www.sagisaka.co.jp/（制作：株式会社リーピー）

弊社で制作させていただいた、自転車のパーツを取り扱っている企業のホームページです。商品が引き立つよう、各カテゴリにはサイトのベースカラーとなる緑でグラデーションを施しています。商品などの情報量が多いサイトですが、カテゴリを一覧でまとめており商品選択の導線もスムーズなので、ユーザーに優しい設計となっています。デザイン性だけでなく、実用美も備えた優秀なサイトです。

制作実績ページ：『株式会社サギサカ｜サービスサイト｜制作実績｜株式会社リーピー』

スマイリア

https://smilya.com/

こちらは栃木県にある子どもから大人まで通うことのできるトレーニング教室のホームページです。大きなペルソナは子どもを持つファミリー向けだと一目でわかるデザインですね。カラフルな配色と羊のイメージキャラクターの可愛らしい動きが目を引きます。ページ移動の際の切り替わりのアニメーションもファミリー向けのポップな印象にマッチしています。

ユニークなビジュアルに惹きつけられるデザイン事例

ココサウナ（株式会社JOE）

https://www.cocosauna.jp/（制作：株式会社リーピー）

山梨県甲斐市にある個室サウナ「ココサウナ」のWebサイトを制作させていただきました。鮮やかな色使いが印象的な、力強くインパクトのあるデザインです。徐々に変化するオレンジ色はまるでサウナの熱気や体内をめぐる血液のよう。ロウリュの蒸気をイメージしたアニメーションなど、サウナ好きの心をくすぐるユニークな工夫も満載です。

制作事例ページ：『株式会社JOE｜サービスサイト｜制作実績｜株式会社リーピー』

SOLOFIT24（株式会社CYBODY）

https://solofit24.jp/（制作：株式会社リーピー）

弊社で制作させていただいた、東京都足立区にあるパーソナルジムのホームページです。ロゴのカラーを全体的に取り入れていますが、ベースは3色に絞っているため印象がチグハグにならずに仕上がっています。また動きを多用していますが、ユーザーの邪魔にならない範疇で設計しているため煩わしさはありません。動きを多用したサイトは使いづらく離脱されやすいですが、このサイトでは絶妙にバランスが取れていますね。

制作実績ページ：『株式会社CYBODY｜サービスサイト｜制作実績｜株式会社リーピー』

細部まで見たくなる！「動き」が魅力のデザイン事例

木曽駒 JAPAN ALPS スカイレース（株式会社Nature Scene）

http://www.nature-scene.net/kisokoma/

こちらは大会の特設サイトです。雲と山が層になっており、スクロールすると雲海が広がる演出は、見る人をわくわくさせます。グローバルナビやボタンの装飾が山型になっており、直線にしないことで飽きのこないデザインとなっています。

NEWHATTAN JAPAN

https://newhattan.jp/

帽子ブランドのニューハッタンのホームページです。ファーストビューの動画が目を引くサイトになっています。情報がシンプルなので、サイトのレイアウトもそれに合わせてシンプルにまとまっていて、わかりやすい仕上がりになっています。ユーザーが迷うことなく知りたい情報が手に入るサイトです。

独創性が競合との差別化を決定づけるデザイン事例

DeNAアスレティックスエリート

https://athletics.dena.com/

DeNAランナーズ、館澤亨次選手を紹介するホームページです。シンプルながらも英字を装飾的に使ってスタイリッシュさを感じさせるホームページになっています。各試合結果や各選手についてなど、情報量は多めなのですが、すっきりまとめられていて見やすいです。

U SPORTS

https://usports.ca/en

どシンプルに打ち出された、ファーストビューのタイポグラフィがとてもインパクトがありますね。背景に動画がうっすら流れているのも、おしゃれでGOOD。こちらも情報が多いホームページですが、ひとつひとつの情報がカード型で並んでおり、一覧でぱっと探せるデザインになっています。きつすぎない原色寄りのカラーがちょうどいい塩梅で差し込まれていて、インパクトがありつつも、派手すぎない感じに収まっています。

尼崎ボクシングジム

https://amagasakiboxing.com/

尼崎にあるボクシングジムのホームページです。全部で3ページ構成になっており、シンプルな作りのサイトになっていますが、その分「ボクシング」のイメージをとてもクールで強さのあるデザインに仕上げています。シンプルな構成であり、伝えたい情報がまとまっている上に動きも含めたデザインの完成度が高いです。情報とデザインのバランスが取れているサイトだと言えますね。

北牧 雅文

https://kitamaki.com/

プロダンサーである北牧雅文選手のホームページです。わざとブレた写真を使用し、ダンスの躍動感と独自の世界観を伝えています。カーソルの動きに合わせて青い光がついてくる、という優美な装飾も、世界観の演出に一味買っていますね。選手としての凄さを伝え、この選手からダンスの指導を受けたい！と思うような設計が情緒的にされています。個人の強いブランド力があるからこそ成り立つ、情緒的な世界観が魅力のサイトデザインです。

女性がターゲット！かわいいデザイン事例

GRAVITY RESEARCH

http://www.kojitusanso.jp/bouldering-mama/

こちらはGRAVITY RESEARCH様のボルダリングジムのサイトです。パステルカラーを使ったカラーリングがとても華やかな印象ですね。ボルダリングに通うことのメリットや、実際に通っているママさんたちのインスタグラムのリンクを見せているので、入会後のイメージが湧きやすくなっています。ジムはハードなイメージですが、「これなら私もできそう！」と思わせる工夫がされていて、ターゲットに刺さりやすいサイトになっています。

comme

https://comme.fit/

こちらは東京都渋谷区にある女性向けのパーソナルジムのサイトです。全体的に淡いトーンが特徴的で、ジムのサイトでは珍しいナチュラルな雰囲気に仕上がっています。安らぎを提供するというコンセプトに沿った設計ができていますね。ロゴの揺らめきながら近づく動きもかっこよさがありながら安らぎを感じさせるコンセプトに沿った動きができています。

KARADA CAMP

https://karada-camp.com/

こちらは広島県広島市にある女性向けのパーソナルジムのサイトです。ブルーを基調とした爽やかで若々しい色使いが特徴的で、ジムのサイトならではの健康的な雰囲気に仕上がっています。運動を始めたい初心者や楽しく運動をしたいという人に刺さりやすいデザイン設計ができていますね。トレーナーの方達もサイトに合わせたジムのオフィシャルTシャツを着て爽やかに掲載されています。サイトの世界観に合わせた撮影ができている点もGoodです。ユーザーに安心感を与えることに繋がります。

ペルソナに合わせたデザインで、より魅力的なウェブサイトに

いかがでしたでしょうか？

ユーザーの「ニーズ」や「求める雰囲気」に寄り添うデザインは、顧客獲得にもつながり、Webサイト制作をより魅力的に見せられます。

より当社では、スポーツのホームページ制作経験もございます。
スポーツ関連でホームページの作成やリニューアルを考えている企業様は、ぜひリーピーにご相談ください。

また当社では、売上げ向上を踏まえた戦略的Webサイト制作はもちろん、専属デザイナーによる「視覚的デザイン」を取り入れたホームページのご提案も行っておりますので、

• 競合とホームページから差をつけたい！
• ワンランク上の法人向けサイトを開設したい！
• その業界において「地域No.1」を目指したい！

という企業の方は、ぜひ一度リーピーのWebサイト制作にお任せください！

※ご紹介しているサイトの中で、「（制作 株式会社リーピー）」と書かれたサイトは当社の制作実績です。その他のサイトは当社の制作実績ではございませんが、デザイン性などが優れているため、事例としてご紹介させて頂きました。制作をされた制作会社様で、掲載の取り消しをご希望の場合は速やかに対処させて頂きますので、当社までご連絡くださいませ。