Luna Flow
Mini Brand & Landing Page for Holistic Studio
A design created to create a calm, feminine and premium look for a yoga studio.
Mini data:
• Role: UX/UI Designer
• Time: 7-14 days
• Type: Concept / Fictional Client
• Tools: Figma, AI, Webflow (optional)
Luna Flow is a newly opened boutique yoga studio that focuses on mindful movement, emotional well-being, and creating a calm, welcoming atmosphere for students of all levels. As a young brand entering the wellness market, Luna Flow needs aprofessional and trustworthy digital presencethat clearly communicates its philosophy, instructors, and class offering.Since the studio did not previously have a website, most communication and bookings happened through social media and direct messages.
This created several challenges:
• New clients struggled to find complete information about classes, pricing, and instructors.
• Booking a class required manual confirmation, which was time-consuming for both clients and the studio.
• The studio didn’t have a centralized place to showcase its identity, values, or schedule.
• Potential clients lacked the confidence to join, especially beginners who needed clear guidance.
To support the studio’s growth and help build a strong community, Luna Flow required anew website designed from scratch—one that would be simple, calming, and aligned with the studio’s holistic approach.
The website needed to deliver:
• clear and accessible information for new students,
• an intuitive booking experience,
• mobile-first usability,
• a visual identity that reflects the studio’s atmosphere.
Problem
Problem
Small yoga studios often do not have a coherent visual identification and a website that reflects the atmosphere of the place - this makes it more difficult to build trust and encourage registration.
Goal
• creating feminine, calm branding
• designing a transparent landing page
• emphasizing the values: peace, flow, harmony
• building a clear, simple path to entries
Why it is important?
support a small local business
User persona
The Beginner
I want to start yoga, I feel a bit unsure, I need clear descriptions and recommendations.
The Busy Professional
She exercises regularly and expects quick availability checks and express bookings.
The Wellness Enthusiast
She attends various classes, buys passes, and needs payment and registration integration.
Research
The research goal was to understand:
- how users currently search for and book yoga classes?
- what concerns and frustrations they have during the process?
- what they find lacking in the studio's communication and offerings?
- how the decision to start or attend classes regularly can be made easier.
+ ATF looks great, short and to the point
+ CTA at the beginning
- red is too aggressive
- too long text, hard to read, where is heading?
+ Magnetic cap- information that there are a small number of free places left
- too long text, hard to read
Jobs to be done
When I browse potential coworkers
Situation
I want toset clear expectations (timeline, roles, responsibilities)
Motivation
so I canavoid misunderstandings and keep the project consisten
Expected outcome
When I browse potential coworkers
Situation
I want toset clear expectations (timeline, roles, responsibilities)
Motivation
so I canavoid misunderstandings and keep the project consisten
Expected outcome
When I browse potential coworkers
Situation
I want toset clear expectations (timeline, roles, responsibilities)
Motivation
so I canavoid misunderstandings and keep the project consisten
Expected outcome
Design assumptions
User Goals:
- Fast and intuitive booking process
- Clear communication of levels
- Transparent schedule
- Beautiful photos + studio vibe
Business Goals:
- Increase online bookings
- Reduce phone inquiries
- Professional, consistent branding
Add problem an solution
Add social proof.
Branding
Wireframes
The Z-Pattern for Reading
The F-Pattern for Reading
The BIAS model is:
Benefit
Insight
Action
Support
Mobile Usability
Why did I do that?
Mobile-first UX → 80% of users sign up from their phone.
More space means better readability.
Alternating horizontal and vertical layout makes the page easier to view.
It is important to give the opportunity to sign up for classes at the beginning
Based on user needs, I simplified the path so that the CTA is always visible in key sections.
Conclusions
I find it difficult to transfer the website to the mobile version, how to change components, text size, breaks. I'm not sure if the logo is too closely associated with water. through this project, I learned how to design websites for desktops better.Landing page should be written like a letter, it is difficult for me to do this and avoid a long text at the same time.
It was my first version, I decided to change it because:
Headline and subheadline are not enough clear. What it is? For whom?
This colors are not modern.
A lot of empty space.
This photo is not convincing. Woman with phone?
Headline is more clear, but maybe more to the point ‘Do it for your heath’
Add Problem and solution
Better photo, happy women in yoga studio, I want to be like them
Add social proof
