Oliver Bennet, using AI for creative website


Source: Oliver Bennet

Project Overview

The Oliver Bennet Personal Trainer website is a dynamic and motivational platform designed to showcase transformative fitness journeys. With this project, I set out to create an engaging and visually compelling website that not only reflects Oliver’s expertise but also inspires visitors to embark on their own fitness transformations.

To achieve this, I focused on a storytelling-driven layout that highlights real success stories through an interactive ‘Before and After’ showcase. Every design choice was made with the goal of capturing the energy, passion, and dedication that define Oliver’s approach to personal training.

This project also served as an opportunity to refine my approach to interactive user experiences, ensuring a seamless and intuitive flow that keeps visitors engaged while maintaining a professional and motivational tone.

Design Approach

My design approach began with researching high-impact fitness websites to understand what makes them both engaging and user-friendly. Using Adobe XD, I structured an intuitive navigation system that naturally guides visitors through Oliver’s philosophy, services, and success stories.

The website was built using HTML, CSS, and JavaScript, with Sass to streamline styling and ensure consistency in design elements. A particular focus was placed on fluid interactions, using smooth scrolling and transitions to enhance the website’s dynamism.

One of the standout features is the Storytelling Menu, which unfolds Oliver’s fitness philosophy in an engaging and structured manner. To further enhance the experience, vibrant slide-side effects were implemented, adding a sense of movement and excitement to the site’s visuals.

To ensure seamless user engagement, I carefully designed an interactive experience that feels effortless and immersive, allowing visitors to explore the site without distractions.

Key Features:

  • ‘Before and After’ Showcase: A visually compelling narrative highlighting client transformations and success stories.
  • Storytelling Menu: An innovative approach to presenting Oliver’s fitness philosophy and services in an engaging manner.
  • Vibrant Slide Side Effects: Dynamic visual transitions that add movement and energy to the browsing experience.
  • Seamless Interactive Experience: A user-friendly interface that ensures smooth navigation and an intuitive flow.

Technologies Used:

The website was built using HTML, CSS, and JavaScript, incorporating Sass for streamlined styling. Interactive elements and animations were created using vanilla JavaScript, ensuring an engaging yet performance-optimized experience.


Need a designer?

Let's work together!