UX Case Study: Mobile banking elevates a local credit union’s competitive edge

A student group’s conceptual design sprint for General Assembly San Francisco.

Miah Ariel Jones
UsabilityGeek
7 min readApr 5, 2020

--

For anyone unfamiliar with General Assembly’s User Experience Design courses, a little background info: the full-time immersive bootcamp is designed to jumpstart students’ career changes into the field of UX. Group projects are a core component of the program, aiming to simulate real world design sprints students will face in future professional roles.

Project three, or P3, consists of a two week design sprint and a mock-project brief from a “client” inspired by a real local business. You can also read about my experience with final project here.

The Project

Client:

Patelco Credit Union

Duration & Type:

  • 2 weeks
  • 3-Person Team

Tools:

  • Sketch, inVision
  • Paper, pen, marker, paper prototyping, whiteboarding

The Problem

While Patelco has plenty of banking options to help their customers with the complexities of modern financial management, most are hard to find, or are simply missing, on their mobile banking app.

With large national competitors and fresh banking start-ups offering intuitive, feature rich money management tools, how can Patelco stay in the game, retaining their loyal (but frustrated) customers while also attracting new ones?

The Solution

By introducing new balance and budgeting features, as well as completely overhauling the information architecture, we were able to eliminate the stress users faced when navigating Patelco’s app in search of particular financial information and replace it with a sense of confidence and security.

My Role

User Research, Data Synthesis, & Rapid Prototyping:

Conducted user interviews, synthesized and distilled research data into actionable findings, created interactive paper and digital prototypes, conducted usability testing.

Visual Design & Storytelling:

Communicated research data by illustrating personas and narrative storyboards, synthesized our divergent ideation, contributed to hi-fi design and illustration, refined the design of the app in response to usability testing, accessibility standards, and UI best practices

The Process

As our timeframe for this project was a very compressed two-week sprint, we scheduled each phase of the design process meticulously. We time-boxed daily deliverables, and assigned tasks so as to keep ourselves on track and accountable to each other.

The Research Phase

User Interviews

From the beginning, we faced challenges where users were reluctant to share openly regarding their personal financial status. In order to overcome this roadblock, we worked with prospective participants individually until they felt comfortable.

We set up dummy accounts for our competitive task analyses, so that participants didn’t need to reveal their personal data, or let them describe tasks to us without showing us their screens. For interviews, we assured them that they could share only as personally as they were comfortable with and that everything they did share would be kept confidential.

Competitive Analysis

We continued our research by conducting a competitive analysis, comparing Patelco’s app to those of some of their most prominent competitors. We learned about available features by organizing task analysis sessions with testing participants across all of the applications, on both iOS and Android platforms.

Stacked up against some of the competition, Patelco’s app is clearly lacking certain features that are becoming standard in the industry:

  • Users are not able to save for a goal, budget, or see their spendings broken down into categories.
  • Infographics to visualize spending habits, and trends over time, are noticeably absent.
  • The navigation and information architecture was confusing, and left users frustrated enough to abandon the assigned tasks.

“Does this tool even exist in the app? Why can’t I find it? This is too frustrating, I don’t have time for this.””

— Task Analysis Participant

Synthesize the Data

Once our depth and breadth of research gave us a firm enough understanding of who Patelco’s users were, and how the competition was attracting them, we synthesized our key findings via affinity mapping.

Organizing feedback from our user interviews this way, we were able to distill seemingly disparate statements into overarching categories of emotional motivations and frustrations.

Example infographics representing our findings

Personas

Using those synthesized data points, we created our personas, whose particular joys, needs, and pain points would guide the design of our product.

“Amari” became our special persona, as she represented a demographic of current loyal customers who who’s frustrations with the current interface would be alleviated by rolling out new features. “Chris” became our secondary persona, as he represented a demographic of potential future customers who would like to bank with Patelco, but also prioritized feature rich, design-forward, convenient app experiences over financial institution affiliation.

“Robin” became our primary persona, as her struggles and aspirations when it came to managing finances best represented the majority of our research findings. Additionally, Robin’s demographic was most at risk for abandoning Patelco in favor of competitors with more money-management features.

Journey Maps

To dig even deeper into understanding the Robin’s goals and frustrations, we created a user journey map and graphed out her archetypal experience when trying to create a budget in the app. This step helped identify critical areas of improvement.

Other Tools

We also crafted storyboards that illustrated Robin’s desired experience. Then, we used comparative user flows to plot out the specific points in the process that needed to be redesigned or implemented to achieve that desired experience.

The Design Phase

Moving into the design phase, we hosted our own “design studio” to rapidly sketch divergent solutions.

In addition to creating a budgeting tool, we wanted to address Robin’s anxiety with making spending decisions on-the-go. Once a budget was in place, could it automatically adjust your available balance in anticipation of upcoming expenses and savings categories? We created a “Free-2-Spend” feature, which would do just that.

User Testing

Refining the best of those ideas, we crafted paper prototypes and dove into usability testing. Feedback from those testing sessions validated some hypotheses and sent us back to the drawing board on others.

We brought refined concepts into the digital realm, re-testing with wireframes and mid-fidelity interactive prototypes.

We tested our mid-fidelity prototypes with 5 participants, with ages ranging from 26–47. They were tasked with setting a budget, and with accessing, interacting with, and interpreting their mock-financial data.

After some final rounds of testing and a few finishing touches, and because time waits for no human, we arrived at the proverbial finish line and presented our work to our peers in the program.

Next Steps

Though our sprint timed out and each team-member moved on to other fun projects, there were next steps we would have loved to explore.

Particularly, some UI elements weren’t yet pixel perfect. Color relationships could be strengthened. Infographics in the budgeting section needed finessing.

But letting go of projects that aren’t destined for development is also part of being a good UX designer. If anyone reading this is thinking about a switch to UX and has questions about my personal journey to find it, feel free to get in touch at miahariel.xyz :)

Want to learn more?

If you’d like to become an expert in UX Design, Design Thinking, UI Design, or another related design topic, then consider to take an online UX course from the Interaction Design Foundation. For example, Design Thinking, Become a UX Designer from Scratch, Conducting Usability Testing or User Research — Methods and Best Practices. Good luck on your learning journey!

Credits: Humaaans by Pablo Stanley, remixed by me. Project collaborators Anna Hoang and Vera Park. All other content by yours truly.

Note: we’re not affiliated with Patelco in any way, and this was a conceptual project completed for the purpose of learning and play.

--

--

Miah Ariel Jones
UsabilityGeek

Miah Ariel is a product/UX designer based in Oakland, CA. She’s passionate about sci-fi, lumpia, & solving for social good. Say hi @ miahariel.xyz.