CHASE MOBILE CHECKOUT
Bringing new life to chase’s P.O.S. mobile solution
This project is as atypical as it is exciting: truly redesigning an entire application from the ground up.
If you’ve paid at coffee shops or restaurants, you probably have used products like Square or Clover. Chase Mobile Checkout (CMC) is just like them —except it’s been abandoned for a while. Since 2011 to be exact.
Given an ADA request to fix a few portions of the app that needed updating, but this gave way to a much bigger set of opportunities. This is what my team & I set out to achieve.
GOALS: MORE than just accessibility updates
Besides addressing the ADA updates, we consulted with various stakeholders about the possibility to redefine the information architecture; clean up and enhance the main flows; and revamp the look and feel in order to make it not only more competitive, but also more in line with other Chase mobile apps.
ACTIONS: everything I would do iN A COLLEGE PROJECT —IN REAL LIFE
This project is unique in the sense that we were given the chance to go back to the drawing board to redefine the experience for this product.
We worked directly with product stakeholders in Chase’s Merchant Services and Small Business divisions, as well as research, content and engineering to overhaul all of CMC.
As a Lead Designer, I was directly involved in the first round of contextual research, interviewing some of the business that currently use CMC.
We then go together as a team, where I co-led empathy mapping and affinity diagram exercises (something I had not done since I publishing the article on "Paper-in-Screen Prototyping” on Interactions Magazine).
Once we defined what the new information architecture was going to be for the new version of CMC, we moved on to prototyping —in a slightly unusual way.
We did a rapid sketch prototyping exercise, in which we drew the user interface elements for some of the main flows with pen & paper and brought in a combination of CMC and non-CMC users for testing.
One of us would act as a computer, switching papers and making “beep” sounds (for added interactivity). Whenever a user found part of the process difficult or s/he expressed confusion, we would stop the scenario. At this point, I would draw another solution based on what I was hearing from the user. If we addressed the issue, we would continue with the scenarios until they were completed.
This technique allowed us to:
get immediate, validated feedback with minimal effort.
complete an initial round of testing, once per week (for 4 weeks).
move faster with designs than I’ve ever moved before (at Chase).
Once the main flows were validated, we were able to move into low-fidelity prototyping (using Sketch to create the greyscale UI and InVision for further mobile testing.
After a few more rounds of testing, we moved on to high-fidelity prototyping. In this case, we were able to leverage some existing Chase design patterns, which in turn allowed for our designs to more closely match the current Chase personal and business banking applications.
However, our efforts didn’t stop there. Because this app is predominantly used on an iPad, we leveraged current Chase design standards to create a brand new style guide for iPad versions of any Chase app. This is something that didn’t exist before, so we were pleased to be able to share this with other design teams internally.
We finished by doing 2 more rounds of testing: one with the ADA team in which we tested our ability to use the app with voice over activated, as well as while wearing glasses that emulate various visual impairments. The final round of testing involved a hallway guerrilla-usability test style exercise in which we asked fellow coworkers to act as cashiers for a business.
RESULT: a fully-tested new version of chase mobile checkout
The new version of CMC is currently in development, due to be released later this year.
The app finally looks and feels like it belongs to the family of other Chase apps. The flows are now simplified and improved. We are certain this app will appeal to more business that already bank with Chase.
In this project we were able to benefit from early communication and feedback from the product team. We were also able to iterate multiple times in one single testing session, which not only led to the current version being developed, but also rendered a healthy list of backlogged features to be added in the near future.
We also learned to take ADA requirements into consideration from the beginning; learned how to create accessibility reading orders; and even created a new iPad style tile for other Chase designers to leverage.