Dwight Battle's profile

Google Design Exercise | NASA

This is an exploration into time travel via an iOS and Android app, requested by Google as part of a design challenge. The challenge was thus:
 
Demonstrate how you can apply a common visual language for a NASA time travel app, which consists of a UI that identifies where in time you are, where in time you want to go, and an actionable affordance to initiate time travel (don’t worry about flows). Provide a screen for both an iOS phone and an Android tablet that are on brand, while also being considerate of native platform design guidelines.
Explorations and Research
First, I began with some explorations into the interface's look and feel. In addition to sketching various interfaces, I also did some visual styling explorations through Pinterest. I wanted to stay away from the obvious, diai-a-date interface of the classic Delorean and other notable time machines. With the power and flexiblity we have in the palm of our hand, it only made sense to create an interface that could be used with one hand.
 
Besides, by the time travel is attained, the most powerful muscle we'll likely have will be our thumbs, so I explored an interface that could be controlled that way.  
Initial sketch exploration of a traditional dial-a-date interface.
Further sketch explorations into more unique control interfaces.
I wanted to make use of the huge surface area afforded to us in both iOS and Android devices to create a surface where the user could "dial" the time period he or she wanted to travel simply by moving their thumb over the x- and y-axis. Moving up and down the y-axis will take the user through the years, while moving on the x-axis will allow the user to determine the month and day of their arrival. Once they dialed in their time, the user would progress to a final screen where they could see their time destination and then engage on their journey. 
 
Of course, while the dial is the quickest way to dial in a time, the user also has the option to manually enter the date and time in which they'd like to travel.
Rough wireframes
 
Visually, I was inspired by radar screens, and how they give so much information with so little visual detail. Being able to dial in literally any date and time by moving your thumb a few pixels requires the UI to get out of the way. 
 
The confirmation screen functions almost like a boarding pass; it has all of the relevant information about the journey the user is about to take, and allows them to engage on their journey.
iOS Screens - Date Picker and Confirmation Screen
For the Android tablet, the larger surface area allows for even more control in dialing in the time and date of the user's travel.
Nexus 7 Screen - Date Picker
Google Design Exercise | NASA
Published:

Google Design Exercise | NASA

A visual exploration into a time travel app for NASA.

Published:

Creative Fields