Background:
Vixa from the AA, formerly known as AA-X, offers real-time health alerts, driving insights, and proactive maintenance solutions tailored to user needs. Despite its loyal user base, feedback indicated that certain user journeys were cumbersome, leading to increased user drop-offs and negative reviews.
Objective:
The project aimed to revitalise the app’s design and functionality, focusing on enhancing user engagement and simplifying key user journeys, particularly the mobile mechanic booking process.
My Role:
User Research & Testing: Conducted comprehensive research and user testing to identify pain points and user expectations.
Prototyping & UX/UI Design: Developed and refined prototypes, leading to final designs that prioritize usability and aesthetic appeal.
Design System & Branding: Implemented a cohesive design system aligned with the new branding to ensure a consistent and intuitive user interface.
Design process
Design process
1. Discover and Define:
User Research
Stakeholder Interviews
Competitive Analysis
2. Ideate and Conceptualize:
Brainstorming Sessions
Sketching
Wireframing
3. Design and Prototype:
Grid System Implementation
High-Fidelity Prototyping
Usability Testing
4. Develop and Iterate:
Collaboration with Developers
Iterative Feedback
Quality Assurance
Challenges and Strategic Solutions:
1. Enhanced Visibility for Mobile Mechanic Service:
Problem: Previously, the mobile mechanic service was not easily accessible, reducing user engagement with this key feature.
Problem: The app’s outdated look and feel were deterring new users and reducing satisfaction among existing ones.
Solution: Overhauled the entire UI with a modern design, utilizing clean lines, contemporary color palettes, and intuitive navigation elements to enhance user engagement and align with current design standards.
Solution: Implemented a new design where the mobile mechanic service is highlighted on the main page. Introduced visually appealing cards that detail the service benefits, cost comparisons, and easy booking options, significantly reducing the effort needed to schedule a service.
Problem: Users felt overwhelmed by the amount of data presented to them.
Solution: Introduced a dial design for fault levels that prioritizes information visually, allowing users to quickly assess the most pressing issues. This design was optimized for accessibility, ensuring it is effective for a diverse user base, including those with disabilities.
Problem: The absence of a unified design system and detailed specifications for developers has led to inconsistencies across the Vixa app's interface.
Solution: To address these challenges, the redesign of Vixa included the development and implementation of a comprehensive design system.
This system created by me offered a set of reusable components, standardized layouts, consistent color schemes, and typography guidelines that align with the brand’s identity. All new components I have created were accompanied by detailed specifications including behavior in different states and interactions.
Solution: Conduct training sessions for developers and designers to ensure they are familiar with the system and understand how to use it effectively. I have developed over 30 new, reusable components, enhancing modularity and scalability across projects.
