Web Design Interactive Prototypes
Explore three interactive UI/UX projects below. Designed in Figma, these prototypes demonstrate my expertise in creating user-friendly, visually engaging, and SEO-optimized digital experiences.
Click through each Figma project to experience how I bring user-centered design to life with intuitive navigation and captivating visuals.
1. Pie Recipe Interactive
I created this Figma prototype as a personal challenge to combine three skill sets: web design, animation, and illustration.
First, each food illustration was hand-drawn in Procreate. After importing them individually into Figma, I created a set of 11 components. Finally, I staged the components to contain both the previous, current, and next slide’s worth of illustrations and set them to Smart Animate upon navigation.
Directions: Click the blue button below to start the recipe, and follow the steps intuitively.
2. Fitness Calculator
This calculator was created for a client in the fitness industry. Because the client’s website has a toggle feature to view their site in dark and light mode, I developed this prototype to adhere to both, ensuring accessibility and readability.
Instructions: Click on each calculator component to see its changes in active state, hover effect, or interaction. Navigate using the arrow keys at the bottom to see the prototype in light mode and the prototypes’ error states.
3. Button Hover Effects
In a world where every website looks the same, I considered in this prototype what it might look like for CTAs to have more personality.
Directions: Hover over each of the 6 buttons below and watch the magic unfold.
See More of my work
