For the Mative website project, I led the end‑to‑end UX strategy and UI design to bring the refreshed brand identity online. Starting with stakeholder interviews and competitive analysis, I mapped out user journeys and built a modular information architecture. In Figma, I crafted low‑fidelity wireframes to validate layout and content flow, then iterated into high‑fidelity prototypes using components, variants, and auto‑layout for a scalable design system. Interactive prototypes—complete with micro‑interactions and overlay states—were tested in moderated usability sessions to surface friction points, refining navigation, call‑to‑action placement, and content hierarchy before development.
On the development side, I translated designs into a fully responsive, production‑ready site deployed on Webflow. Leveraging the CMS for dynamic portfolio and blog sections, I implemented custom CSS Grid layouts and Flexbox for seamless performance across breakpoints. Subtle Lottie animations and scroll‑triggered transitions enrich the user experience, while lazy‑loading images and SVG icon optimization ensure sub‑second load times. I integrated SEO best practices—semantic HTML, meta tags, and structured data—and added Google Analytics and Hotjar for ongoing performance and behavior tracking. The result is a polished, accessible (WCAG 2.1 AA) website that amplifies Mative’s brand story and drives engagement across desktop and mobile.
