CitiBank Case Study

 

Citibank/Sears Credit Card Platform

💳 The Wunderland Group • 2019

Business Initiative

Citibank and Sears sought to modernize their joint credit card platform to strengthen customer retention and ensure compliance with updated accessibility and financial regulations. The digital experience suffered from high user drop-off rates, inconsistent design across desktop and mobile, and several known accessibility violations that threatened both customer satisfaction and corporate compliance.

The business goal was to improve engagement, protect compliance integrity, and streamline the end-to-end credit card management experience. This included simplifying account access, payment workflows, and rewards visibility while improving clarity and trust through consistent design and messaging.

My Role, Team, and Timeline

As Freelance Senior Product Design Lead, I led UX and accessibility improvements over several months, partnering with product managers, engineers, and compliance officers to align user needs with business and legal objectives. The team operated under tight timelines and a regulated design environment, requiring every visual and interactive element to adhere to Citibank’s strict security and brand guidelines.

I managed the end-to-end process—from auditing and strategy through visual design, documentation, and QA. Each iteration involved close collaboration with developers, business analysts, and accessibility experts to ensure compliance with Section 508 and WCAG 2.1 standards.

Design Process

I began by conducting a comprehensive UX audit across key user journeys—account registration, balance review, payment submission, and reward redemption. The audit uncovered several usability barriers: inconsistent navigation labels, unclear visual hierarchy, low-contrast elements, and redundant steps in payment flows. I also mapped content dependencies across Citibank’s shared design assets to identify reusable components.

Using data from analytics and customer feedback, I prioritized issues by business impact and frequency of occurrence. This led to targeted redesigns of the sign-in flow, dashboard, and payment confirmation experiences. My focus was on clarity, efficiency, and reassurance—helping users confirm actions confidently while reducing friction at key points of interaction.

I then developed accessible, responsive design updates within a Figma-based design system, documenting component variations and accessibility specs for engineering. Each interactive element was validated against contrast ratios, keyboard focus, and screen reader compatibility.

Collaboration with compliance stakeholders was crucial. I worked alongside Citibank’s legal and accessibility teams to ensure every proposed change met regulatory approval before implementation. This process helped bridge the gap between user experience, technical feasibility, and legal compliance—producing a design system that balanced all three effectively.

Outcome and Impact

The redesigned Citibank/Sears credit card platform achieved measurable improvements in both usability and compliance:

  • Increased user retention and task completion by 20% across key account flows
  • Resolved major accessibility violations, achieving full WCAG 2.1 AA compliance
  • Improved user trust and satisfaction through clearer hierarchy and predictable interactions
  • Reduced compliance risk through standardized UI patterns and consistent content structure

The project not only improved customer experience but also established a reusable framework for future financial products under Citibank’s digital umbrella. The result was a more accessible, reliable, and compliant platform that reinforced both user trust and brand integrity.