In 2014, Virgin America launched a new website that combined bold and playful illustrations with a simple and responsive design. Designed and developed by New York team Work & Co, the website featured a streamlined booking process designed to let users focus “on one thing at a time”. UK studio Build created a set of illustrations depicting each of the airline’s destinations and avatars for customers to use when booking flights, adding a touch of humour to a usually tedious process.
The project won several awards – from Webby Awards to a Cannes Lion – and has led to a 10% increase in conversions (people booking a flight after visiting the site). Virgin America has now released a mobile app which features a similarly fast and fun design, along with some exclusive new features.
Virgin America claims the app allows users to book a flight in less than 60 seconds, provided they have already input their card details and address. Customers can easily compare fares by scrolling through a calendar with prices listed under each date and compare cabin classes at the touch of a button.
Each part of the user experience from booking to check-in is personalised: the app will display deals based on each customer’s travel history and remembers seating and cabin class preferences to make booking and check-in quicker.
Twenty-four hours before a flight, the app switches to travel mode, allowing customers to download their boarding pass and receive push notifications about their upcoming flight. They can also stream Spotify playlists curated for that route from within the app: one Chicago playlist features music by former resident Kanye West while another includes songs by bands who’ve played at local festival Lollapalooza. Virgin America travellers can already stream Spotify on planes, but the app allows them to do so before flying – for example, while they’re en route to the airport or waiting at their departure gate.
“The app is really focused on making traveling even easier,” explains Joe Stewart at Work & Co. “It knows what you need to see first and will adjust accordingly. If it’s your day of travel, you see only the most critical information first: check-in, boarding pass, and flight alert information.”
“Most airlines don’t focus on booking functionality in their apps. But we think that this app should be your travel companion from the moment you plan your trip to when you land. So we also focused on making the booking experience lightning fast as well.”
The app is not a remodelled version of the site – rather, Work & Co built a native app for Android and iOS. “It gave us a lot more flexibility and control,” says Stewart. “We can express the brand more precisely and have more fun with it, doing things like shifting to ‘travel mode’ and adding in super smooth animations and transitions.”
Build has created moments of delight throughout with custom animations. Animations feature a similarly playful approach to artwork created for Virgin America’s website and depict each city the airline flies to.
Each one provides a playful take on that city’s best known landmarks or attributes – a Chicago animation references its reputation as The Windy City while one for New York features the Statue of Liberty clutching a slice of pizza. Some also reference famous films from Godzilla and Taxi Driver:
“Our involvement focused around building upon the illustrative world we created for the original VA website,” says Build’s Michael Place. “We expanded on this world bringing it to life for the app. Our main remit was to add humour to the process…. With roughly 48 different animations in total it was an extremely pleasurable experience. Pitching ideas for the various animations was always fun – the combination of our English humour and way of looking at America fitted really well with Virgin’s outlook as a bit of a maverick brand.”
Speaking about the difference between creating artwork for the app and the website, Place says: “With the website we had the luxury of putting in a lot of detail until it told the story we wanted, while the work for the app was much more about keeping the essence of the illustrations balanced with fitting them onto a mobile screen format, considering type placement etc.”
“The biggest challenge was definitely distilling the quite detailed illustrations into a mini story – technically we had only a short animation time to play with and they had to loop seamlessly without being repetitive. They needed to be witty and engaging at the same time, and it was tempting to add a little detail or quirk but it was felt that they could quickly tip over into distracting. In this case, less was definitely more.”
For each destination, Build created a homepage animation, another animation for boarding passes and static artwork for booking and check-in screens.
“For each of these screens and for all the animated and static screens we first adapted to the new screen size then did a simple storyboard for the animation, which was then sent to VA and Work & Co for approval. Some sailed through, some had several rounds of amends- we had a really big conversation for instance, just on how the clouds should move!”
Build also created animations which bookend the booking and boarding process and feature icons created for the Virgin America website – “it was a nice touch to bring these into the app,” says Place.
The result is a fast and easy-to-use app that is packed with colourful artwork and perfectly captures Virgin America’s sense of humour – a humour that runs through everything from its website to in-flight safety demos and adverts.
You can download the app from the App Store and Google Play. For more info see virginamerica.com/mobile