Motion UI Accessibility
Led Motion UI accessibility research, defining principles, introduce Motion UI System and improving micro-interactions across council digital platforms.
Role
UI UX/Graphic Designer
Industry
Public Sector
Duration
6-8 weeks (research, audit, and strategic recommendations)
Presentation Link
Background
As Christchurch City Council’s digital platforms evolved, motion design remained largely undefined and inconsistently applied across products. This created gaps in user experience, accessibility, and system cohesion - particularly for users interacting with data-heavy services.
The project was initiated to explore the role of Motion UI within council digital products, define its value, and establish a foundation for a consistent and accessible motion system. The work needed to consider a diverse user base, including residents with varying accessibility needs (e.g. Motion sickness), while aligning with existing digital brand standards.
Research & Planning
I conducted research into Motion UI principles, focusing on its role in usability, accessibility, and user feedback. This included identifying how motion can support orientation, reduce cognitive load, and improve perceived system responsiveness.
I also audited existing Christchurch City Council digital platforms to identify inconsistencies and gaps in motion usage, particularly in micro-interactions such as loading states, buttons, and navigation components.
Design System
Based on the research and audit findings, I defined key motion principles tailored to council needs, including clarity, accessibility, and purpose-driven animation.
I developed recommendations for a motion system that could integrate with the existing digital design system, including guidance on micro-interactions such as button states, transitions, and feedback patterns.
Development & Implementation
As part of the recommendations, I identified the absence of loading indicators as a critical usability issue. I proposed and supported the introduction of a loading spinner to communicate system status, particularly for data-heavy tasks such as property searches.
The motion guidelines and micro-interaction improvements were structured to be actionable for future implementation across council platforms.
Testing & Optimization
Recommendations were refined through internal discussions and feedback, ensuring alignment with technical feasibility and organisational priorities.
The proposed motion system and improvements were designed to be scalable, allowing for gradual adoption across different products and teams.
Solutions
Established foundational principles and an action plan for a council-wide Motion UI system
Identified and addressed key usability gaps through improved micro-interactions and system feedback
The project defined how motion should be used within Christchurch City Council’s digital ecosystem—not as decoration, but as a functional tool to support usability and accessibility. By outlining clear principles and an action plan, it created a pathway for developing a consistent motion system aligned with both user needs and brand standards.
In addition, practical improvements were identified and implemented, such as introducing loading indicators to communicate system status. Enhancements to micro-interactions, including buttons, icons, pagination, and upload states—helped create clearer, more responsive user feedback, improving the overall experience across multiple touchpoints.
Results
Improved user experience through clearer system feedback (e.g. loading states)
Established a scalable foundation for motion design across council digital products
The introduction of loading indicators addressed a critical usability issue, particularly for data-heavy services like property search, where delays could previously be misinterpreted as errors. This improvement enhanced user trust and reduced confusion during interactions.
More broadly, the research and recommendations provided a strategic foundation for Motion UI within the council. This work demonstrated the value of motion as part of a design system and positioned it as an important component of accessible, user-centred digital experiences moving forward.
Other projects
Water Quality Map - Wai Map
Redesigned interactive water quality maps, enhancing usability and clarity for public and internal teams.
He Puna Taimoana
Led the redesign of the He Puna Taimoana website, improving usability, accessibility, and mobile-first experience.
What’s on UI
Redesigned the What’s On app onboarding and introduced a seasonal UI across mobile and desktop.