フィットネスジムサイト

使用技術

HTML / CSS / JavaScript

詳細内容

デザインカンプをもとにコーディングを行い、ロゴ・配色・画像・テキストなどを調整し、オリジナル要素を加えて制作した架空のフィットネスジムサイトです。 初心者から上級者まで幅広く対応するジムを想定しつつ、特にこれから本格的に身体づくりを始めたい20〜30代をメインターゲットとして設計しました。 ファーストビューでは理想の身体づくりを直感的に伝えるコピーとスライド演出で視線を引き、その後選ばれる理由→入会までの流れ→実績→プランといった構成で、信頼感を高め、行動(体験予約)へとつながる導線を設計しています。 デザイン面では黒を基調にした配色でストイックさと高級感を表現し、余白やテキスト配置によって圧迫感を軽減し、初心者にも受け入れやすい印象を意識しました。 実装はHTML・CSS・JavaScriptを用い、レスポンシブ対応のほか、ファーストビューのスライドアニメーションやスクロール時のフェードイン、ハンバーガーメニューの開閉など、視認性や操作性を考慮したアニメーションを取り入れています。

※リンク先ページは未実装です

目次