View From Above is an interactive experience created by Emirates in partnership with Boeing. It features an interactive 3G globe users can spin to trigger a full-screen video. The videos show different cities around the world beautifully shot with drones.

The website works across different devices and platforms with a fallback 2D .png sequence solution for browsers that don't support WebGL.
The 3D globe works brilliantly and smoothly on the latest mobile devices.

About the project

The experience starts by asking users to drag the cursor across the screen to spin a 3D globe, mirroring the childhood activity of spinning one with your hands and picking a location depending on where your finger lands. Based on this premise, users watch as the earth rotates and then stops on a random part of the world, such as Ireland or Vietnam.

Art Direction
I worked closely with the Art Director to achieve an elegant and detailed interface and environment. We went through a detailed discovery process to figure out how to best design the site. Our biggest challenge was balancing accuracy with visual style. 

The 3D globe is made up of a number of different visual layers. Clouds move over it and a halo of light adds a luminous look. We also separated the continents and the water into separate layers, so that land looks like it is floating slightly above the rest of the globe, creating depth. A parallax effect can be seen on the stars when users spin the globe.

We wanted to fuse tech with artistic decisions, so we considered questions like: Does the camera rotate around the globe, or does the globe rotate in place? Does the sun appear when rotating, or only at the start of the experience?

Sound
The site’s sound design makes for a more immersive experience. I wanted to achieve something warm but with a touch of innovation, without distracting from the visuals. We worked closely with a sound designer to create warm, tonal sounds and enhance the pleasurable user experience.

User Experience
The site is fluid and intuitive, and users do not have to click much before watching a video. They have the freedom to spin the globe in whatever direction they want, so that they can watch videos for specific places they’d like to travel to.

Tech
The visually rich experience was built in WebGL. The site runs across a large number of browsers. We created a fallback solution for users on older browsers, so that they could still enjoy the experience with PNGs if WebGL was not supported on their device.

Although many assets were involved in the making of the globe, the experience is light and easy to use. The site uses a YouTube API to run Emirates and Boeing’s location videos. We also built a flexibility CMS for the site, which allows the client to add locations to the globe as they please.

Role: Creative Director

Project Link: viewfromabove.emirates.com

Kind: Responsive Website

Technology: WebGL, HTML5

Client: Emirates and Boeing

Production Company: UNIT9

Date: 2015