Leading the development of a comprehensive Design System for Qvalia, I transformed their product development process, enhancing consistency and efficiency. This initiative resulted in faster iterations, significant cost savings, and recognition with multiple industry awards.

ClientQvaliaTime period2018 - 2019IndustryFinTechServicesLead UX Designer, UI Designer, Interaction Design, Graphical Design

2019-12-16|Magnus UleniusBy Magnus Ulenius|3 Minutes

The Concept

In late 2018, Qvalia decided to implement a Design System to enhance efficiency and consistency in their product development process. The goal was to standardize design elements, improve collaboration, and ensure a cohesive user experience in a scale-up environment.

The Challenge

Qvalia’s development process was fragmented and inefficient, with inconsistent design elements causing delays and increased development costs. The challenge was to create a unified Design System that would streamline the development process, reduce lead times, and enhance product quality.

Research and Insights

Key activities to understand the requirements and develop the Design System included:

  1. User and Stakeholder Interviews:– Conducted interviews with users and stakeholders to identify pain points and gather requirements.
    – Focused on understanding the inconsistencies in the current design and development process.
  2. Audit of Existing Designs:– Reviewed existing design elements and identified inconsistencies.
    – Compiled a list of design components that needed standardization.

Design and Development

The development of the Design System involved several key steps:

  1. Creating a Component Library:
    – Developed a comprehensive library of standardized design components.
    – Ensured each component was reusable and adaptable to different contexts.
  2. Prototyping and Testing:
    – Created prototypes of the new design components.
    – Conducted usability testing to gather feedback and refine the components.
  3. Documentation:
    – Developed detailed documentation for the Design System, including guidelines for usage and best practices.
    – Ensured the documentation was accessible and easy to understand for all team members.

Key Features

  • Standardized Components: A comprehensive library of reusable design elements.
  • Customizable UI: Flexible design components that could be tailored to fit different branding requirements.
  • Detailed Documentation: Clear guidelines and best practices to ensure consistent application of the Design System.

The Result

The implementation of the Design System led to significant improvements:

  • Rebuilt App: The entire app was rebuilt in just 3 months, compared to the initial 3 years of development.
  • Reduced Lead Time: Lead time from idea to implementation was reduced from 3-6 months to just a few weeks.
  • Industry Recognition: Received Premium Usability and Rising Star awards from Finances Online in 2019, and the Mästar Gasell award from Dagens Industri.
  • Enhanced User Experience: Positive feedback from users on the improved UI and functionality.

Lessons Learned

The project highlighted the importance of a comprehensive perspective and user-centric design. Key takeaways included:

  • Holistic Approach: Considering all aspects of the product for a seamless user experience.
  • Continuous User Testing: Regular feedback and iterations to refine and improve the design.
  • Effective Collaboration: Close coordination with stakeholders to align goals and streamline implementation.

The components are large, clear and like bricks of DUPLO

– Henri Taipale, CEO

41

Screens

4x

Faster iterations

100+

Cups of coffee

More Work

Privacy Preference Center