2025
This work-in-progress custom vibe-coded Framer component combines Mapbox GL with scroll-based storytelling to let designers and creators build immersive, map-driven narratives without writing code. It supports fly-to transitions, zoom, pitch and bearing changes, dynamic labels and font styles, sticky overlays, highlight markers, and a configurable start view.
The goal: turn locations into scenes and journeys into stories – fast to set up, flexible to design, and smooth on mobile and desktop. It’s still evolving, being tested, and hasn't been submitted to the Framer marketplace yet, but it’s already a powerful tool for travel, architecture, urban design, data stories, and any project where place matters.
Out of a personal need for code-free customisable geospatial storytelling, I reviewed industry scrollytelling patterns, and translated them into a Framer–Mapbox prototype.
I created a custom reduced monochrome vintage map style that would work with overlays and animations, for all zoom levels and in 3D.
Component: customisable Framer UI
I iterated on interaction design, motion, and mobile behaviour, then consolidated the solution into a reusable component.
Application: spatial storytelling in video content
The component, map styling and FlyThrough have been used for multiple videos for Design Postcards and Core77.
Browse all portfolio projects
© Anki Delfmann 2024
