Citi
Citi Partner Experience Services
Scroll ↓
Citibank Credit Card Website & App
Challenge: Reimagining Citibank's credit card website and app to enhance user-friendliness and engagement, focusing on simplifying the Serving Flow for payments, preferences, and billing. Additionally, I'm migrating the Citi Partner Design System from Sketch to Figma to foster collaboration. By leveraging partnerships with retailers like Home Depot, Macy's, Bloomingdale's, Best Buy, and Tractor Supply, we can provide unique benefits that drive customer engagement and satisfaction.
Role: Creative Director of UX & Design System Lead
Collaborative Leadership:
As Creative Director of UX, I led a collaborative effort to revitalize Citibank's credit card experience, focusing on:
User Research: I partnered with researchers to conduct interviews, surveys, and usability tests, identifying pain points and desired features in the acquisition process.
Information Architecture: Collaborating with information architects, we established an intuitive information architecture that optimized the acquisition process for better navigation and task efficiency.
User-Centered Design Team: I guided a talented team of UX designers, establishing design principles centered on mobile-first responsiveness and a clean, intuitive visual style through workshops and discussions.
Content Strategy: Working with content strategists, we ensured all content in the acquisition process was clear, concise, and user-focused.
Design Cohesion: I provided creative direction for high-fidelity mockups, ensuring a consistent visual style across all platforms in collaboration with the design team.
Optimizing the Serving Flow:
Our focus on the Serving Flow aimed to create a seamless post-login experience:
Understanding User Needs: The user research, conducted with the support of user researchers, revealed user pain points regarding payments, billing management, and preference updates.
Streamlining User Journeys: In collaboration with IAs and UX designers, we mapped out clear and efficient user journeys for key Serving Flow tasks. User testing, facilitated by the UX team, further informed these journeys.
Visual Clarity & Information Hierarchy: High-fidelity mockups, created with input from ACDs and content strategists, prioritized user actions and presented information clearly within the Serving Flow.
Outcomes:
User-centered design addressing pain points and promoting intuitive navigation, with a particular focus on streamlining the Serving Flow.
Streamlined user journeys for key Serving Flow tasks like making payments, managing billing, and updating preferences.
Responsive design ensuring optimal user experience across all devices (UX).
Efficient and accessible design system migration from Sketch to Figma (Design System).
Design System Migration:
In addition to leading the UX refresh, I played a pivotal role in migrating the Citi Partner Design System from Sketch to Figma. This involved:
Inventory & Assessment: I led the process of comprehensively inventorying all design system components within Sketch.
Figma File Structure & Component Build: Working with the UX design team, we created a well-organized Figma library structure, ensuring efficient component creation and easy access for all designers, specifically focusing on components relevant to the Serving Flow.
Style Guide & Documentation: I oversaw the transfer and adaptation of the design system's style guide and documentation to Figma's format, maintaining clarity and accessibility for all design teams.
