thumbnail.png

American Express - TechCare Mobile

How I delivered an online check-in feature on the American Express employee mobile app that reduces queue time from 45min to 15min.

Introduction

Timeline & Status

3 weeks & shipped as of 2020

My Role

Research, UX design, UI design, Cross-team collaboration.

Tools

Sketch, inhouse Survey tools

TechCare Mobile is an iOS app that delivers selective IT Support features, from its Web Portal counterpart at American Express. A new “Advance Check-In” feature was being developed to help employees schedule visits to an onsite support office.

I revamped the TechCare Mobile App with a new visual design & adapted and redesigned the Advance Check-In feature from web to mobile.

Project Impact

The new app increased flexibility in each employee’s work schedule, while decreasing overall production downtime company wide.

TechCareMobile.jpg

Redesign Scene

Design Process

Defining User Flow From Web to Mobile

To deliver a consistent user experience across platforms, I first highlighted the flow of interactions between the user and the app. Currently, user clicks on the Tech Concierge tab, and can then check in to a queue on the website.

Sketching

User Flow Diagram

Visual Design Iterations

I redesigned and compared two different color schemes to show that the light version visually highlighted the featured buttons on the homescreen. I also removed the banner image on the homescreen to further remove distractions.

Features

Action Confirmation and Queue Reminder

To help validate the user’s action, I added an action confirmation as well as a queue status reminder post check-in. Tapping on the reminder will direct them to the Tech Concierge page to view more information.  

Update Notification and Bug Reporting

I added an in-app notification to notify users of update. I also added a feature to send system error logs in a visually non-distracting way per request of the product owner.

 

Usability Testing

Trade Off: Discoverability vs Platform Consistency

Up until this point, The check-in button was on the homescreen. This way, the user can directly check in from the home screen. However, I experimented with a version that was consistent with the user flow on the web portal: allowing user to check in to the waitlist under the Tech Concierge tab.

A/B Testing

To decide whether preserving the information hierarchy will reduce potential discoverability on mobile, I decided to gather a small group of users to conduct a quick hypothesis testing. Group A (19 participants) was presented with Version A , Group B (18 participants) was presented with Version B.

Interpreting Data

PieChart.gif

In group A, 18/19 users successfully checked themselves in. The success rate was 95%. In group B, 16/18 users successfully checked themselves in. The success rate was 89%. Statistically speaking, Test A converted 7% better than Test B. This difference was not statistically significant.



So the proposed hypothesis failed, but this is positive news for my new design. Since version B did NOT reduce potential discoverability of this feature, AND conformed to the user flow on the web, it was therefore better.

 

Final Deliverable

Revised Workflow

Untitled-1.gif

Hand-Off & Acknowledgements

After positive reviews from Product, Design, and Engineering leads supervising this project , I handed off my final deliverable to the engineers on my team. Since the current API did not have the leave queue API Call as of the end of this redesign cycle. The Leave Queue function will be included in the next development cycle.

I received amazing mentorship and guidance from Senior UX Designer Carolyn Siegfried and the TechCare Product Owner Valerie Mancino, both of whom I worked with on the previous redesign project for TechCare Web.