hero.jpg

Citi Document Center

Product Design: Dynamic Audio

 

The Document Center is a space on the Citi browser experience where customers can find relevant communications regarding their accounts (Paperless Settings, Account Statements, Tax Documents, and E-Communications). This is for both paperless and non paperless customers, and as the bank has grown, the browser experience has yet to be caught up. To ensure that our digital experience matches the digital savviness of our customers, we were tasked to redesign the Document Center.

 

The Approach

The Document Center is outdated, doesn't follow ADA compliance or the company's new digital design language. Working with our strategy team, we decided to tackle this task in five phases:

Phase 1
Current State Audit

Phase 2
Competitive Research

Phase 3
Design Exploration and User Testing

Phase 4
Design Solution

 
 
 

 

Phase 1

Current State Audit

The current state audit of The Document Center was crucial to understand today's experience. We looked at UX, UI, and copy elements on every page that falls beneath The Document Center umbrella. We looked for inconsistencies, redundancies, broken links, and more.

docCenter_CurrentStateAudit.jpg
 
 
 

 
 

Phase 2

Competitive Analysis

After understanding our current experience on the browser, we started our analysis of Citi's competitors in the financial space as well as other companies in different verticals. With the analysis, we were able to identify key trends and key features that we wanted to incorporate into our experience. We found that Capital One, Chase, and Wealthfront were clearly the design leaders in this space.

docCenter_CompetitiveAnalysis.jpg
 
 

 
 

Phase 3

Design Exploration and User Testing

Once we gathered our takeaways from the current state audit and competitive analysis, we were able to apply our notes to inform the three concept directions for our redesign. Concept one and two explore the one-stop shop direction as having one main area to be able to view all different types of documents is a preferred customer experience. There is less clicking around and shows users what is available from the outset. With concept three, we explored designing a landing page of sorts that was more visually interesting and informative. We took these three directions and tested the designs with current Citi customers and we got positive feedback for all three. Concept one and two tested the best, as they were the easiest to navigate within. 

 
 
 

 

Phase 4

Design Solution

To meet our business goal of converting all pages to ADA compliant requirements and creating the most seamless user experience, Concept one with the side navigation visible at all times was the chosen direction. The proposed desktop experience is responsive and answers the key feature of the one-stop shop concept. This is only the first leg of the redesign endeavor as we will do continued user testing and enhance The Document Center.

 
docCenter_design.jpg