Citi - Treasury & Trade Solutions

Allowing CitiDirect BE’s clients to securely manage global cash and trade needs anytime, anywhere, in real time, with an award-winning mobile banking solution.

My Role: Product Designer and Researcher
Additional Team Members: Scrum Master

Problem

CitiDirect BE, a part of the Treasury and Trade Solutions (TTS) department within CitiGroup, was working with a payment approval flow that had no research behind designs and was last updated in 2003. Useage of the mobile website was negligible, and Citi has heard anecdotally for years that even using the desktop application was cumbersome, confusing, and causing customers to flock to their competitors who had more modern experiences. They were also relying on onboarding new customers to this product through a 65 page PDF. 

Process 

The ask from TTS was initially just for a style guide - they were looking to modernize their UI. Because it would have been impossible to create a style guide with no product components to inform it, we wanted to use the opportunity with Citi to present approaching this in a human-centered way: discover paint points of the current mobile website by interviewing users, journeymap the current experience to identify gaps specifically for payment authorization, and then use Citigroup’s corporate brand guidelines to bring inspiration for TTS’s voice and style when creating the updated experience.

I ran a week long innovation session in Dublin that focused around creating journeymaps, lightweight personas, brand voice guidelines and a moodboard exercise to formulate the beginning of a style guide. I also conducted 13 stakeholder interviews user interviews, helping uncover current pinpoints and understanding the real jobs-to-be-done surrounding payment authorization.

I partnered with our Scrummaster to facilitate, research, and strategize on the final deliverables. I then designed and prototyped the final experience, all delivered in 3 weeks.

Solution

At the core of the problem, users wanted to expedite payments authorization. The needed to only see certain pieces of information for the payment to make an informed decision, and they want to be able to do it in as few taps as possible. The result was a Tinder-like swiping gesture to approve or reject payments. 90% of the time payments are OK to be approved, so the “mindless" gesture worked efficiently to actioning these payments. 

Citi also suffers from “bank speak” in its digital products - using terms like “authorize” instead of approve, and “release” instead of reject. We focused on cleaning up language to make it clear - especially for new users - and reduce the cognitive load that could be placed on users to decode what action they were about to take.

Outcome

The experience created was immediately taken into development and released to the App Store, dramatically increasing their average speed to market from over 2 years to just 6 months with a 4.7 rating on the app. That momentum allowed for multiple more releases and the adoption of some agile best practices to allow for more feature releases in the last year. 

“Once you do a right design of the user interface, there can be a very strong drive of the adoption and commercialization of a mobile solution in the market,” 
- Tomasz Smilowicz, managing director and global head of mobile solutions at Citi Transaction Services, New York.