Eo Jin's creative chaos
Don't worry, it's a fun kind of chaos!
SWEDISH YOGA STUDIO WEBSITE REDESIGN
UI/UX PROJECT
This project involved designing a comprehensive website for a yoga studio, focusing on integrating two studio locations and enhancing the user experience for scheduling and booking classes. Key objectives included:
Customizing pages according to the studio's schedule and branding.
Creating a user-friendly schedule and booking system.
Developing pages for courses, workshops, retreats, and teacher training programs.
Ensuring clear and detailed presentation of prices, memberships, and class offerings.
Maintaining separate sections for different types of classes to optimize SEO and user navigation.
Highlighting the studio's history, philosophy, and unique offerings.
The design process emphasized functionality, ease of use, and alignment with the studio's brand identity, ultimately aiming to attract and retain clients through an intuitive and informative online platform.
To create a user-centered design for the yoga studio website, I developed detailed personas based on user research. These personas included Klara Johansson, a sociable marketing director seeking flexibility and community in her yoga practice, and Erik Andersson, a dedicated yogi looking for advanced classes and English-language options. By identifying their core needs, frustrations, and preferences, I ensured the website's design addressed key issues such as navigation, mobile optimization, and accessibility. This process highlighted my commitment to understanding and empathizing with users to create an effective and engaging online experience.
UX Personas
This is a detailed information architecture for the yoga studio website. It outlines the structured hierarchy of pages, including sections for Home, Schedule, Classes, Price, and About Us. Each section is broken down into specific subsections, ensuring clear navigation and easy access to information. This structured approach highlights the importance of organizing content logically to enhance user experience and accessibility.
Information Architecture
This style scape combines traditionally feminine elements, such as flowers, with male models to create a balanced and inclusive aesthetic. The imagery draws inspiration from themes of India, organic design, and yoga, featuring a soft color palette and natural textures. The focus is on blending elegance and masculinity to create a harmonious visual identity for the yoga studio.
Style Scape
Wireframes
This set of wireframes demonstrates the responsive design approach for the yoga studio website across mobile, tablet, and desktop displays. Each wireframe is meticulously crafted to ensure a seamless user experience on different devices, optimizing content layout and navigation. The mobile wireframe (360-600) focuses on vertical scrolling with simplified navigation for easy access. The tablet wireframe (600-1023) balances visual elements and functionality, while the web wireframe (1024-1280) provides a comprehensive view with detailed sections for landing pages, schedules, classes, pricing, and about us. These wireframes illustrate the adaptive design strategy, ensuring consistent and intuitive user interactions across all platforms.
Web wireframe (1024-1280)
Tablet wireframe (600-1023)
Mobile wireframe (360-600)