Sea-Tac App

Mobile App Redesign

Improve the experience of travelers flying through Sea-Tac airport by redesigning the interface and functionality of the Sea-Tac app.

 
 
Role | Project Manager, Visual Designer, IA Skills | Project Management, IA, UI Design Duration | 2 Weeks Tools | Sketch Teammates | Jennelle Valera - UX Researcher, Tanya Wickham - Interaction Designer

Role | Project Manager, Visual Designer, IA
Skills | Project Management, IA, UI Design
Duration | 2 Weeks
Tools | Sketch
Teammates | Jennelle Valera - UX Researcher, Tanya Wickham - Interaction Designer

 
 

Overview

I worked in a team of three to improve the current Sea-Tac mobile app experience for travelers who fly through the Sea-Tac airport. Sea-Tac mobile app is a tool for the Seattle Tacoma Airport, helping users navigate around and find information about the airport.

Screenshots of Current App

Screenshots of Current App

 

Defining the Problem

To organize our User Researcher Jennelle’s interview notes on the app’s users, we created an affinity map based on interview findings to locate pain points and define the problem of the current app. From the analysis of the app stores, we discovered that most users primarily use the app for the security checkpoint wait times feature, but they were frustrated that the information is not reflected accurately. The affinity map also helps us understand the trends regarding in what context users use the app, as well as pain points when traveling and within the app itself.

Pain Points

  • App feels unreliable

  • Inaccurate wait times

  • Not having the flight number readily available

User Needs

  • Real-time updates

  • Accurate wait times

  • Accessible information

 

Competitive Analysis

As a team, we conducted a competitive analysis on seven other official airport mobile apps to compare the flows and features, which helped inform our redesign as we discovered similar trends in these applications that we can potentially implement.

Screen Shot 2020-02-13 at 12.45.36 PM.png

Key Takeaways

  • More informational content about the airport

  • More visual display of information

  • More accessible and smooth flow to get to information

 

Persona

Based on the trends of pain points and user needs we found in the research phase, we created a persona to generate a narrative around and inform our user flow.

Information derived from Jennelle Valera’s research, layout design by me

 

User Story

Autumn is visiting her family in Texas and she’s flying from Sea-Tac airport tonight after work. She checks the app for flight information and security wait times to ensure that she leaves for the airport on time so that she wouldn’t miss her flight. Once she arrives at the airport, she chooses the checkpoint line with the shortest wait time. After checking in and printing her boarding pass, she scans her boarding pass to receive notifications regarding flight delays and gate changes. Her flight experiences a 1 hr delay and a gate change, and she receives a notification regarding the changes. She arrives at her new gate on time and waits patiently for her flight.

Autumn needs a way to know when she should arrive at the airport and stay updated on her flight status to not miss her flights.

My document (3).jpg
 

Information Architecture

Based on card sort results and analyzing participants’ mental models, I renamed some of the navigation tabs and added in a “My Flight” section to the home screen.

Original Sitemap

Original Sitemap

Card Sorts

Card Sorts

IMG_5192.jpg
New Sitemap

New Sitemap

 

Sketches

I helped our interaction designer Tanya brainstorm and create some sketches to visually layout design ideas. We tried to implement features that were inspired by the competitive analysis and would best address our persona’s needs.

IMG_6139.jpg
 

Design Studio

We participated in a design studio exercise focusing on the ticket details screen, where we brainstormed and sketched out a variety of potential layouts for critique and took the best ideas to formulate a final design as a team.

IMG_3886.jpg
 

Interactive Prototype

The interactive prototype and iterations were made by my teammate Tanya Wickham, while Jennelle and I conducted usability testing. We conducted 3 rounds of testing with a total of 14 participants.

Iteration of Dashboard Screen by Tanya Wickham

Iteration of Ticket Screen by Tanya Wickham

To measure how successful our iterations are in terms of improving user experience of the Sea-Tac app, we employed the System Usability Scale(SUS) as the metric. As a result of our iterative process, our final prototype received a SUS score of 86.3, compared to the original app’s score of 53.3.

 

Styleguide

As the Visual Designer, I created a style guide based on Port of Seattle’s branding.

 

High Fidelity Mockups

I created three higher fidelity screens for the final visual mockups based on the style guide as well as inspirations from competitive analysis.

Credits: Apple Human Interface Guidelines, SF symbols, Sketch icons plugin, free mockup templates, Pexels.com

 
IMG_9972.JPG

Reflection + Key Takeaways

This project was my first time taking on a PM role. I had the opportunity to learn how to set up and organize a development schedule for my team. Since teamwork was the overarching essence of this project, I appreciate my teammates for communicating well with one another. Everyone fulfilled their respective role’s responsibilities by delivering quality work on time to ensure that the team is meeting deadlines and always moving forward. I learned of the importance of being involved in every stage of the process no matter what role you are to offer support and suggestions and ensure that each member is consistently updated about the current work progress. I also learned of the retrospective meeting strategy where each team member shares insights regarding how the team is doing so far as well as set expectations for improvement.

 
Previous
Previous

IT Service Hub

Next
Next

My Girl The Boat Website