Designing a sleek, user-focused website for a personal trainer, I aimed to create an engaging platform that showcases his services while driving client interaction. This project challenged me to blend functionality with bold design, ensuring a seamless experience that reflects the trainer’s expertise and connects with his audience.
Project Type
Web design, UX/UI
Team
Developer - Andrew G.
My role
Lead designer
Timeline
June 2024 - August 2024
When I first sat down with the owner of Gabra Performance, I immediately knew this wasn’t just about creating a website—it was about translating passion and expertise into a digital experience that would connect with potential clients. Our discussion centered around building a platform that showcases his personal training services, but more importantly, one that reflects his unique approach and engages users right from the start.
Through a research-driven design process, I delivered a solution that blends functionality with an intuitive user experience, creating a platform that drives connection and action.
To kick off the project, I dove into a competitive analysis to see how other fitness professionals were positioning themselves online. What I discovered shaped how I approached the design—many sites were functional, but few truly captured a sense of personal connection. This led me to develop a customer discovery survey, which gave me invaluable insights into what potential clients are looking for: trust, simplicity, and a clear path to their fitness goals.
With these insights in hand, I moved to the critical stage of defining the user. This was the moment I began piecing together patterns in user behavior, focusing on what motivates potential clients to engage with a personal trainer. From there, I built a user empathy map to better understand their pain points, goals, and emotional drivers.
I began sketching concepts and low-fidelity wireframes, experimenting with different layouts and structures to optimize user flow. The goal was simple: make it easy for users to explore Matt’s services and feel motivated to engage. I focused on clear navigation, straightforward CTAs, and a clean visual hierarchy. At this stage, I also developed a moodboard and worked on branding, ensuring that the look and feel aligned with Matt’s energetic, professional persona.
With the foundation set, I moved into UI design, crafting a component library that would keep the interface consistent and intuitive. From there, I created hi-fi wireframes and developed a working prototype that brought all the pieces together, incorporating visuals that highlighted Matt’s personal training approach. (Fun fact: I took all the photos used in this design!)
The final step was usability testing. I ran several rounds with real users to gauge the site’s functionality and flow. The feedback was invaluable—it led to tweaks in the navigation, adjustments to the layout, and the inclusion of additional visual cues to improve user engagement. After refining the design, I delivered the final prototype, confident that it would help Gabra Performance attract and engage new clients.
.png)
This project allowed me to take a comprehensive approach to design, blending user-centered research with bold, functional design. From understanding user needs through empathy mapping to refining the experience with testing, every step was essential in creating a final product that not only meets the business objectives but also connects with users on a personal level. The next step is to seamlessly transition my designs to a developer, ensuring this vision is expertly brought to life.
Looking back, I wish I had incorporated more frequent usability testing earlier in the design process. This would have allowed me to catch small usability issues sooner and refine the experience more iteratively. Additionally, dedicating more time to exploring alternative design concepts might have uncovered even more creative solutions to enhance user engagement.
Through this project, I gained valuable insights into balancing business goals with user-centered design, ensuring both needs are met seamlessly. I learned the importance of iterative testing and refining based on real user feedback, which significantly enhanced the final product’s usability and effectiveness. This experience reinforced how essential it is to stay adaptable and open to new perspectives throughout the design process.
