The Butterfly Trail

The Butterfly Trail is a world-first mixed reality installation at Outernet London, the Now Building in Soho, wrapped floor to ceiling in 23,000 sq ft of LED screens running at 25K native resolution. Visitors use their smartphones to release butterflies into the physical space: catching them mid-air with hand tracking, launching them through the air with a gesture-based slingshot, and watching them appear live on the wraparound display in real time. It ran from launch in 2023 through 2024, and returned for a Christmas special in 2025.

I was brought in through Aircards as lead developer on the WebAR side, working closely with the Pixel Artworks team, including time at their studio and on-site at Outernet during testing. Early on I pushed to move away from the original image-target concept and switch to world tracking. For a venue drawing thousands of weekly visitors, tying the experience to a fixed marker wasn't going to work. World tracking opened it to anyone standing anywhere in the room.

The technical centrepiece is a WebSocket communication bridge I built between the mobile WebAR app and the Unreal Engine scene running on the LED screens. Every butterfly a user releases contributes to a live global counter displayed across the screens, and at the end of each session, depending on how many butterflies were released, a tiered animation plays out across the full display. Device-to-screen communication between a browser-based AR session and an Unreal pipeline at this scale was a first for Outernet.

The project also served as the flagship launch for Metalitix, a real-time spatial analytics system developed by Aircards, used to track how users moved through and engaged with the experience in 3D space, delivering data that directly informed how the experience evolved over time.

Over 420,000 user interactions in its first year alone, inside one of the UK's most visited venues. The Butterfly Trail won a Silver Experiential Award from The Drum, was published as an 8th Wall case study, and was covered by BBC Sounds, The Times, the Evening Standard, and a dozen other outlets. It ran through 2023 and 2024, and came back for a Christmas special in 2025.

WebAR built with 8th Wall, Three.js, A-Frame, and JavaScript. World tracking for environment-anchored AR at scale. Custom WebSocket bridge enabling real-time communication between the mobile AR session and the Unreal Engine scene on the LED screens, driving a live global butterfly counter and tiered end-of-session animations. Dynamic 3D asset instantiation for butterfly spawning with performance budgets tuned for high concurrent usage. Custom hand-tracking system built from scratch using TensorFlow and MediaPipe — 8th Wall had no native solution at launch. Metalitix spatial analytics integrated as its flagship deployment, capturing real-time 3D user movement and engagement data. Cross-device performance optimization across the full range of visitor hardware.

Lead Development: Owned the full WebAR experience end to end, covering 3D scene setup, UI, AR interactions, and all gameplay logic.

Architecture Decision: Identified and advocated for switching from image tracking to world tracking, a change that fundamentally shaped how the experience worked at venue scale.

WebSocket Bridge: Designed and built the real-time communication layer between the WebAR app and the Unreal Engine LED scene, driving a live global butterfly counter and tiered animations triggered by user interactions.

Gameplay Mechanics: Engineered the gesture-based slingshot interaction, butterfly release mechanics, and the dynamic instantiation of 3D butterfly assets.

Hand-Tracking Integration: Built a custom hand-tracking system from scratch using TensorFlow and MediaPipe, allowing butterflies to land on users' palms and fingertips with gesture recognition and smooth animation. No off-the-shelf solution existed in 8th Wall at the time.

Spatial Analytics: Integrated Metalitix as its flagship launch deployment, capturing 3D spatial data on user movement and engagement patterns to inform and tailor the experience.

Performance Optimization: Ran comprehensive performance assessments across devices and iterated on code and assets to hold up under the volume of a major public venue.

BBC Sounds - Virtual butterfly house comes to Tottenham Court Road

Evening Standard - Outernet London launches a brand new immersive butterfly experience

Outernet London - Embark on the Butterfly Trail at Outernet

Secret LDN - A Mixed Reality Butterfly Trail Has Arrived In Central London

London World - London butterfly trail experience

London The Inside - The Butterfly Trail at Outernet

London Cheapo - The Butterfly Trail at Outernet

Yahoo Style UK - London butterfly trail: Video of Outernet's amazing immersive...

AR Rocks - Exploring The Butterfly Trail: A Next-Gen Immersive Experience at...

Mobile Marketing Magazine - Pixel Artworks to launch 'The Butterfly Trail'...

JustLifeLondon - The Butterfly Trail: A Next-Gen Immersive Experience At Outernet London