Destinations
Piramid · 2023 · NextJs
Destinations helps cyclists discover routes all over Italy, each one mapped and broken down into detailed milestones, so riders know exactly what to expect before setting off.
We built Destinations in 2023 as one of Piramid's own products, using React and Next.js. My part focused on two key pieces of the experience: the homepage map and the search panel.
The homepage is built around a Mapbox GL map of Italy dotted with pins, one for each route. As you scroll, route cards animated with Framer Motion appear one after another, and the matching pin lights up on the map, so you always see where each route sits in the country. It works the other way too: click a pin and the page scrolls straight to its card, letting people explore either by browsing or by picking a place on the map.

The search panel lets riders narrow down the catalogue by duration, elevation, distance and route type, or simply search by name, combining filters to find the route that fits their legs and their tim