MOBILE APP & WEBSITE DESIGN
Foster total well-being through fitness and community engagement
UX Design
UI Design
Branding
Timeline
Feb 18th - 26th 2024
Role
UX/UI designer
Sector
Fitness
Overview
Project Summary
I created a fitness gym website and mobile app.
a modern gym, developed to serve high-end clients
integrated gym - a gym, spa, pool, mini-bar and restaurants, personal trainer, and extreme sports such as climbing, and fighting, among other exclusive benefits.
Target Audience
Age: late30s-60s
Status: single, married, have no kids, have independent kids
Lifestyle: have time and money
Health conscious: very conscious about wellness
Dietary preference: prefer organic food
Fitness: Interest in fitness, seeking companionship for exercise
Solution
1
Build an intimate online community platform
2
Promote sustainable and wellness beauty line
3
Enhance digital learning experience
Design Process
Moodboard
Color Pallet
Typography
Content
& Sitemap
Wireframe
High-fi mock-up
Client Feedback
&Modification
BRANDING
DEFINE
IDEATE
PROTOTYPE
TEST
Branding
Moodboard
The mood board exudes a cozy, earthy vibe with warm tones and soft textures, inspired by the comfort of sunlight.
Color Pallet
primary color - off white and mos green
secondary color - light brown and light green
Typography
The typography maintains a balance between sophistication and readability, providing an aesthetically appealing yet easy-to-read experience.
Branding - Name - “UnityWellness”
The brand name emphasizes the concept of unity and wellness, highlighting the idea of individuals working together towards common goals in a wellness-focused environment.
Branding - Logo
Our brand logo embodies three key meanings:
It symbolizes our trainers' support on your wellness journey.
It represents our gym's guidance and direction.
It signifies your role in leading and inspiring others on their paths to wellness.
RESEARCH
Card Sorting Test
To Organize content to enhance navigation and usability, I conducted a card sorting test.
User Flow
I created user flop map to design intuitive pathways for seamless user experiences
Design
After defining the problems and solutions, we move on to the design phase.
Wireframe
I created a wireframe for the homepage to capture the essence of what the gym offers for the users.
Focusing on delivering a holistic well-being experience
Delivering expert-guided fitness excellence
Promoting wellness and relaxation alongside exercise
Fostering member connections through events and co-working
Style Guide
High-fi mock-up and Prototype
