Design Systems

Collaboration is at the heart of tackling a design system project. Teams define goals together, shape scope through joint research and analysis, and iteratively develop design principles and guidelines. Designers and developers collaborate seamlessly during development, translating designs into functional components. Comprehensive documentation and training materials are crafted collaboratively to facilitate widespread adoption. Continuous feedback loops and iterative improvements are fostered through ongoing collaboration, ensuring the design system evolves effectively. Through constant communication and shared ownership, collaboration drives the success of the project, fostering unity across the organization.

Deliverables for a design system project can vary depending on the scope, goals, and specific needs of the project. However, here are some common deliverables typically associated with a design system project:

1. Design Principles: Clearly defined principles that guide decision-making throughout the design system.
2. UI Components: A library of reusable user interface components (e.g., buttons, forms, cards, navigation menus) with associated documentation.
3. Typography Guidelines: Detailed specifications for typography, including font choices, sizes, weights, line heights, and usage guidelines.
4. Color Palette: A defined color palette with primary, secondary, and accent colors, along with guidance on color usage, accessibility, and combinations.
5. Iconography: A set of icons consistent with the design system's aesthetic and guidelines, along with guidelines for usage and customization.
6. Spacing and Layout Guidelines: Specifications for spacing, grid systems, and layout principles to ensure consistency and alignment across all components and interfaces.
7. Design System Portal: A dedicated website or portal for the design system containing all documentation, guidelines, resources, and download links for assets.
8. Training and Education Materials: Training sessions, workshops, or documentation to educate stakeholders, designers, and developers on how to use and contribute to the design system effectively.

These deliverables help ensure consistency, efficiency, and scalability in design and development efforts across various products and platforms.

‍

The timeline of a design system project can vary depending on factors such as the complexity of the system, the size of the team, and the specific requirements of the project. However, here's a general outline of the typical phases and timeline for a design system project:

1. Discovery and Planning (1-2 weeks):
   • Identify project goals and objectives.
   • Conduct research on existing design systems, if any.
   • Define scope, target audience, and stakeholders.
   • Establish a project timeline and milestones.
   • Allocate resources and form the project team.
2. Research and Analysis (2-3 weeks):
   • Gather requirements from stakeholders, designers, and developers.
   • Analyze user needs and pain points.
   • Review existing UI patterns and components.
   • Conduct competitive analysis and benchmarking.
   • Identify design principles and brand guidelines.
3. Design Phase (4-8 weeks):
   • Develop initial design concepts and visual direction.
   • Create wireframes, mockups, and prototypes for key components.
   • Iterate based on feedback from stakeholders and usability testing.
   • Finalize design decisions for components, typography, color, and layout.
   • Develop iconography and illustration style, if needed.
4. Development and Implementation (6-12 weeks):
   • Translate design mockups into reusable code components.
   • Build the design system library/framework.
   • Implement responsive design and accessibility features.
   • Conduct code reviews and testing to ensure quality and consistency.
   • Integrate the design system into existing projects or applications.
5. Documentation and Training (2-4 weeks):
   • Create comprehensive documentation for components, patterns, and usage guidelines.
   • Develop tutorials, guides, and examples for designers and developers.
   • Conduct training sessions or workshops to onboard teams to the design system.
6. Launch and Adoption (1-2 weeks):
   • Announce the launch of the design system internally.
   • Gather feedback and address any issues or concerns.
   • Encourage adoption by promoting the benefits and features of the design system.
   • Provide ongoing support and updates as needed.
7. Iterative Improvement (Ongoing):
   • Continuously gather feedback from users and stakeholders.
   • Monitor usage metrics and performance of the design system.
   • Plan and prioritize updates and enhancements based on feedback and emerging needs.
   • Regularly release new versions or updates to the design system.

It's important to note that these timelines are approximate and can vary based on the specific requirements and constraints of each project. Additionally, some phases may overlap or require iteration based on feedback and changes in project scope. Regular communication and collaboration among team members are essential for the success of a design system project.

‍

All our design system work is done on Figma.

This depends on the size and breath of the system. Generally speaking this can take up to 6 months and our engagement rates start at 10,000 USD per month.

We’re passionate about what we do, we don’t settle, and we understand what GREAT work looks like to strive towards creating best-in-class design.

If you’re looking for a team that just wants to push pixels, we’re not for you.  If you’re looking for a committed team that will push the envelope and aims to deliver value to the organization and the end user, we're a match :)