Register and share your invite link to earn from video plays and referrals.

Levin Stanley
@levinstanley
Lead Product Designer @trello, @atlassian. Previously @Shopify, @VoxMedia, and CoLab. Founder of @eveyevents and Go Beyond Pixels.
Joined December 2010
1.9K Following    1.8K Followers
Educational content is about to get really good. Scroll to travel through 12 landmarks of Rome. Click Explore to orbit each building and zoom into the details. Explore Rome: I directed the design around a few specific things: White as the foundation. White marble and pale stone, with terracotta roofs, aged brick, granite, dark bronze, soft greenery, and turquoise water. I wanted a predominantly white experience that still reflected the buildings’ actual materials. Recognizable architecture. I kept asking for greater accuracy in the façades, columns, entrances, inscriptions, obelisks, fountains, and statues—checking for overlapping elements and details in the wrong places. A proper 3D sculpture. The simplified horse and rider wasn’t enough. We developed a full model in Blender, reviewed it from multiple angles, and repeatedly refined the face, clothing, proportions, and detail before placing it in the Vittoriano scene. The feeling of flying. The camera needed to look toward the next building, travel above roofs rather than through them, and let you stop to explore. A minimal interface. Just a small Explore control and elegant serif landmark names floating above the buildings, appearing as you arrive and fading as you leave. A carefully directed opening. Large, luxurious serif letters spelling ROME. We tried drawing them, but the motion didn’t feel smooth enough. Instead, each letter appears in pearly white, like the buildings, before the whole word darkens together and fades into the scene. Detail that stays visible. I wanted the finer architectural features preserved throughout the journey, including removing a sweeping shadow boundary that was washing them out. Built with React, @threejs, custom shaders, and the Blender sculpture. The architecture, lighting, water, and camera movement render live in your browser. Landmarks load as you approach and release memory as you move on. Built with @OpenAIDevs Astra, shaped through references, screenshots, and a lot of hands-on visual direction.
Show more