A strategic roadmap to Universal accessibility and GDPR compliance
Context
The Havells Sync app is the central backbone for controlling Havells' vast portfolio of IoT appliances. However, its current interface lacks crucial digital accessibility features, leaving a significant demographic unable to independently manage their smart homes.
Project Objective
Ensuring that the convenience of automated living becomes universally accessible
Granting users total transparency over their personal data
Scale operations globally and enter the European market
Conformance with WCAG 2.1 AA
Alignment with GDPR standards
My role
As the sole owner of this initiative, I led the end-to-end accessibility and privacy strategy, from foundational research and establishing design annotation system to guiding the final engineering implementation.
I worked closely with the design system team to identify and integrate accessibility requirements into the design components.
My focus was to establish our accessibility and GDPR foundation and enable cross-functional teams to execute it seamlessly.
Approach
A comprehensive methodology was adopted from initial research and standard definition to systemic implementation and rollout.
Discovery and Research
Reviewing WCAG and internal design benchmarks
Analyzing accessibility approaches in other organisations.
Synthesizing research into actionable insights
Strategy and Alignment
Defining objectives for the project
Auditing app to identify gaps and areas for improvement
Execution
Establishing design guide rules, tokens, and component logic
Implementing in design system
Creating a standard annotation system for developer handoff
Delivery
Strategizing the deployment and adoption plan
Post-development
Re-auditing the implementation and sharing feedback with developers
Research
Research question
Research constraint
Primary research with users with disabilities was not conducted at this stage, as the focus was on establishing foundational standards and system-level alignment.
No existing accessibility benchmarks or usability data, requiring the creation of a baseline before measurable improvements could be defined.
Understanding standards
The first task was to review the latest WCAG 2.1 criteria. It represents the international benchmark to ensure that the web content is perceivable, operable, understandable and robust for all users. This review enabled further exploration into iOS and Android specific guidelines.
Accessibility practices
Equipped with comprehensive understanding of standards and guidelines, it was easier to benchmark competitor in smart home appliance industry. But there was limited web documentation on A11y practices within the smart home sector. So, the research was expanded beyond IoT to analyze how applications in other industries successfully embed inclusive design standards.
Insight
When to implement these standards in design?
The "Shift-Left" Strategy
Accessibility and data privacy cannot be treated as post-development checklists or QA tasks. They must be integrated at the foundational design system level.
Component-First Alignment
Standards should be applied the moment a component is conceptualized, ensuring that states, color contrast, and semantic structure are inherently compliant before they are ever used in a screen layout. This makes development cycle cheaper, efficient, and educational for the team.
Saved time
Early visibility
Easy collaboration
Cost effective
How to implement these standards in design?
Leveraging Native OS Capabilities
Rather than reinventing the wheel, the most robust approach is to align app components closely with native iOS and Android accessibility features (like VoiceOver and TalkBack) to ensure predictable behavior for assistive technology users.
Standardized Documentation
Complex WCAG guidelines and GDPR legalities need to be translated into digestible, actionable cheat sheets for the design team.
Seamless Developer Handoff
Implementation relies on clear communication. Creating a visual annotation system within the design files allows designers to dictate semantic roles, ARIA labels, and focus order directly to engineering, removing guesswork.
Redefining goal
Establish a measurable, system-wide baseline for WCAG 2.1 AA and GDPR compliance across the Havells Sync app.
Bridge the gap between design and engineering by creating a shared language and standardized process for accessibility.
Empower the broader product team to adopt inclusive design practices independently through quick-reference guides and updated design system tokens.
Delivery
Auditing existing app
The website was first audited to understand which WCAG 2.2 criteria were being met and which were failing. Based on the audit, accessibility standards were embedded into the design system, saving time and effort compared to designing entirely from scratch. With the updated components in place, interfaces were redesigned for accessibility.
Design Guide
To streamline the process, Figma plugins were explored to speed up implementation. Quick-reference A11y guides were created to break down complex guidelines into clear, actionable steps relevant in our context for the team. At the same time, the UX role in data privacy was defined, ensuring interfaces transparently communicate how personal data is collected and processed.
Snippet of the reference guide for design system - A11y
Snippet of the audit and reference guide - GDPR
Handoff annotation system
To clearly communicate the necessary A11y tags, traits, and structural attributes to engineering, a standardized Figma annotation system was designed. This system provided a consistent, visual method for marking components with all relevant accessibility information, including semantic roles, labels, states, and interactions.
By embedding these annotations directly into the design files, engineers could quickly understand how each element should behave across different platforms and assistive technologies, reducing ambiguity and implementation errors.
Example of the annotation shared with dev for screen reader
Because accessibility needed to be implemented within an active product roadmap, a phased accessibility rollout was executed in partnership with engineering. beginning with alignment to OS in-built accessibility features. Phase 1 focused on implementing proper semantics and labels to support screen readers and voice assistive technologies, followed by rigorous post-build audits to validate compliance.
Impact
Advocated for inclusive smart living
Enabled users with diverse abilities to independently manage their smart homes and expanding accessibility.
Unlocked Global Scalability
Enabled the Havells Sync app to expand into regulated markets like Europe.
Accelerated Development Cycles
Developer handoff was streamlined, and we fostered a highly collaborative environment between the design and engineering teams.
Reduced time and effort
The effort and time needed to audit was significantly reduced by embedding accessibility guidelines directly into our design system.
Established a Proactive Culture
This initiative raised overall organization sensitivity toward inclusive design and the critical legal realities of GDPR.
Reflection
I learned that retrofitting accessibility is inefficient; real impact comes from embedding semantics, focus states, and contrast at the component level from the start. This shifted my approach from designing screens to building scalable, inclusive systems.
Advocating for accessibility involved trade-offs between WCAG compliance and brand aesthetics. I learned to communicate the business and ethical value to stakeholders, finding compromises that ensured compliance without sacrificing brand identity.
I learned the importance of creating not just fixes, but a sustainable blueprint for how an organization can design and build products moving forward.