Designing and building Metrix, an AI analytics platform from scratch
Metrix is an comprehensive SaaS showcase where I went all-out on typography, custom illustrations, and smooth animations. This project pushed my development skills, with every detail designed to keep visitors engaged
Design approach
The visual direction centers on a dark theme with glowing green accents. Signals "data platform" without looking like every other analytics site you've seen. Suse typeface because it's clean and technical feel that pairs well with data-focused content.
I made every illustration in Illustrator. Wireframe shapes, glowing nodes, grid patterns, abstract data visualisation. Minimalist and technical. They're not just there to fill space, each one supports what that section is trying to say about the product.
Illustrations of Metrix
The layout follows standard SaaS marketing logic: clear value proposition up top, feature cards, testimonials, technical credibility section, call to action. Nothing groundbreaking in the structure. The difference is in how it's executed.
Technical execution
Designed in Figma & Illustrator, built in Webflow. Development took longer than it should have. I had to write custom GSAP for some custom animations. Webflow gets you 70% of the way there, then you're on your own with JavaScript and CSS for anything interesting.
Custom GSAP animation
Custom Scroll into view animation
Thanks for your time! Want to work together? Let's talk
Comprehensive SaaS showcase where I went all-out on typography, custom illustrations, and smooth animations. Every detail designed to keep visitors engaged.