Redesigning for Usability and Accessibility:
The Case Study
CLIENT
PROJECT DURATION
July 2023
9 months
SERVICE AND OFFER
Strategy
UX designer
Visual design
TEAM
Me as Sole and first designer
Product owner
Technical lead
2 Android developer
2 IOS developer
3 front developer
2 back-end developer
BRIEF
Appartement is a platform that simplifies communication and collaboration for residents and property managers. As the first product designer on this project, I revamped the app to enhance usability, particularly for senior users, using heuristic evaluations, user research, and WCAG guidelines.
My work delivered measurable results:
16% increase in task success rates for key actions.
18% boost in average session time.
19% faster task completion for senior users.
Additionally, I introduced a scalable design system and collaborated with developers to create a seamless and inclusive user experience.
PROBLEM
Inconsistent Design and Accessibility Challenges
The platform had usability issues that frustrated senior users, who struggled with unclear navigation and inconsistent interfaces. A fragmented design system—built piecemeal by developers over time—led to:
Confusion and higher error rates
Challenges integrating new features
A lack of accessibility, impacting users with visual or cognitive impairments
SOLUTION
Unified Design and Accessibility Improvements
Streamlined User Experience: I analyzed user recordings to identify pain points caused by inconsistent design and navigation.
Scalable Design System: I introduced a unified "Prime Engine" design system, ensuring cohesive navigation, forms, buttons, and icons, all aligned with WCAG and AAA accessibility standards.
Collaborative Implementation: Partnering with developers ensured smooth integration of the new designs across the platform.
Results Delivered
Reduced inconsistencies for a smoother user journey
Enhanced engagement with an 18% increase in session time
Improved usability with a 16% rise in task success rates
Accessibility-focused changes led to 19% faster task completion for senior users
RESEARCH
Unmoderated testing
Objective:
Study Overview: Using Hotjar to Improve User Experience
How I Used Hotjar:
Heatmaps: Spotting User Struggles
Hotjar’s heatmaps showed us exactly where users were clicking—and more importantly, where they weren’t. We found that some buttons were overlooked, and certain features weren’t being used, especially by senior users.
Session Recordings: Understanding User Flow
Watching real-time session recordings gave us a clear picture of how users navigated the site. We saw where they got stuck, how they interacted with different elements, and where confusion set in, particularly for senior users trying to complete tasks.
User feedbacks:
Considering timing, task loads and budgeting we went back to the real data coming in from customer support system to gather the most critical issues or questions reported by users.
The incoming data were structured to complement the insights gathered from Hotjar, helping us form a clear, comprehensive picture of the critical issues to address in the redesign
Data-Driven Redesign:
Unified Design System:
We standardized the design across the platform, making it more consistent and predictable for users.Improved Accessibility:
Based on Hotjar insights, we made buttons larger, increased contrast ratio, and simplified navigation to make the platform more accessible, particularly for senior users.Smoother User Flows:
We reduced the number of steps needed to complete key tasks, resulting in quicker, easier navigation.
RESEARCH
User persona
Objective:
Understanding and hearing from our potential users makes the product more focused.

John Conan
“I need a straightforward and reliable platform—something as easy as checking a notice on the bulletin board.”
Age
55
Status
Married
Occupation
Engineer
Location
Amsterdam
Personality
Detail-oriented
Planner
Planner
Technology novice
Goals
Stay informed about community updates in a simple, straightforward way.
Participate in community decisions with minimal effort.
Easily access and manage important documents like contracts and billing statements.
Frustations
Complicated or cluttered platforms.
Difficulty in finding important information quickly.
Trouble tracking maintenance requests or issues with the community platform.
Needs
A user-friendly platform that is easy to navigate.
Centralized access to notices, documents, and events in the apartment community.
A system that doesn’t require frequent updates or tech skills to use effectively.
DESIGN SYSTEM
Customization of PrimeOne Design System:
PrimeOne provides a solid foundation of pre-built components and UI elements that are easy to customize. I adapted these components to fit the unique needs of the platform, aligning them with our brand guidelines while maintaining the flexibility PrimeOne offers.
For example, I customized buttons, form inputs, and navigation elements to ensure they not only met our visual standards but also enhanced usability. Since PrimeOne already offers responsive and accessible components, I could focus on refining the user experience rather than building everything from scratch.
Efficiency in Redesign:
The built-in UI patterns from PrimeOne allowed me to rapidly prototype new features without the need for constant back-and-forth between design and development. This helped significantly reduce the design cycle, as developers could implement the components directly from the design system without additional adjustments.
Because PrimeOne ensures consistent spacing, typography, and color schemes, it minimized design inconsistencies across different sections of the platform. The uniformity also made it easier to maintain and update the design in the future, saving time on revisions and new feature rollouts.
Reducing Development Effort:
PrimeOne’s integration with development workflows was a huge advantage. Developers were already familiar with its pre-built libraries, which meant they could implement new features faster and with fewer errors. The ready-to-use, thoroughly tested components reduced the amount of custom code needed, improving overall development speed and minimizing bugs.
Conclusion:
By leveraging the PrimeOne design system, I was able to not only customize a scalable and visually cohesive UI but also significantly reduce the design and development effort. This allowed us to deliver the project faster, with fewer revisions, and ensured that future updates would be just as efficient. It was a win-win for both the design team and developers, keeping us focused on delivering a seamless user experience.
UI DESIGN