Framer Website Design & Dev for UNFLTR

Martin Cris came to me needing a website that matched the energy of the UNFLTR brand: bold, expressive, and impossible to ignore. The challenge was building something that felt immersive and cinematic while still being functional, responsive, and easy to navigate. Two pages, zero code, built entirely in Framer.

Timeline: 17 days (May 5 – May 22, 2026)

UNFLTR WEBSITE

UNFLTR is a bold, expressive digital experience built on Framer — designed to communicate brand personality with clarity, edge, and motion. A two-page website crafted to feel immersive, intentional, and visually unforgettable.

A fully responsive two-page website designed to showcase the UNFLTR brand in a way that feels dynamic, modern, and unapologetically distinct.

Built with engaging motion, immersive transitions, and interactive storytelling that make the browsing experience feel alive while still maintaining clarity and ease of navigation.

The site balances strong visual expression with usability — making sure visitors not only enjoy the experience but understand the message and take action.

For the homepage, the goal was to create a strong first impression through immersive visuals, bold typography, and smooth transitions that instantly communicate the brand's personality.

Custom interactions and motion effects were introduced to make the experience feel fluid and intentional, ensuring every scroll and transition felt connected to the storytelling.

One of the standout parts of the UNFLTR website was the custom-built timeline experience — designed not just to display content chronologically, but to create a visual storytelling moment that feels immersive and editorial.

Instead of a traditional static timeline, I built an interactive layout that combines structured content with a vertical film strip of three stacked images, creating a more dynamic and cinematic browsing experience. As users move down the timeline, the imagery flows alongside the content, reinforcing each story point visually rather than relying on text alone.

This required careful layout planning in Framer to ensure the timeline structure, sticky visual rhythm, and image progression worked seamlessly across screen sizes without breaking the storytelling flow.

A huge credit goes to the client as well — they had a strong creative vision and were open to pushing beyond conventional web layouts. That level of trust and collaboration made it possible to build something that feels expressive, unique, and truly aligned with the brand rather than settling for a standard timeline section.

Editorial storytelling — the timeline feels more like an experience than a content block, guiding users through information in a visually engaging way.

Custom image film strip — a stack of three images moving vertically like a film reel adds depth, rhythm, and visual continuity to the section.

Built with motion and structure — animations and transitions were used to make the progression feel smooth, connected, and intentional.

Strong client collaboration — the client's clear vision and willingness to explore bold ideas played a huge role in shaping a section that feels distinctive and memorable.

Responsive execution — despite the complexity of combining timeline content with stacked imagery, the layout was optimized to maintain the same impact across devices.

The second page was designed to expand on the experience while keeping the same visual rhythm and interaction quality.

Layout hierarchy, motion, and content structure were carefully crafted to make navigation intuitive while maintaining the expressive design language established on the homepage.

The call-to-action and footer sections were designed to end the experience with clarity and purpose — reinforcing the brand while guiding users toward the next action in a simple, visually polished way.

Custom Components

Two-Page Website

Fully Responsive

Animations & Interactivity

Smooth Page Transitions

Made in Framer with Zero Code