The quirky, fascinating history of the world’s cities beat at the heart of Storytrail, a curated collection of video tours of Los Angeles, New York, Rome and San Francisco—and soon, Lisbon. Created by Coimbra- and Porto, Portugal–based design agency Bürocratik, the site features a straightforward, graphically simple layout that never overloads the user with information and frames hundreds of small video stories per city. The site’s ecosystem is a triangle between an Amazon S3 Bucket—where the videos are stored—the hosting server and the browser’s content player. Bürocratik utilized the WebGL version of Mapbox to keep all the content, including the site’s maps, offline; GeoJSON was used to create Storytrail’s layers and a seamless experience between the changing trail, clicking on stories and connecting to videos. The design agency created the on-boarding animations with bodymovin.js; the on-boarding animations detail the site’s function and purpose to visitors, keeping them from getting overwhelmed by the site’s content.

Bürocratik also developed an app with an offline mode, enabling users to have the full contents of each city while they travel. Lower-quality videos keep the site optimized for mobile, keeping the site’s bandwidth consumption low for travel resctrictions. The site’s design on the desktop version lets users navigate two different ways: on a timeline that extends the site’s identity and on a map that positions users on the geographic relation of the stories—which also shows users how many stories there are per city.