The Interstellar Passport

 

Office of Space Tourism Site and Application Modernization

UX/UI Designer

3 months

Design Tasks

  • Heuristic analysis

  • Research and user interviews

  • Affinity mapping and personas

  • User flows and site map

  • Style guide and visual identity

  • Lo-fi wires and hi-fi comps

  • Usability testing

Project Team

  • 7 Design Fellows

  • 4 Product Management Fellows

  • 8 Engineering Fellows

Design Systems

  • Miro

  • Whimsical

  • Sketch

  • Zeplin

 Overview

 

Background

The Office of Space Tourism was a mock-client for our academic and training purposes. The purpose of the agency was to provide standardization in space tourism through the Interstellar Passport. The Interstellar Passport would function similarly as a US passport - except for international travel, it would be intergalactic travel.

 

The Problem

Users were visiting the site, but they weren’t completing the Interstellar Passport application.

 

The Constraints

  • Mock client and product owner

  • Pivoted to fully virtual midway due to COVID

The Goal

Increase the application rate for the Interstellar Passport application

 

My Impact

  • Sole designer to present final artifacts to Deloitte Digital leadership

  • Co-led user interviews, research synthesis, and usability testing

  • Collaborated daily on a cross-functional team

Group.png

Discovery

Heuristic Evaluation

We conducted a Heuristic Evaluation on the existing Office of Space Tourism site to kick-off discovery and identify usability issues. We used the Nielsen Norman and Susan Weinschenk frameworks to complete our evaluations.

Our Goals:

  1. Measure the site’s alignment with existing usability rules of thumb

  2. Evaluate the site’s design standards and user expectations

  3. Provide key themes and areas of focus

A few issues I identified (via Susan Weinschenk):

  1. Long Page Length - People make mistakes

    • The entirety of the application is one long scroll instead of being split between multiple pages containing relevant questions.

  2. Lack of Page Introduction - Human memory is complicated

    • The form directly dives into asking personal information on the user without providing guidance on what to expect in the application.

  3. Medical History Format - People don’t want to work/think more than they have to and Human memory is complicated

    • The Medical History portion of the application was an overly extensive set of questions. The list of questions spans across both columns, forcing the user into two uncomfortable scenarios: either scroll up the page after finishing the first column to complete the questions in the second column, risking scrolling too far due to the length of the page; or, completing both columns simultaneously.

  4. Create Account - People don’t want to work/think more than they have to

    • Only the password is asked to create an account for the user, there was no indication on what the potential username would be.

 

User Interviews

We interviewed 18 potential users over the course of our Discovery phase - I specifically led the facilitation of 4 interviews. When creating our interview script, we focused on questions related to completing an online application and planning for a large trip.

Some questions we asked:

  1. Tell me about the last time you had to complete an online application.

  2. What is the biggest pain point while completing the application?

  3. What features did you enjoy about the application?

  4. Was there anything that could’ve made the experience more efficient?

  5. What’s your typical planning process like?

 

Affinity Mapping

Using Miro, we synthesized direct quotes, features, pain points, wishes, processes, and other product examples from our interviews and research onto stickies.

Common Themes:

  • Organization and UI

  • Communication and Instructions

  • Simplicity and Usability

interview photo.jpg
 

User Flow

We worked closely with the PM and Engineering to create the Minimum Viable Product (MVP). Using this MVP, we established the potential paths our users can go through and created a Journey Map to build upon. I collaborated with another designer to create the flow shown below.

MVP Site Map Ideal-NEW.png

Product Development

Wireframe Development

  • Started UX Design in low-fidelity wireframes

  • Established OST branding and created a style guide

  • Transitioned wires from low-fidelity to high-fidelity wireframes using established branding

  • Shared wires with client, Product, and Engineering via Zeplin

  • Followed WCAG 2.0 and AA accessibility standards

 

Low Fidelity Wireframes

We started off with lofi wires to see how many screens we’ll need, the logical order of screens, and identify high-level features we deemed necessary from our research.

Branding and Style Guide

We created a cohesive brand and style guide for the Office of Space Tourism - a sleek twist on the American dream. We wanted to portray a modern style to match the future of space travel while staying patriotic to American values.

OST Style Guide.png

High Fidelity Wireframes

We incorporated the established OST branding and style guide to convert the low fidelity wireframes to high fidelity comps, shown below.

Usability Testing

We conducted 6 usability tests with participants ranging in age and technology skill level. All tests were conducted virtually, due to COVID-19.

Testing Details:

  • 45 minute sessions with a moderator and a notetaker

  • Created a clickable prototype to send the participants and asked them to screen share using Zoom

  • Tasks: 1) analyze the home screen and 2) complete the Interstellar Passport application

Home Screen Key Insights:

  • Users tended to first check their eligibility to see if they could move forward with the application; focus tended to be in the center of the screen

  • Users were delighted to see the requirements laid out on the homepage

  • Time-commitment of 1-2 hours was easily understood, but threw multiple users off

Interstellar Application Key Insights:

  • Users responded positively to the site navigation; they found the “Start Application” and “Verify Eligibility” easy to find

  • Several expressed frustrations about the payment process, and felt it aligned to their low expectations of government forms

  • All users felt they could complete the application successfully in one sitting

  • After submitting the application, users felt the end-to-end process was intuitive; navigating back and forth (i.e. save and exit) was easy and straight forward

The Future

Design Backlog

  • More questions would increase user’s trust in the legitimacy of the application (i.e. travel history, medical questionnaire)

  • Expressed need for a custom form to share with his doctor when getting approval

  • Need-to-know based digital notifications (text and email) as their application is processed

  • FAQ page for further information on space tourism

  • Confirmation page needs to provide more details on next steps and the ability to review their submitted application

Lessons Learned

Key Learnings

  1. How to be an effective designer within an agile software development process.

  2. How to work cross-functional with varying working styles

  3. How to navigate a global pandemic and migrating to a permanent work from home lifestyle while maintaining our original development timeline :)