Mission
McDonald’s needed to launch a Landscape Orientation for their app to improve interaction clarity particularly for accessibility users. This initiative was critical not only for usability and delight, but also to meet upcoming WCAG compliance requirements, which imposed a strict deadline for accessible digital experiences.
Challenge
Deliver an experience that was fully accessible, intuitive, inclusive, technically feasible, and aligned with brand standards, while also creating a scalable framework for future app interactions.
All in 8 weeks, from May - Jun 2025.
Client
McDonald's​
​
67+ markets, EU standards.
My role
Product Design Lead​
Services
Scope note: This case study focuses specifically on the accessibility (a11y) initiatives delivered for this client. In my role as Product Design Lead, my responsibilities extended well beyond accessibility and included product strategy, UX and UI design, and the evolution of the design system. Those parallel streams of work are intentionally not detailed here and will be shared in upcoming case studies
Frontend Design
Backend Design
Project Mgmt
Digital Accessibility
Impact
By creating a systematic, variable-driven approach, the project not only enhanced the user experience but also mitigated legal risk and protected the brand, while providing a foundation for future app innovation.
WCAG compliant
Legal Risk Mitigation
Met WCAG deadlines by delivering an accessible app - with landscape orientation - ensuring regulatory compliance and mitigating legal risk.
Protected the business from legal and reputational risk by ensuring the app meets accessibility laws, reducing the chance of lawsuits or fines.
Variable-driven
Got me a promotion
Aligned cross-functional teams with clear guidelines, accelerating design and implementation.
Created a scalable, variable-driven Design System table for future orientation updates and device size classes.
She was a key contributor to the landscape orientation work and a strong addition to the team. She consistently delivered high-quality design solutions that addressed complex constraints around accessibility, orientation, and scalability.
She was quick to respond with thoughtful design proposals, asked the right questions early, and communicated her decisions clearly. She proactively shared her perspective, challenged assumptions when needed, and helped the team move forward with confidence.
Beyond her design skills, she brought a positive, collaborative energy to the team—proactive, reliable, and easy to work with. A designer we trust and actively want involved in critical work.
%2012_10_15.png)
Kostis Agrafiotis
Director of Product Management, Global Mobile App.
Let's start
To define both the problem space and the delivery strategy, I aligned design decisions with the technical realities of the product. The McDonald’s App operates across legacy iOS and Android codebases while transitioning to modern UI frameworks.
​
Rather than redesigning or rebuilding screens, I partnered closely with engineering to make existing surfaces accessible in a scalable way—balancing delivery timelines, code quality, and long-term maintainability. This approach allowed us to improve accessibility without introducing technical debt or slowing the broader platform migration.
Discovery
​Reviewed mobile apps with multi-orientation support to establish a practical baseline for digital accessibility on mobile. I benchmarked both public and consumer apps to understand how accessibility is implemented beyond regulatory requirements.
I tested real-world experiences using assistive technologies on both platforms—VoiceOver (iOS) and TalkBack (Android)—to identify common patterns, usability gaps, and effective accessibility practices.
In parallel, I assessed landscape-specific constraints such as hand positioning, reach zones, and changes in visual hierarchy, clarifying how orientation impacts usability and accessibility at scale.​
Strategy & Design Direction
We designed a scalable, orientation-aware system to ensure content displays correctly across devices, OS versions, and landscape/portrait modes. Using safe area insets provided by the operating system, we balanced:
​
​Respecting safe areas for usability and accessibility and intentionally
Ignoring safe areas where visual edge-bleed enhances experience.
To communicate and enforce this, we introduced a “chrome” component in our design system to represent unsafe areas, creating a repeatable framework for all screens and components.
Key Focus Areas
Identify and fix patterns that break in landscape orientation. The work focused on identifying and resolving patterns that broke in landscape orientation, particularly around image scaling and layout behavior. Systematic adjustments to content spacing were applied across views and components to ensure consistency, usability, and accessibility at scale.
The home screen received additional attention as the app’s primary entry point, prioritizing polish and accessibility to set a strong first impression. For Order-Delivery screens, the scope was intentionally limited to essential WCAG compliance, with non-critical improvements deferred to the codebase migration work.
This approach ensured a consistent, accessible, and scalable experience, aligning design decisions with technical constraints and business goals, while enabling future experimentation and iteration.​
%2021_04_07.png)
%2021_03_47.png)
Home Screen - McDonald's app.
Solution Overview
I identified the patterns that broke in landscape orientation, particularly around image scaling and layout behavior. Systematic adjustments to content spacing were applied across views and components to ensure consistency, usability, and accessibility at scale. The home screen received additional attention as the app’s primary entry point, prioritizing it to set a strong first impression. For Order-Delivery screens, the scope was intentionally limited to essential WCAG compliance, with non-critical improvements deferred to the future migration work.
%2014_52_13%201.png)
Applying Variable Tokens across the Design System components required some upfront manual effort. The primary focus was supporting portrait and Landscape Orientations on mobile, with only a bare-bones Tablet setup in place. While Tablet was not fully rolled out or included in design deliveries, this approach still enabled a flexible, scalable, and robust foundation for future expansion.
%2009_51_28%201.png)
%2012_57_39%201.png)
Validation & Iteration
I translated design decisions into well-scoped Jira tickets, ensuring each included clear context around the why, what, and how to support efficient implementation. This helped reduce ambiguity and made the tickets actionable for engineering.
​
I aligned closely with developers through regular co-working sessions, where we reviewed design solutions together and resolved technical constraints in real time. Given the tight deadlines, this enabled a highly agile, iterative way of working that balanced speed with design and code quality.
Sandy stepped in seamlessly to support the team during the landscape orientation and accessibility work. She took ownership of complex tasks, translated audit reports into actionable tickets, and proactively addressed issues, helping the team maintain momentum even under tight deadlines.
Her strategic thinking, initiative, and collaborative approach ensured that the project moved forward smoothly, and her contributions had a direct, measurable impact on accessibility compliance and overall team efficiency.
​
It has been a pleasure to be on this journey with you, and I look forward to our continued work together.
​
​
Martti Jerkku
Program Manager Mobile App.
Value Delivered
Passed an external WCAG accessibility audit with zero critical issues, validating that the Landscape Orientation solutions met regulatory and usability standards, mitigating millionaire costs. The project also resulted in the expansion of the UI Library from portrait-only to a scalable, multi-orientation system, improving consistency, accessibility, and long-term maintainability across the app.
See it in action
Experience the landscape orientation and a11y improvements firsthand.
