Macrostate - UniFi Door Access Solution Page
Role
:
Web Design, Webflow Development
Timeline
:
2 weeks
Tools
:
Figma, Webflow, GSAP
Project Overview
Macro State needed a dedicated solution page to serve as a key step in their sales funnel—where visitors could explore their UniFi Door Access systems in depth after landing on the homepage. The goal was to combine clarity, visual appeal, and conversion optimization within a single, well-structured Webflow page.


Problem Statement


Goal Statement


Research & Insights


Design Process


Low Fidelity Wireframes


Design System


Final Designs & Prototype


High Fidelity Wireframes


Final Design & Prototype


The Solution
I started by creating a Figma mockup to align the design direction with the client’s brand. Once approved, I built the page in Webflow, incorporating:
- A CMS-based modal system in the UniFi Hardware section for scalable content updates.
- Subtle, smooth animations and hover effects to enhance user experience.
- Interactive content switching for the Access Types section, triggered by hover or click.
- JavaScript enhancements for accessibility, including Escape-key modal close and background click detection.
- Full responsive optimization across desktop, tablet, and mobile.


The Result
The final page delivered a clean, modern design that effectively communicates Macro State’s offerings while driving conversions. It’s fully interactive, accessible, and easy to manage—creating a professional digital experience that elevates the brand and supports their sales goals.


Visual Showcase



Client Feedback
Next Project
Let’s Build Yours
Ready to turn your vision into a living, breathing digital experience?





