Ualá
Design System
Fintech
Company
Ualá
Role
Design System Lead
Year
2018-2022
1. The Pledge
Goals
Business: Gain market and position the app to the first place in the market.
Product: Create a strong product that can be able to release features quickly.
User: Achieve an unique visual and intuitive experience.
Key metrics
Usage Statistics: Measure how frequently design components, patterns, or guidelines from the design system are used by development teams. This could include the number of components used per project or over a specific timeframe.
Scalability: Measure how effectively the design system accommodates the evolving needs of the product, considering new features, platforms, or devices.
Developer Efficiency Measure improvements in developer productivity, such as reduced coding time or ease of implementation of design elements.
Cost Savings: Calculate cost reductions in design and development processes due to the reuse of components and streamlined workflows facilitated by the design system.
Time-to-Market Improvement: Track the reduction in design and development time due to the reusability of design system components, resulting in faster feature releases.
Concepts
Closeness: Users have to feel accompanied: we have to help them in moments of tension and speak simply, clearly and without technicalities.
Trust: We have to transmit transparency and be detailed when explaining all the processes. We have to worry about generating tranquility and security.
Inclusion: We want the experience to be fast, easy and consistent. That our users feel that we help them manage their finances.
Look & Feel
The curved shapes of the brand gave rise to transparent waves that resembled waves or clouds. This first look & feel was reminiscent of a maritime or aquatic universe. We really liked the idea of transmitting that feeling of tranquility in our interface. From that world came the “lighthouse” element, which would later become a more inclusive one, and that is how “Fare” was born.
Typography
We chose the Public Sans font family for our entire system because it is designed to adapt to all platforms, both native and web. It has a very particular morphology and character and performs well in both large and small sizes.
Documentation
We include a Guidelines document so that all interested people can see our system and learn how to use it, from developers and Product Owners to Stakeholders and Business people.
3. The Prestige
Key Learnings
After 2 years of development of the design system I was able to
Hire several roles including, Product and Visual Designers, UX Researchers and UX Writers.
Learn to scale a Design System throughout the increasing growth of a startup.
Convince stakeholders about the importance of adopting a design system in early stage.
Understand how to create a strategic roadmap to achieve business and product goals.
Track the progress of the implementation and adoption of the DS in development and production.
Success Metrics
Usage Statistics: Usage of design system components has significantly increased, with a 200% rise in the number of components used per project, indicating widespread adoption and trust in the system.
Scalability of the Design System The design system has efficiently scaled to support new platforms, devices, and product expansions, demonstrating adaptability and flexibility.
Developer Efficiency: Developers report a 60% increase in productivity owing to the ease of implementing standardised design elements.
Cost Savings
Overall costs related to design and development processes have reduced by 25% due to the efficiency gains and reduced rework facilitated by the design system.
Time-to-Market Improvement: There has been a notable 30% reduction in the time taken to launch new features or updates due to the reusable nature of design system components.
