AMEX Loan Calculator

To design and develop an iPad prototype for American Express Merchant Financing agents that supports their sales meetings and integrates into their existing workflow

Duration: Spring 2014 (~6 weeks)

Client: American Express

Identify the agents' existing workflow and needs

To better understand the context in which this product was going to be used, as well as its user, we conducted preliminary research and interviews where we learned about the complete sales process and the agent's role. This, in addition of a limited scope + tech constrains involved, allowed us to hone in into a solution quickly.

Prioritize core features to define an MVP

We took feature needs surfaced during research, prioritized the ones that would deliver the most impact, and aligned with the AMEX product owner to deliver a well-defined MVP.

Design and develop a fully functional iOS prototype within a 6 week deadline.

By working closely with the team’s iOS Developer, we were able to start working on a fully functioning prototype from week 1. We identified key flows and screens of the app first, and then proceeded to refine and polish via visual design and micro-interactions.

Conducting research and interviews

The main goal of the project was to create a tool that would help AMEX sales agents sell the different types of products that small-business owners (merchants) could apply for during a scheduled sales meeting.

To understand the business process surrounding the meeting, the features the prototype would need, and how it would be used in a real-life scenario, we:

• Interviewed 3 sales agents about their workflow and their sales meetings.
• Learned about the complete field sales process, from merchant qualification to fund disbursement.
• Reviewed extensive documentation on the different types of loans merchants could apply for, their characteristics and the aspects needed to qualify (shown below).

After conducting interviews and becoming familiarized with the agent's workflow before, during and after the sales meeting, we identified 5 product principles:

• Clarity: the focus of the meeting is the conversation between the sales agent and the merchant. Content should be scannable and digestible.
• Flexibility: every sales agent conducts their meetings differently. Offer options to present products in different ways.
• Accuracy: sales agents emphasized the need to have accurate information to establish realistic expectations with the merchants. 
• Effortless sharing: this functionality provides a quick way to record and share meeting notes and loan options discussed.
• Intuitive controls: as meetings can be short, the calculator needs to be simple to use. Stay away excessive transitions, animations and hidden controls.

Prioritizing features and defining core flows

We learned that the features that would have most impact would be the ones that supported the agent's existing "sales techniques" and allowed him/her to focus on the client.

More specifically, the most relevant findings were:

• The need to input information before the meeting
• displaying products and information tailored specifically to that particular client
• the ability to compare products
• the ability to calculate amounts on the fly

We conducted several design studio sessions, which allowed us to openly discuss ideas and quickly find potential solutions.

 During these sessions, we focused on finding:

• A suitable navigation model
• Product comparison views
• Summary and Detail view
• Information hierarchy
• Controls and micro-interactions

Home page

After going over multiple iterations during the sketching sessions, we designed a home page that:

• Heavily reduced the amount of information required from the user (AMEX agents)
• Focused on adding information only, rather than previewing 
• Could be completed by the AMEX agent before the meeting

Summary Page

The summary page gives an overview of the products merchants are eligible for. This page:

• Automatically updates amounts based on user input
• Removes unnecessary input fields and graphs

Detail Pages

The detail page emphasizes the key monetary amounts and allows the AMEX agent to focus on the discussion with his/her client. These pages:

• Keep controls to a minimum.
• Displays descriptive product information

In order to finalize the prototype within the given timeframe, all UI design was done at the same time it was being built. I worked in close collaboration with our developer, solving problems at the moment they came up and delivering assets at the time they were needed.

The prototype was completed, delivered to American Express and used in the field by Merchant Financing agents.

All UI design strictly follows American Express Branding Guidelines, including Merchant Financing brand colors and accessibility requirements.

Deep understanding of a process, and the people behind it, will result in a project with a clear focus and priorities

Although short, the time spent on understanding the complete Merchant Financing process proved to be extremely valuable. The team was able to prioritize needs and identify when a feature was unnecessary or out of scope.

A small and focused team, were design and development work hand in hand from day 1, is key to execute and deliver within a short deadline

Keeping the project team small, as well as including designers that can satisfy multiple roles/skill requirements, allowed us to move towards the right solution fast. Including the team's developer in our sketching sessions, as well as navigational + usability design decisions, proved very valuable. This helped us get our hands in a working prototype much faster, while constantly reviewing our design decisions.

THE TEAM + MY RESPONSIBILITIES

The ustwo team consisted of:

• 1 Project Manager
• 2 Product Designers
• 1 Designer overseeing the project
• 1 iOS Developer

My responsibilities included:

• Research + reviewing process documentation
• Creating interview scripts + conducting the interviews
• Reviewing and applying AMEX brand guidelines
• Creating all visual comps + production assets
• Work closely with the developer for implementation + final delivery