DevFest OnAir was the online destination for watching recorded live events from various regions during the global DevFest conference.
As a senior designer on the Gather team, I designed the custom event website, including all graphics, interactions, and animations.
Created and launched in 2018Project overview
This was the first of several projects I undertook for DevFest, a global tech conference hosted by the Google Developer Groups (GDG) community. The Gather team was tasked with creating a custom event site that showcased the three viewing regions and incorporated the visual design system used in promotional and environmental designs for the in-person events. I developed a visual system that seamlessly integrated these branding elements, such as abstract primary-colored geometric shapes and an outlined globe.
To create a distinct experience for each of the three global regions, I assigned each one an accent color, coordinating it with elements such as the countdown and region icons. I designed a unique animated carousel to display event photography in an engaging manner, which was included below the page hero. The rotating geometric shapes added a playful element to the experience, with each shape turning as a new image appears, cleverly evoking the traditional image carousel pattern in a fresh and distinctive manner.
Desktop view of the landing page, showing the page hero, animated image carousel below, agenda, and social sharing module.
Scrolled state, where the countdown transformed into a sticky solid banner at the top of the site. As the user tabbed through each of the three regions, the accent color changed from blue to red, to green.
Interactive survey during the live event
The event showcased an interactive survey, strategically designed to enhance engagement during the live event stream and minimize viewer drop-off rates. This survey would periodically appear during the event's sessions, and participants earned prizes for each point they accrued. The survey embraced an Android theme, celebrating the tenth anniversary of Android.
Design for the desktop view of the page, with the survey making an intermittent appearance in the right panel of the screen.
I designed storyboards for each stage of the experience, annotating the interactive components. Additionally, I created animations in After Effects for each of the transitions and reactions, and exported them as ready-to-use JSON files for developers to implement as SVG animations.
Crafty prize awarded to participants
At the end of the event, users who participated received their “prize”—a customisable Andy-the-android papercraft I designed which they could assemble by printing, cutting, folding, and pasting. The intention was to generate a social media buzz post-event, with users sharing photos of their personally built Andy figures.
Printable Instructions and template, page 1
Printable Instructions and template, page 2
Printable Instructions and template, page 3
My Andy figurine, which I built as a demo to test out the papercraft design came up with. The build takes about 1-2 hours, and requires glue, scissors, patience, and a steady hand. It was a lot of fun to build, and participants reported that they really enjoyed the refreshing opportunity to do something crafty and hands-on.