Polarwrapped
Creates an animated year-in-travel recap from Polarsteps data, with interactive maps, photo highlights, and downloadable slides.
I built Polarwrapped to turn Polarsteps trips into a visual recap of a year. It fetches account and trip data, then presents distance traveled, countries and cities visited, photos, and GPS traces as animated slides.
A TypeScript SDK handles Polarsteps requests and normalizes the results for the React components. Mapbox draws the recorded routes. The first pass guides users through the slides in sequence; after completing it, they can revisit any slide.
Image export was the main rendering challenge. Interactive slides depend on viewport size, loaded fonts, and map tiles, so capturing the screen directly produced inconsistent results. I built separate export components with fixed dimensions and typography, rendered offscreen for image capture. This keeps the animated presentation and downloadable images suited to their different uses.