Client: College
Project Type: UI Design, Front-End Web Development
Compentencies: Typography, Photography, Videos, Layout, HTML, CSS, JavaScript
Software: VS Code, Figma, PhotoShop, Illustrator, Cap Cut
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.
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.
Fit For A Goddess's core colors are hot pink, black, and white. I've introduced light pink and soft gray to reflect the brand's softer, more graceful aesthetic.
I refined the brand palette to evoke a more sophisticated and sultry feel, yet retained the original hues.
Ribbon Design
The inspiration for this wireframe is
simplicity and structure.
While pole fitness (dancing) can be free moving; however, lots of the moves and tricks require precision
and control. For the design, I wanted the ribbon in the background to move subtly, giving a sense of
flow
while maintaining a clean and organized layout.
Pole Design
In this wireframe, the range of classes offered shaped
the
visual
direction. The circular
elements on the right represent lyra (aerial hoop), while the tall rectangle on the left is designed to
resemble a pole. As the user scrolls, a silhouette of a performer executing pole tricks would move along
the
pole, reinforcing the class offerings through interactive visuals.
See the full wireframe & design concept
