Intuit: Design system strategy Team
Standardizing Intuit’s Design Systems
As a Product Designer in Intuit's DSS team, I focused on three core areas that contributed to the enhancement, unification, and effective utilization of Intuit’s design systems across platforms (Web, iOS, and Android).
Key Focus Areas
1. Maintaining Libraries (Web, iOS, Android):
The Problem:
Design libraries needed continuous updates to keep pace with evolving design requirements. Outdated components and incomplete documentation often led to inefficiencies for designers and developers.
Responsibilities:
- Regularly updated and maintained component libraries across Web, iOS, and Android platforms.
- Enhanced existing components to reflect updated design standards and meet the needs of modern workflows.
- Ensured component documentation was accurate and thorough, improving usability for both designers and developers.
Impact:
- Improved consistency and reliability across platforms by ensuring that all components adhered to the latest design system guidelines.
- Reduced inefficiencies for teams using outdated or undocumented components.
One of the comprehensive documentation i creates was for the Date Picker component to ensure seamless adoption and consistent implementation across Web, iOS, and Android platforms. The documentation detailed the component's anatomy, including the Text Field, Calendar Container, and configurable elements like Month and Year Labels. Specifications provided pixel-perfect measurements, text styles, and interaction notes, addressing key use cases such as localization, default behaviors, and accessibility. I collaborated closely with developers to ensure technical feasibility and iteratively refined the documentation based on feedback from users. By structuring the content intuitively with annotated diagrams and an index for quick navigation, the documentation enhanced usability, improved adoption, and maintained design consistency across platforms.
2. Collaborating with Product Design Teams:
The Problem:
Different product teams often required custom components tailored to their unique user flows, which had to integrate seamlessly into the existing design system.
Responsibilities:
- Partnered with product design teams to identify gaps in existing component libraries and develop solutions.
- Designed components from scratch to align with overall system principles, maintaining a cohesive user experience across platforms.
- Authored detailed documentation for each new component, including usage guidelines, design specifications, and implementation notes.
- Collaborated closely with developers to ensure components were executed accurately and met design standards.
Impact:
- Enabled teams to create user flows more efficiently by providing reusable, system-aligned components.
- Strengthened collaboration between design and development teams, ensuring smooth implementation and reducing handoff issues.
I designed and documented Bottom Sheets for iOS and Android platforms to ensure a consistent and seamless user experience. This involved creating detailed templates showcasing variations like Menu, Checkbox, Radio, List, and Announcement, tailored to diverse use cases. I developed modular building blocks, enabling flexibility and scalability across product teams. By aligning the designs with platform-specific guidelines and collaborating closely with developers, I ensured precise implementation. The documentation included ready-for-development assets and changelogs to streamline adoption and maintenance, enhancing the overall efficiency of the design system.
3. Enhancing the Consumption of Design Libraries:
The Problem:
Users of the design libraries (both designers and developers) faced challenges in navigating, understanding, and effectively utilizing components.
Responsibilities:
- Optimized library structures to make them more intuitive and accessible.
- Improved the organization and categorization of components to simplify navigation.
- Advocated for and implemented enhancements to make the library easier to consume, such as advanced search and filtering capabilities.
Impact:
- Increased adoption of the design system across teams by making it easier to locate and understand components.
- Streamlined workflows, reducing the time required to find or adapt components for projects.
My Approach to Design System Strategy
Customer-Centric Design:
- Regularly gathered feedback from users of the design libraries, including new and experienced designers and developers, to identify pain points.
- Used insights from user feedback to prioritize updates and enhancements to the library.
Iterative and Collaborative Workflow:
- Followed an iterative design process, incorporating continuous feedback to refine components and workflows.
- Collaborated across teams to ensure that the design system met both user and business needs.
Attention to Detail:
- Ensured that each component and update adhered to system principles and maintained a cohesive aesthetic.
- Focused on creating clear and detailed documentation to reduce ambiguity and improve usability.
Library Unification Project
Streamlining Intuit’s Design Libraries for Consistency and Efficiency
1. Summary:
The "Library Unification" project aimed to unify design libraries across platforms (Web, iOS, Android) to enhance consistency, usability, and efficiency. By addressing pain points faced by designers and developers, the project streamlined workflows and improved the adoption of design libraries.
2. Problem Statement
The Challenge:
Multiple design libraries with platform-specific components caused:
- Inconsistencies in component usage across Web, iOS, and Android platforms.
- Confusion for users (designers and developers) when selecting components.
- Inefficiencies in workflows due to outdated or fragmented documentation.
Customer Focus:
- Primary Users:
- New and experienced designers, developers.
- Unmet Needs:
- Easy navigation and consumption of the design library.
- Clear documentation for implementing and using components.
- Consistency in components across platforms to reduce rework.
3. Research and Insights
User Research:
- Conducted interviews with designers and developers across platforms to identify pain points.
- Key insights included:
- Difficulty finding the right components due to poor organization.
- Discrepancies in component behavior and appearance across platforms.
- Frustration caused by outdated or incomplete documentation.
Validation:
- Synthesized user feedback to prioritize gaps in the library.
- Mapped out specific issues (e.g., inconsistent naming conventions, lack of cross-platform compatibility).
4. Design Process
Step 1: Brainstorming and Ideation
- Facilitated brainstorming sessions to address identified pain points.
- Key concepts included:
- A unified library serving as the single source of truth.
- Simplified navigation via an index page to provide a quick overview.
- Improved component structures to enhance cross-platform compatibility.
Step 2: Early Iterations
- Wireframes:
- Developed low-fidelity wireframes for the index page, focusing on intuitive navigation and categorization.
- Component Rebuilds:
- Redesigned a sample set of components to test cross-platform compatibility.
Step 3: Prototyping and Testing
- Created high-fidelity prototypes for the library’s new index page and key components.
- Conducted usability testing sessions:
- Gathered feedback on the ease of navigation and clarity of the index page.
- Validated that redesigned components met user expectations for consistency and usability.
5. Final Design and Solution
Key Features of the Unified Library:
- Centralized Index Page:
- Provided a quick overview of all components.
- Included filters and search functionality to streamline navigation.
- Cross-Platform Compatibility:
- Rebuilt components to function seamlessly across Web, iOS, and Android.
- Ensured that the design maintained consistency while accommodating platform-specific nuances.
- Improved Documentation:
- Developed detailed, up-to-date documentation for all components.
- Included implementation guidelines to ensure smooth developer handoff.
Results
Efficiency: Improved workflows by making the Figma library more user-friendly and components more reliable.
Durability: Rebuilt components were scalable and adaptable, reducing the need for frequent updates.
Alignment: Unified design libraries ensured seamless integration between designers and developers.
Scalability: Competitive insights provided a foundation for creating a future-proof design system.
Conclusion
My hands-on role in synthesizing research, rebuilding components, and enhancing library accessibility played a pivotal part in transforming Intuit’s design systems. This project not only addressed immediate challenges but also established a robust framework for scalable, user-centered design.
1. A customer-centric approach ensures that design systems address real pain points.
2. Iterative testing and collaboration with end-users are critical for a successful rollout.
3. Regular updates to documentation and components keep the library relevant and useful.
