© 2019 by Angel Banks

twitter.png
insta.png
linkedin.png
mail2.png

SAY HELLO!

About This Project

Users

Role on Team

This application allows for a bank’s customers to redeem rewards points they receive from spending for cash back, merchandise, travel, and gift cards. This application also has a customer service portal for customer service representatives to assist customers with account issues and an administrative tool for bank managers to setup bank rewards programs and set account permissions.

• Primary audience: Bank Rewards Customers 
• Secondary audience: Customer Service Reps 
• Tertiary audience: Bank managers

As the UX designer for this project, I collaborated with multiple stakeholders including product owners, project managers, and developers to define requirements for, and create an interactive prototype that could be demo’ed for current and prospective clients.

The Problem

My company does not want to build out a new application for every bank client. Instead, they want to build a white-label application they can sell to current and prospective clients with few customizable components to make for easier implementation. 

Goals 

  • Responsive 

  • Web accessible 

  • Easily customizable with reusable components 

  • Find ways to use current code-base for easy implementation so we can begin to sell to current clients and prospective clients

My Process

Instead of designing a new application from scratch, I will use the rewards application I designed for our first client. The old application was based on requirements and decisions made by our client.

Strategy

My first step is to analyze the business requirements document and schedule meetings with internal stakeholders (product, development) to discuss the problems we are trying to solve.

Research

Without access to current users, I gathered data from the first application (from user interviews and surveys) to better understand user’s motivations.

Analysis

User Persona

To help understand who we are building solutions for, I create a persona. This also helps the team gain empathy for the user and their needs. Based on the surveys and data analysis from the first client application, I created an archetype of a real user. I would often refer back to that personal throughout the process as a guide to help make user assumptions.

Heuristic Review 

I performed a heuristic review on the application designed and implemented for the first client to evaluate any user flaws. I reviewed the existing application to determine what works well and what may not work well for the assumed persona.

User Journey 

To better understand how the existing system works, I created a user journey to evaluate what about the current flow creates friction and what needs to change.

Sitemap (existing) 

I like to think of site maps as the road map of your application. It helps to better understand how users will look for information and navigate through the application. I shared the sitemap with the internal stakeholders so they could have a visual representation of the can use the direction the site is heading and ensure all of the functionality from the project requirements document is accounted for.

User Flows (refinements) 

As part of the brainstorming session, I may lead an ideation session with the team, or perform the work myself (if necessary) to improve the user’s journey. It’s important to collaborate with product and engineering in this process because the optimal user experience may have to be adjusted to accommodate engineering constraints or other business objectives. 

On this project, many of the reward redemption transactions would be handled by a new third-party technology vendor (not the one used for the original application). Our application acted as an “outer layer” to the module they were creating. It was important for me create user flows for all of the redemption flows and then confirm the accuracy with the vendor’s product and design teams.

Design

Sketching

I like to start the design process with paper sketches. to quickly iterate through design options and immediate feedback. It’s also a faster way to communicate and validate design changes throughout the design process.

Wireframes 

Next, I created low-fidelity wireframes to help work on a layout and the application’s hierarchy. I don’t get too much into the details of the pages, focusing mostly on 4 major components: 

  1. Navigation 

  2. Page structure 

  3. Content layout 

  4. User flows

Prototype

In my final design, I made sure to address some of our initial problems:

  • ·Responsiveness

  • ·Accessibility

  • ·Customizable components

Testing

Usability testing is a great way to get feedback from real users about the ease and functionality of your application.

                                                                                       

Method:    

  • Remote Tests

 

Tasks: 

  • Ask 5 users to redeem points for a Statement Credit

  • Ask 5 users to review their transactions for the last 60 days

 

Feedback:

  • There wasn’t enough of a visual difference between the homepage and cashback landing page. Users weren’t sure they had successfully navigated to a new page.

  • Users weren’t sure which fields they could edit during the statement credit transactions.

Outcomes

The internal stakeholders were very happy with the final design.

 

My team won a company award for our work on this project. 

 

I am running demos in sales pitches to current and prospective clients. The feedback has been positive and multiple clients have entered the implementation pipeline.

 

There was friction between the best user experience for the customer representative portal and administrative tool and current limitations of the current back-end software design. Additionally, many of the back-end software is owned by multiple teams and created in “silos” so the functionality for similar tasks is quite different. It is going to take quite a bit more time and effort to implement this functionality and may require design changes to make the application work around current engineering constraints.