NOTE: This project was a solicited design challenge for three screens depicting a fictitious native app called the United Transporter. The challenge instructions stated United Airlines had discovered how to teleport people (think Star Trek) and the app would allow people to send themselves to where there friends were, or summon up to four friends. The app had to stay within the brand guidelines of the existing United Airlines app.
Skills used:
- UX Design for mobile
- UI Design for mobile
Walk-thru of my process
I only had 3 hours to go from concept to delivery of the three screens. I decided to start by downloading the United Airlines app to get familiar with it. The new app sounded a lot like Lyft/Uber, so I revisited those apps as well.
After using the three apps, I had a rough idea of an app that leverages the common features of ride sharing apps (i.e. map with pin, toggling between types of rides) while retaining the look and feel of the United app. My assumption was that many of the United Transporter users would be familiar with one of the ride sharing apps and infer that they worked similarly. Users of the United Airlines app would not have to learn new UI patterns.
I then made a quick, rough sketch that I used as a paper prototype to check the workflow and basic functionality (emphasis on quick and rough since time was very limited!)
I then took screenshots of the United app that I would use to clone the brand colors and some UI elements. You can see from the two screenshots on the left I extracted some reusable components and color palette on the right.
Using the sketches and the UI elements, I mocked up the three screens using the screen size of an iPhone 6. (Thinking back on it now: there may need to be some redesign of the ‘to/from’ section for smaller devices, since it is already a bit cramped side to side.)
Once the mockups were complete, I asked my wife to ‘download’ the app and try using it without onboarding or instructions. For having never used the United, Lyft or Uber apps, she managed to use this app successfully. Granted, a one-person usability test is not ideal, but for the sake of this design challenge it helped me see a couple problem areas that I reworked to make the workflow smoother.
Below are the mockups for the three screens.
