2017-2018  ·   Client - American Express GBT   ·   Agency - Versett  ·   Role - Project Lead

A subsiduary of American Express, American Express Global Business Travel (GBT) provides end-to-end corporate travel and meetings program management through a variety of products that service both travelers and travel managers. Available for both iOS and Android, the Amex GBT Mobile app allows users to view, book, and update travel, receive trip updates, and chat with a travel counselor on the go.

On top of UI/UX design for the new mobile app, our engagement included the creation of a user testing framework, an interactive product roadmap, and associated feature designs for corresponding GBT products.

Tools Used: Photoshop, Sketch, InVision, Illustrator, Principle, Zeplin, Asana, Slack, Zoom, Mr. Tappy, RealtimeBoard

Credits: Max Ritt (Design), Omid Fakourfar (UX)

Business Goals

Using analytics software, figure out how users most like to book travel, whether it's via chat, phone, or self-booking.

Get a 4+ star rating in the app store.

User Goals

Travelers want to be able to action on their trips without the help of outside apps—i.e. Booking travel, flight and rail check-in, modifying an existing booking, getting directions, and booking a car from the airport to the hotel. Travel managers want to be able to clearly see who is traveling and who has upcoming travel.

IA & User FLow

This chart shows the entry into the application throguh launch and moves along the main flows, where the darker blocks denote the updated flow to check-in.

Wireframes

After in-depth user testing sessions, we were able to create an application framework that took all the necessary flow sinto account.

Website Travel Hub

User feedback showed that users wanted a more guided experience on the travel hub website so we designed custom dashboard experiences for both travelers and travel arrangers.

We also updated the existing the deisgns to more closely align with the mobile styleguide and shifting branding.

Interactive Product Roadmap

We developed interactive product roadmaps for all of the GBT products for internal and external use. In-house team members, current clients, and prospective clients can reference this to see current and upcoming feature specs for all Amex GBT products. We also created an animated demo for the mobile app for marketing purposes.

Mobile iOS and Android App Design Process

1. Initial week-long kickoff with the entire team (Amex stakeholders and engineering team) where we did design exercises together, discussed business and user pain points, and aligned on goals for the project.
2. Worked in design sprints going feature by feature, doing initial design exploration, conducting weekly design reviews with project and feature stakeholders.
3. User testing kick-off to educate the team about user testing, discuss how we were going to source users, and align on testing process.
4. Met in Paris with our engineering team to finalize our first prototype for user testing.
5. Conducted first round of testing on the mobile iOS app.
6. Iterated on designs and began additional design reviews with the Amex brand team.
7. Conducted second round of testing on the mobile iOS app.
8. Iterated on and finalized iOS designs.
9. Created Android mobile deisgns.
10. Prepped files for engineering handoff, prepped assets for marketing release, and created codumentation for QA.
    

Initial Exploration

User Test 1

Summary

• Usability testing of AMEX GBT Mobile application on 12 participants.
• Testing sessions were video recorded.

Methodology

• Each session consisted on an introduction, tasks and a short post-test interview.
• We instructed the participants to think out loud and share their thoughts with the researcher throughout the test.
• Sessions were performed on an individual basis with each session lasting approximately 45 minutes.
• Sessions were video and audio recorded. Following the sessions, qualitative data were analyzed, grouped together and summarized in this report.

Scenarios and Tasks outline

1. Finding layover information
2. Finding information on past hotel stays
3. Finding flight times and status
4. “Explore the Destination” call to action
5. Flight check-in
6. Finding hotel amenities
7. Sharing a trip
8. Looking for support through the Account page
9. Finding GBT reference number
10. Importing trips

Findings Highlights

• Both the bottom and top (upcoming/past/shared) navigation bars are easy to find and work with.
• There are problems with the action panel. It looks like it does not convey action or just users are not used to interact with them in the context of our tasks.
• Users have a hard time digesting the timeline view compared to the existing patterns in which segments for different trips are separated.
• Users had a hard time understanding the concept of shared trips.
• There are some issues with the copy and colouring of some elements.
  

User Test 2

Summary

• Usability testing of AMEX GBT Mobile application on 8 participants.
• Testing sessions were video recorded.

Methodology

• Each session consisted on an introduction, tasks and a short post-test interview.
• We instructed the participants to think out loud and share their thoughts with the researcher throughout the test.
• Sessions were performed on an individual basis with each session lasting approximately 45 minutes.
• Sessions were video and audio recorded. Following the sessions, qualitative data were analyzed, grouped together and summarized in this report.

Scenarios and Tasks outline

1. Finding layover information
2. Finding flight status
3. Finding information on past hotel stays
4. Finding information on upcoming hotel stays
5. “Explore City” call to action
6. Finding hotel amenities
7. Sharing a trip
8. Finding a coworker’s shared trips
   

Findings Highlights

• Users responded positively to the new timeline view that divides segments by trips. Unlike the first round of testing, no user showed any signs of frustration.
• Users also responded positively to the new “Share Itinerary” CTA for each trip.
• Consistent with results from the first round of testing, users felt confident in using both the bottom and top (upcoming/past/shared) navigation bars.
• The layover information are now clearly visible and users refer to it instead of calculating layover times based on departure and arrival times.
• The major issue observed in this round of testing was that users found it really challenging to look for “Explore City” and the “Trip Options” CTAs. In fact, only 1 user found the Trip Options CTA.

Final Designs