Challenge:

• The yoga studio wanted a website that:
  • Reflects its calming, wellness-focused brand.
  • Increases online bookings and new client sign-ups.
  • Provides seamless navigation for users across devices.
  • Showcases schedules, classes, and instructor profiles intuitively.

MY ROLE:

• UX/UI Designer: Conducted user research, created wireframes in Figma, and designed the UI.
• Web Developer: Built the responsive website in Webflow and optimized it for performance.

The Process:

1. Research & Discovery
   1. User Research: Interviewed 5 yoga studio clients and potential users to identify pain points and needs.
      • Key insights:
        • Users wanted an easy way to find class schedules.
        • Many users booked classes via mobile devices.
        • The current website lacked a calming, modern aesthetic.
   2. Competitive Analysis: Analyzed 3 competitor websites for trends in user flow and aesthetics.

2. Wireframing in Figma

1. Created low-fidelity wireframes to map user journeys, focusing on:
   • Easy navigation for schedules and bookings.
   • Highlighting class packages and promotions.
   • A calming, visually appealing homepage layout.
2. Iterated based on feedback from stakeholders and test users.
3. High-Fidelity Design
   1. Designed a modern, minimalist UI with a calming color palette (earth tones, soft greens, and neutrals).
   2. Included:
      • A dynamic homepage with featured classes.
      • A responsive schedule section.
      • An easy-to-use booking interface.
      • Instructor profiles with photos and bios.
4. Development in Webflow
   • Built the website using Webflow for responsiveness and interactivity.
   • Integrated:
     • Booking functionality.
     • Animated transitions for a smooth user experience.
     • SEO-friendly content and structure.

Outcome:

• Increased online bookings by 40% in the first month.
• Achieved 95% mobile responsiveness score during testing.

Key Features:

• Homepage: Full-width hero image with a calming animation and a call-to-action for new client sign-ups.
• Class Schedule: Dynamic schedule page with filtering options by class type and instructor.
• Booking System: Embedded booking system with minimal clicks.
• Instructor Profiles: Showcased unique instructor skills and experience.
• Blog Section: Added for sharing yoga tips and wellness insights.

Reflection