PROJECT 01 / 実案件 / WEBSITE RENEWAL / WORDPRESS

オダギリジムWebサイトリニューアル

ジムの魅力と、通い始めるための情報を。
既存サイトを見直し、構成から実装まで整えました。

OVERVIEW制作概要

既存サイトの課題を整理し、情報構成・デザイン・導線を見直したリニューアルです。HTML / CSS / JavaScriptで構築した後、WordPressオリジナルテーマとして実装しています。

旧サイトでは、写真の上にキャッチコピーや料金、実績の数字が大きく重なり、最初の画面に多くの情報が集まっていました。伝えたい内容は残しながら、ジムの特徴を知ることと、体験を申し込むことの順序が分かるように整理しました。

既存サイトの情報整理から、ページ構成、デザイン、HTML / CSS / JavaScriptでの実装、WordPressオリジナルテーマ化まで担当しました。画面の見た目とサイト全体の導線を、一続きのものとして考えています。

ファーストビューではコピーと写真の領域を分け、写真に文字が埋もれない配置にしました。青を軸に色を整理し、体験予約のボタンは見つけやすいアクセント色に。見出しや余白の使い方をそろえ、詳しい情報を落ち着いて読める構成を意識しています。

既存サイトの内容をもとに、初めての方が知りたい情報の順序、写真の使い方、各ページへの導線を見直しました。旧サイトとリニューアル後の画面を並べてご覧いただけます。

情報の役割を整理する
ジムを知るための情報と、利用を検討するための情報を整理。初めて訪れた方が、概要をつかんでから詳しい内容へ進める順序を考えました。
写真と説明のバランスを整える
施設の魅力を大きな写真で伝えつつ、料金や利用に関する説明を埋もれさせないよう調整しました。スマートフォンでは、上から順に読み進めやすい配置を意識しています。
静的な実装からWordPressへ
まずHTML / CSS / JavaScriptで画面と動きを組み立て、その後WordPressのオリジナルテーマとして実装しました。

画像を選ぶと、大きな画面でご覧いただけます。

リンク先は、リニューアル後の静的デモです。