Mental, physical, & Emotional workout

fit for a goddess

With this app, you get guided visual and video instructions to help you massage specific areas of your body or learn how to massage someone else. Step-by-step guidance makes it easy to use, whether you want quick self-relief or to help a friend or loved one. Explore basic muscle and skeletal anatomy, choose the body part you want to focus on, and follow clear, intuitive directions. You can also save favorite videos for quick access. Guided Massage makes massage techniques safe, easy, and convenient — so you can get relief whenever you need it.

Front-End Design

the scope

Year: Fall 2025
Client: Fit For A Goddess
Project Type: UI Design, Front-End Web Development
Deliverable: Website Desing
Duration: Semester
Softwares: VS Code, Figma, PhotoShop, Illustrator, Cap Cut
Compentencies: Typography, Photography, Videos, Layout, HTML, CSS, JavaScript
Profession: Student

the challenge

This project involved both redesigning an existing website and bringing that design to life through coding in a separate class. The first phase focused on improving the site's layout, user experience, and visual identity. Once the design was finalized, the next challenge was to build the website using HTML, CSS, and other front-end tools—translating design into a fully functional and responsive web experience.

the solution

I began by analyzing the original website to identify areas for improvement in layout, navigation, and visual appeal. After creating style tiles and wireframes, I focused on building a clean, user-friendly interface that aligned with the brand's goals. Once the redesign was complete, I transitioned into the development phase, where I coded the site using HTML, CSS, and basic JavaScript. I ensured the final product was responsive, accessible, and stayed true to the design vision—creating a seamless experience from concept to launch.

Flow Chart

app flow chart

Style Tiles

app brand and Assets app brand and Assets

While it's a new extension of JKC Wellness, it reflects the brand's core identity of clear, supportive care. We wanted the app to feel as warm, approachable, and helpful as the in-person experience clients trust.

LoFi & HiFi wireframes

Home Page — See various videos, get an Assessment, & navigate through the app
Technique Page — A guide to massage methods for various parts of the body
Anatomy Page — Learn about the muscular and skeletal anatomy related to massage techniques
Home Page
Technique Page
Anatomy Page

Both lo-fi and hi-fi wireframes to shape the app's design. Lo-fi helped us sketch ideas and layout quickly, while hi-fi brought the design to life with more detail. This two-stage process reflects JKC Wellness's focus on thoughtful, user-centered design that feels clear and supportive.

Buttons, Images, & Icons

The button design was influenced by certain illustrations and the offset background color used on JKC Wellness's website. The images and 2D model was found on Google.



Images found on Google

images of the muscular and skeletal anatomy

Icons found on Icons8

images of the muscular and skeletal anatomy

Customized Buttons

images of Customized icons

Buttons, images, and icons were designed to be clear, friendly, and easy to understand — supporting smooth interaction while reflecting JKC Wellnesss's warm, approachable style.

instant, easy-to-follow video & visual instructions for self-massage or massage for others