Region: USA
Year: 2024–2025
The project itself
30% + 15%
Achieved 30% higher accessibility compliance and 15% greater user engagement post-launch.
Team/Tools
Figma, Confluence, Jira, Microsoft Teams
My role
Senior UX/UI Design Consultant
Responsibilities
Led user research and accessibility audits · Created wireframes, interaction flows, and prototypes · Advocated for accessibility within the design system
All about the Problem
The existing digital banking platform was failing members who relied on assistive technologies. The issues weren’t edge cases — they were daily obstacles.
Non-compliant with WCAG 2.1
Critical user flows didn’t meet AA standards, putting Golden1 at compliance risk and excluding members with disabilities.
Poor screen reader support
Missing alt text, broken focus order, and inaccessible labels left screen reader users unable to complete core banking tasks independently.
Inconsistent UI across platforms
Different components and interaction patterns on web vs. mobile created confusion and increased customer support load.
Insufficient color contrast
Brand yellow against white backgrounds failed AA contrast for text and interactive elements, affecting members with low vision.
10
Digital Banking Members
Including members using screen readers, keyboard navigation, and other assistive technologies
5
Product & QA Team Members
Internal stakeholders responsible for accessibility testing and bug prioritization
3
Customer Support Representatives
Front-line staff fielding accessibility-related issues from members
Sarah M. · Screen Reader User, Golden1 Member
Before I redesigned anything, I mapped what it actually felt like to bank with Golden1 as an assistive-technology user. The map traced four stages — Login, Account Review, Transfer, Logout — and surfaced emotional lows at every authentication touchpoint. Each stage was scored across screen reader compatibility, keyboard navigation, and member confidence. Authentication and transfer flows scored lowest — these became the design priorities.
Login
Low confidence
Account Review
Improving
Transfer
Lowest score
Logout
Clear finish
The project schematically
I worked from the broadest structural decisions down to the smallest interaction details, making sure every layer was accessible before adding the next.
Usability Studies
This is an examination of users and their needs, which adds realistic context to the design process. Multiple rounds of UAT and accessibility walkthroughs with real assistive-tech users revealed issues automated audits missed — spacing problems for screen magnifier users, ambiguous focus order in the transfer flow, and contrast issues on disabled button states.
Focus Order
Tab order skipped key actions in the transfer flow. Fixed by restructuring the DOM and adding explicit focus management.
Contrast on Disabled States
Disabled buttons fell below 3:1 contrast and became invisible to low-vision users. Adjusted token to meet AA standards.
Touch Target Sizing
Mobile action buttons were below 44×44px minimum, causing missed taps. Scaled to 48px and added 8px padding.
Every project has a moment where two right answers compete. For Golden1, it was color.
The Tension: Golden1’s brand yellow is instantly recognizable from physical branches and marketing, but at standard application, it fails WCAG 2.1 AA contrast against white backgrounds. Preserving brand recognition meant compromising accessibility for over a million members. Compromising on yellow meant disrupting the brand identity across every channel.
Options considered: Shift the brand palette darker to meet contrast at all sizes. Use yellow as decorative accent only, never interactive. Or build a semantic token system that keeps yellow as visual identity but auto-substitutes accessible variants for interactive states.
What I chose: Option 3 - a semantic color token system. Yellow stayed as the brand identity. Buttons, text, and interactive states automatically mapped to accessible variants. Engineers got a single source of truth. Future components inherited accessibility by default.
Why it mattered: Treating accessibility as a system (not a one-off fix) meant the next ten components would be compliant by default, without case-by-case review. This was the difference between a project deliverable and a lasting design system contribution.
Brand yellow as text
Fails contrast
Accessible action
Yellow as focus + identity
The clear version
With the system in place, I refined high-fidelity designs across web and mobile, applying accessible color palettes, responsive type scales, and consistent button behavior. The component library grew to 15+ reusable, WCAG-compliant pieces that reduced UI inconsistencies by 25%.
Design System Contributions
I built reusable, WCAG 2.1+ compliant components into Golden1’s existing design system: accessible checkboxes, switches, radio buttons, progress indicators, semantic status messages, and form fields with proper focus states.
Checkbox
Switch
Radio
Status
The project schematically
Sixty days after launch, the impact was measurable across compliance, engagement, and team efficiency.
30%
Accessibility compliance improvement driven by reduced WCAG violations across critical user journeys, improved screen-reader compatibility, and standardized UI components.
40%
Faster design-to-code cycles enabled by the new component library and reusable patterns, which reduced handoff friction.
25%
Reduction in UI inconsistencies through standardized component libraries aligned with ADA and brand guidelines across web and mobile.
What began as a compliance audit became a shift in mindset. Designing with accessibility at the core turned frustration into confidence for every user.
What worked
Building accessibility into the design system from day one, not as a retrofit · Cross-functional workshops with Level Access, QA, and engineering turned accessibility into a team success · Real user testing with assistive-tech users surfaced issues automated audits missed
What I’d change
Engage QA in accessibility planning earlier · Testing frameworks should be defined alongside design tokens · Document component decisions in Confluence sooner · Build a public-facing accessibility statement to make Golden1’s commitment visible to members