UXPin invited Ethnio to talk about how DesignOps and ResearchOps teams can collaborate to be more effective and create more impact. Ethnio outlines a strategy for using research democratization, tools, and automation to keep product, UX, and research teams in sync.

Ethnio demonstrates how organizations can:

• Recruit, schedule, and pay participants for global research studies using Ethnio
• Conduct high-quality usability testing with interactive UXPin prototypes using Merge technology

Streamline cross-functional collaboration and automate many DesignOps challenges with UXPin’s Merge technology. Visit our Merge page for more details and how to request access.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

Introducing Ethnio

Ethnio is a UX research CRM designed to streamline research operations. The platform allows UX researchers to automate everything from participant recruitment to scheduling, quotas, and incentive payouts.

Ethnio’s flagship product, Intercepts, allows UX researchers to target and recruit participants from inside product ecosystems–web and native–so researchers can speak to real users who actually use their products.

In this article, Ethnio outlines how Operations teams can use tools and automation paired with an effective democratization practice to create better relationships and operational efficiencies. 

Using UX Research Democratization to Bridge the Gap

DesignOps and ResearchOps teams can leverage research democratization to enhance collaboration between departments. Democratization–paired with the right tools and automation–can help Ops teams create a greater impact for the organization while designing better product experiences.

“Research is a practice of rigorous curiosity, and the role of researchers in an organization is to help the people they work with make better decisions. At scale, this means building intentional, responsible, and sustainable systems of learning with and from the people you want to serve.” Behzod Sirjani, Research Advisor and Program Partner at Reforge.

What is UX research democratization?

UX research democratization is about “making research (collecting, storing, sharing, and accessing) accessible and possible for anyone within an organization, regardless of their role. It aims to break down traditional barriers and hierarchies, allowing cross-functional teams to contribute to and benefit from user insights.”

Improving collaboration and research insights

Democratization helps remove operational friction by allowing each team to see and understand the work of the other. It brings together researchers, designers, and product teams, improving communication, streamlining workflows, and developing high-quality research insights.

The result is a holistic design and research approach leveraging the organization’s collective intelligence. This democratization not only accelerates the design process but also improves the quality of the final product, ultimately delivering a more compelling and satisfying user experience while maximizing DesignOps and ResearchOps’ impact.

“When we talk about impact, we must ensure that we wear our business hats more than our researcher hats. It’s crucial to understand that from the business perspective, research is not just about running studies, but about providing value that the company can use to achieve its goals.” Carol Rossi, Expert Researcher, and Consultant.

So, how does utilizing research democratization, tools, and automation work in practice?

Recruit, Schedule, Test, & Pay Participants using Ethnio & UXPin

Let’s say you are an operations expert in design or research, and you want to support your designer in talking directly with some prospective customers as part of a sprint. 

Here’s the flow for reducing their time and effort to as little as possible and letting Ethnio do all the screening, scheduling, and paying participants for their time. 

On the design end, DesignOps can invite researchers to collaborate in UXPin, sharing feedback and insights on interactive prototypes.

This brief case study will demonstrate how Research Ops and DesignOps teams can collaborate effectively and efficiently using their respective tools.

Step 1: Add designers as facilitators to a study

Ethnio allows researchers to add stakeholders to participate in participant interviews or usability studies as observers, facilitators, or collaborators—even if they don’t have an Ethnio account. Creating these connections enables UXRs to automate communications for key stakeholders and participants.

Step 2: Invite DesignOps to connect the right tools

Keeping team members and stakeholders in sync with research initiatives is crucial for effective collaboration. Ethnio lets researchers connect their team’s meeting and scheduling tool stack, like Teams, Google Calendar, and Zoom, to automate communications and make it easy for team members to attend studies and interviews.

Step 3: Setup and collaborate on research quotas

Research quotas are vital for collecting data from representative user groups within your target audience. The industry standard is to use color-coded spreadsheets, which team members manage and update manually—one of the most time-consuming Research Ops tasks, especially when running multiple complex projects.

“A lot of our customers have struggled to manage multiple spreadsheets, Google Forms, and manually scheduling and paying participants. Ethnio helped automate and streamline this entire process.” Kyle Robertson, Product Specialist at Ethnio.

Ethnio simplifies quotas through automation and an intuitive UI to visualize an entire campaign. Researchers can also invite designers, product managers, and other stakeholders to review and approve, ensuring they recruit the right participants every time.

Connect Ethnio to Slack, and the platform will automatically ping team members and stakeholders to review the participants the instant they meet quota criteria. This simple automation streamlines quota selection in today’s async work environments.

Step 4: Scheduling

Scheduling is a challenge for UX researchers managing multiple simultaneous campaigns. Trying to sync participants with stakeholder availability can be complex and time-consuming. Automation is critical to increasing efficiency while ensuring the right team members and stakeholders are in the loop.

Ethnio can use fast mode to pick the best participants, automatically send calendar invites to participants and observers, and put each session on the facilitator’s calendar with their secure dynamic Zoom meeting.

Step 5: Running a usability study with UXPin

The day arrives to conduct the usability study. It’s time to bring UXRs into the design tool stack to share insights and collaborate.

Designers use UXPin with Merge technology to create an interactive prototype using the same component library engineers use during development.

This advanced prototype allows participants to interact with the user interface like they would the final product, providing accurate, meaningful insights for designers to iterate and improve.

DesignOps can invite UXRs and other stakeholders observing the session to collaborate and share feedback using UXPin’s Comments. Like Ethnio, collaborators don’t need a UXPin account to use Comments. They can annotate UIs and tag team members to discuss features and pain points. UXPin integrates with Slack to automate effective cross-functional collaboration.

“Our stakeholders are able to provide feedback pretty quickly using UXPin. We can send them a link to play with the prototype in their own time, and UXPin allows them to provide comments directly on the prototypes. UXPin’s comments functionality is great because we can follow along and mark comments as resolved once we address them.” Erica Rider, former UX Lead EPX at PayPal.

Step 6: Incorporating feedback

The design team can analyze user feedback to improve prototypes. Making changes is as easy as drag-and-drop with Merge components, meaning designers can iterate and test efficiently.

Once testing is complete, designers can hand off to devs for engineering and release. The development team already has the code, so it’s as easy as copying and pasting the production-ready JSX from UXPin to streamline development.

In the meantime, researchers are finalizing the study in Ethnio.

Step 7: Pay the participants

The study is over, and it’s time to pay participants. Many organizations use third-party applications to deliver payouts in cash or via gift cards. The problem with these apps is that they increase costs and expose participant data to third parties, creating legal complications for organizations.

Ethnio’s native Incentives allow UXRs to pay participants in any currency worldwide in seconds. Pay via bank transfer, electronic rewards (Amazon, PayPal, and gift cards), and dozens of other payment methods. Participants can also choose to donate their incentive to 40+ global charities.

Democratization in Action

The journey from research to final product development demands seamless collaboration and efficiency. Our use case with Ethnio and UXPin Merge demonstrates how democratized research practices can revolutionize this journey for greater operational impact and user experiences.

With Ethnio and UXPin Merge in operations’ tool stacks and an effective democratization practice, teams can optimize traditional UX and research processes to deliver better outcomes.

Enhance User Testing With Interactive Prototypes Using Merge Technology

UXPin’s code-to-design solution enables designers to bring code components from a repository into the design process, enhancing prototype fidelity and functionality–without writing a single line of code.

Merge components are exact replicas engineers use to develop the final product, complete with styling and interactive properties. This single source of truth means designers and engineers speak the same language and work within the same constraints. Design handoffs are smoother with minimal documentation and explanation because design and development teams pull components from the exact same repository.

Ready to see how code-to-design can revolutionize your design process and enhance cross-functional collaboration? Visit our Merge page for more details and how to request access.

The post Shared Insights, Shared Vision – Democratization and its Impact on Operations appeared first on Studio by UXPin.

Design planning promotes consistency, scalability, and efficiency throughout the design process, resulting in a higher-quality end product and a more satisfying user experience.

Increase your end product’s quality and deliver better user experiences with interactive prototypes from UXPin. Visit our Merge page for more details and how to request access.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

What is Design Planning?

Design planning is a strategic project planning process of outlining and organizing the design approach for a digital product. It sets the foundation for effective collaboration, efficient execution, and successful outcomes in the product development journey.

Design planning involves, but is not limited to:

• Setting clear objectives
• Defining design principles and guidelines
• Establishing information architecture
• Determining the overall visual and interaction design direction

Why is Design Planning Important?

Design planning is crucial in digital product development as it provides a roadmap for the design team. It ensures that design decisions align with user needs, business goals, and brand identity.

Effective design planning helps streamline the product design process by conducting thorough research, defining clear goals, and establishing guidelines to reduce ambiguity and minimize rework. It enables effective communication among team members, facilitates stakeholder alignment, and increases the chances of creating a user-centered, visually appealing, and functional digital product.

Who is Responsible for Design Planning?

Someone from the design team is typically responsible for creating the design plan. The individual varies depending on the organization and org structure. Some common examples include:

• Design Leader
• UX designer
• DesignOps (DPM or Leader)

While the design team is responsible for creating and executing the design plan, it’s a collaborative effort involving multiple teams and stakeholders to align user needs with business goals and objectives.

Aligning Design Efforts for Business Success

In a recent webinar hosted by UXPin titled Strategies for Building a Resilient DesignOps Practice, experts Salomé Mortazavi, Meredith Black, and Adam Fry-Pierce discussed the importance of aligning design efforts with business strategies. The panelists shared insights on the challenges design teams face and how DesignOps can address these challenges.

Key challenges in aligning design efforts

Salomé Mortazavi, Senior Director of DesignOps and Design Systems at SiriusXM, highlighted that a common root cause of challenges faced by design teams is the lack of alignment and understanding of Design’s role within the overall business strategy. Salomé emphasizes the importance of creating a shared vision and aligning the design and business charter.

Addressing bottlenecks and inefficiencies

Meredith Black, a DesignOps consultant, added that design teams often face bottlenecks and inefficiencies due to fragmented processes, communication gaps, and resource constraints. 

Meredith stresses that DesignOps can streamline workflows, create design systems, and foster collaboration across teams, which helps in moving forward with deliverables.

Planning and vision setting

The panelists also discussed the significance of planning and vision-setting in aligning design efforts. Salomé shared that her go-to tool for planning is aligning roadmaps around a maturity model she calls the Design Maturity Index. This strategy involves continuous planning throughout the year to ensure design efforts align with business objectives.

The following high-level design planning framework provides a step-by-step process to create a comprehensive plan for digital product development.

Step 1: Understanding the Problem

The first step is understanding the problem and target audience. Design frameworks like design thinking, double diamond, Agile UX, and others help designers research and plan projects with a user-centered mindset. To understand the problem, design teams will: 

1. Conducting user research: gather insights about the target users through interviews, surveys, and usability testing to understand their behaviors, preferences, and pain points.
2. Defining project goals and objectives: provide direction for the design planning process by outlining what the final product aims to achieve and the problem it intends to solve.
3. Analyzing user needs and pain points: crucial for designing a product that effectively addresses their problems by analyzing research findings to identify patterns, trends, and user requirements.
4. Identifying business requirements and constraints: aligning the plan with organizational budget limitations, technical feasibility, and timeline considerations ensures a viable and successful product outcome.

Step 2: Establishing Design Principles and Guidelines

Design systems are valuable in design planning as they provide a comprehensive framework for establishing design principles and guidelines. A design system will simplify or mitigate having to set principles and guidelines for every project.

Defining design principles

Design principles serve as guiding statements that inform the overall approach to design. They outline the fundamental values and goals teams must include in the product’s design. Defining design principles helps maintain consistency, coherence, and a user-centric focus throughout the design process.

Setting usability guidelines

Usability guidelines establish standards and best practices that ensure the product is easy to use and provides a positive user experience. These guidelines cover navigation, layout, content organization, and interaction design. Setting usability guidelines helps create a consistent and intuitive user interface that meets user expectations and needs.

Incorporating brand guidelines and visual identity

Brand guidelines and visual identity elements define the visual representation of the product and ensure consistency with the organization’s brand, including typography, color palette, logo usage, and imagery style. Incorporating brand guidelines and visual identity elements into the design planning process helps maintain a cohesive and recognizable brand presence across the product.

Step 3: Creating Information Architecture

Designers can establish a solid information architecture that ensures a logical and intuitive user experience, making it easier for users to find and navigate through the content and features of the digital product.

Conducting content audit and inventory

Begin by reviewing and analyzing the existing content within the app or website by identifying all the relevant information, assessing its relevance and quality, and determining what to keep, revise, and remove.

Organizing information and content structure

Organize the information into a clear and logical structure by grouping related content, creating categories and hierarchies, and establishing a coherent flow of information for users to navigate.

Creating user flows and navigation maps

Mapping user flows allows you to identify the most intuitive and efficient ways for users to achieve their goals. Navigation maps, on the other hand, visually represent the structure of the website or application, showing how different pages or sections are connected.

Designing wireframes and low-fidelity prototypes

Wireframes serve as a blueprint for the final design and focus on the arrangement of content, functionality, and user interactions. Low-fidelity prototypes allow for user testing and feedback before investing significant resources into high-fidelity prototypes.

Step 4: Defining Interaction Design

A product’s interaction design must facilitate smooth and engaging user experiences, enabling users to navigate and interact with the digital product seamlessly.

Mapping user interactions and actions

Map the product’s interactions and actions to understand user goals, define user journeys, and identify touchpoints where users engage with the interface.

Designing intuitive and user-friendly interfaces

Create intuitive, user-friendly interfaces by designing clear navigation, logically organizing content, and ensuring the UI elements are consistent and visually appealing.

Incorporating interactive elements and microinteractions

Interaction design includes designing buttons, menus, forms, and other interactive components that respond to user input. Microinteractions, such as hover effects or animated transitions, can add subtle but meaningful feedback to user actions.

Step 5: Visual Design and Branding

The design plan must guide designers in creating visually appealing and cohesive designs that align with the product’s brand and effectively communicate its purpose and message to the users.

• Choose an appropriate visual style that aligns with the product’s objectives and target audience. 
• Defining color palettes and typography to create a visually pleasing and consistent design, including colors that evoke the desired emotions and choosing legible fonts that reflect the brand’s personality.
• Creating visually appealing layouts and components like buttons, cards, or icons, paying attention to spacing, hierarchy, and balance to ensure a harmonious and engaging design.
• Ensuring consistency and coherence in visual design involves defining design patterns, guidelines, and style guides that provide a framework for maintaining consistency across all design elements and screens.

Step 6: Collaboration and Communication

As we discovered from our DesignOps experts above, collaboration and incorporating stakeholder feedback are crucial for design planning. Establishing effective communication channels, collaborating with stakeholders and cross-functional teams, and conducting design reviews and feedback sessions, facilitates knowledge sharing to align the design plan with business goals.

Collaboration and communication considerations for the design plan include:

• Establishing effective communication channels, including project management tools, email, instant messaging platforms, or virtual collaboration spaces, to ensure smooth and timely communication among team members.
• Collaborating with stakeholders and cross-functional teams involves key stakeholders, such as product managers, developers, and marketers, throughout the design process to gather their insights and align the design decisions with the overall product strategy.
• Conducting design reviews and feedback sessions provides an opportunity to present design concepts, prototypes, or wireframes to the relevant teams and gather constructive feedback to iterate and improve the design.

Step 7: Project Management and Timeline

Effective project and timeline management are essential for keeping design initiatives on track, optimizing resource utilization, and ensuring timely delivery of design outputs.

• Creating project schedules and milestones ensures a structured and organized approach to design planning and execution.
• Managing design resources and timelines ensures that design tasks are appropriately scheduled and coordinated within the overall project timeline.
• Tracking progress and adapting to changes to meet project goals and address any unforeseen challenges or changes helps maintain open lines of communication with stakeholders to ensure alignment and make informed decisions.

Deliver Better Product Outcomes With UXPin Merge

UXPin Merge bridges the gap between design and development to simplify design planning and product development. With design and engineering teams in sync, DesignOps can spend more time on strategic initiatives rather than wasting resources on redundant processes–like updating multiple design libraries and documentation.

With a real single source of truth, the design system team syncs updates to every team with one release–no more separate design libraries for designers, developers, prototyping, etc. Teams can access UI components and documentation from one centralized repository, resulting in absolute consistency, zero design drift, and minimal technical debt.

Streamline your design process with a single source of truth from Merge. Visit our Merge page for more details and how to request access.

The post Design Planning 101 – A Step-by-Step Guide appeared first on Studio by UXPin.

Successful designs are the result of a cohesive and creative design team. But how do leaders build teams that are rich in these skills? There may not be a universal formula for creating the perfect team, but fun design team activities offer room for collaboration and exploration. 

Team building starts with engagement, and when done well, it results in a strong design culture. This article explores the ways in which you can support active involvement and encourage collaboration in your design team.

Boost your team happiness with a design technology that reduces duplicated work to zero. Try UXPin Merge and design prototypes with components that are interactive by default and reusable across the whole product development process, from design to development. Discover UXPin Merge.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

How Do You Engage a Design Team?

Recent studies suggest that as much as 18% of employees are disengaged in their work. With the remote workplaces and fractured team structures that followed in the wake of COVID-19, encouraging engagement is no simple task.

Before pursuing any of the following activities, customize these concepts to best suit your team’s needs and your design operation goals. Some workplaces may allot time for activities, while others may require voluntary attendance outside of company hours.

To maximize involvement, be sure to accommodate the needs of everyone in your group. The design team may even benefit from the involvement of other teams within your company, so keep an open mind as you refine these activities to support your team vision statement.

Ask team members to name examples of good and bad design

Comparing exercises help refine an individual’s perspective of what makes a good design. When coupled with the opportunity to choose self-identified examples of good and bad design, this can also highlight diverse perspectives.

Start by having each employee name three examples of design that they qualify as “good”. These choices can then be discussed amongst the team in a way that allows each member to explain the aspects that they are drawn to in designs. These personal interpretations inspire self-reflection in individuals and the adoption of various perspectives for the group, as patterns in preferences are noticed.

This method can also be used in reverse. Instead of identifying three examples of good design, team members can identify and discuss examples of bad design. To keep this exercise constructive, especially in the face of conflicting views or in large groups, it is helpful to have a moderator.

Set up design team book club

Reading has been found to evoke engagement, especially when you apply deep reading practices. This form of literary interpretation is the result of readers drawing connections between other materials or real-world applications. And what better way to encourage these connections than to create a design team book club?

Much like a regular book club, one member would choose a book for the group to read, set a designated time frame to read the book, and then facilitate a conversation about it. Books focused on design and technology might be the most directly related to improving your team’s skills.

Still, classic titles concerning other topics can also support growth. You may be surprised to find that a variety of books can be related to your team’s work.

Organize a design workout

Most people align workouts with sports, but a workout can be any form of training intended to improve a set of skills. Innate skill and strength may help some teams succeed, but the most successful teams work out diligently to refine their skills as a group. In this sense, a design team is no different from a sports team!

Design-centered workouts can range from individual prompt-based design sketches to group challenges focused on communication. When generating workouts for a team, consider the factors that will impact team participation, like time and location.

Play a Tarot Card game

Context is key, and a special set of tarot cards can make that clear. With a set of tech tarot cards teams can view concepts and designs in relation to the many contexts they might end up in, such as environmental or relationship impacts.

This activity puts a focus on product impact. Also, much like standard tarot cards, each of the tech cards is intended to invoke ideas of both positive and negative outcomes. Teams can pass around a few cards from the deck and share their interpretation of how designs would fair in the face of each context.

Not only will this exercise highlight diverse views with a team, but it may also reveal areas of improvement on projects. Best of all, these cards can be downloaded from The Artefact Group for physical or virtual use.

Question mingle

Is a team really a team if its members don’t know each other? Whether your design team is new or old, there is a good chance it can benefit from some team building. Question mingling is an activity that encourages employees to ask each other questions in an effort to build relationships, trust, and learn each others’ strengths.

The setup is simple. Each employee gets to jot down three questions. Then, members pair up, ask each other their questions, and trade questions before meeting with another member. Time limits and a moderator are important to keep this activity flowing smoothly, especially when it comes to big groups and tight timelines.

“This VS That” game

There are few things as engaging as friendly competition, and that is exactly what this activity promotes. The “This VS That” game requires your team to be split into two groups that will host a spirited debate to decide which one of their topics wins.

The moderator picks the two combating topics and they can be as silly or serious as you see fit. One team can formulate an argument for waffles while the other stands for pancakes, or you can use this activity to encourage the assessment of two designs.

The goal is to get each team communicating and thinking creatively, so whether there is a true winner is completely up to you.

Hold 15 min, voluntary calls

A global study from 2021 found that about 1 in every 5 workers felt as if their organization did not care about them as a person. So how can you help team members feel like valued individuals in a team, rather than a corporate number?

Making time for conversation that goes beyond current projects can help your team members see their colleagues as individuals and also feel seen. Getting to know teammates on a more personal level allows for deeper team bonding and it can be a fun activity.

The key to keeping these 15-minute calls fun is ensuring they are voluntary. This way colleagues who like to chat will be engaged in this activity and more introverted individuals will not be pushed out of their comfort zone.

Share future design trends

It can be easy to get caught up in the current moment, so engaging in activities that encourage forward-thinking can keep your team on their toes. A facilitated discussion regarding future design trends can spark some interesting and possibly profitable concepts from your team.

• How will data-driven algorithms impact our industry?
• What does AI have in store for the future of design?
• How will nostalgia-influenced design differ in the future from what it was in the recent past?

Every future-focused question you can come up with is an opportunity to explore future design trends as a team.

Escape rooms

Problem-solving is an important skill in the world of design, and it is even more useful when possessed by a team. Instead of waiting for your team to encounter problems in projects and hoping they will learn to problem-solve as a team in a timely fashion, you can prime them for problem-solving.

Escape rooms are the perfect playground for teams to explore each other’s strengths, compensate for weaknesses, and collaborate. In a way, escape rooms mirror the deadlines and creative collaboration needed to complete projects at work, but without any repercussions.

You might be surprised to see how many people are familiar with and excited about escape rooms when you offer this activity. Individuals from other teams might also want to get involved in some company-wide collaboration.

Bonus: create activities for the entire product team (devs included!)

When team-building activities are opened up to the entire product team, the options for engaging individuals expand. When designers are paired with software developers or other product-centric team members, interesting side projects are created.

Some companies may come up with competitions like hackathons to encourage collaboration between team members. A software company, Netguru, held an interdisciplinary competition to develop an NGO app, resulting in a functional app for Poland’s largest charity within 4 weeks!

Activities targeted at the entire product team can be a force for good that benefits worthy causes, company collaboration as a whole, and individual development.

At UXPin, the value of collaboration on this level is a driving factor behind our function. With a centralized design process and the option to use UI coded components in prototypes, employees from all parts of a product team can collaborate with ease. Check how to connect designers and devs fast. Discover UXPin Merge.

The post 10 Fun Design Team Activities to Try Out in 2023 appeared first on Studio by UXPin.

A strong vision statement drives a design team’s actions while contributing to the product and organization’s success. This article explores how to create an effective design team vision statement, understand its purpose, and analyze real-world examples from leading organizations. We also provide a step-by-step framework for developing and implementing your design team’s vision statement.

Align teams with a shared vision and scale design operations with UXPin Merge. For more details and how to request access, visit our Merge page.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

What is a Vision Statement?

A design vision statement outlines the long-term goals and desired future state for a product or organization’s design department. It provides designers with a clear direction or “north star” and is a source of inspiration and motivation.

Aligning Vision and Mission Statements

A vision statement and a mission statement combine to provide a comprehensive understanding of an organization’s purpose and direction.

The vision statement outlines the desired future state and long-term aspirations, while the mission statement defines the organization’s core purpose and strategies to achieve the vision. These statements create a cohesive framework that guides decision-making, fosters alignment, and unifies teams toward a common goal.

Importance of a Team Vision Statement

Creating a team vision statement helps establish a foundation for Design’s direction and decision-making processes. An inspiring vision statement encourages teamwork, inspires creativity, and drives innovation by fostering a shared understanding of the design team’s goals and aspirations.

This vision statement anchors the team, enabling designers to navigate challenges and focus on delivering high-quality, user-centric solutions that align with the department’s long-term objectives. When properly implemented, a design vision statement is a powerful tool that fuels the department’s growth and success in line with the company’s mission.

The role of a UX strategy in creating a vision statement

A company’s UX strategy shapes the design vision statement by outlining the desired user experience and guiding design principles. Ideally, a company should establish its UX strategy first, as it serves as a blueprint for the design vision statement, ensuring that the design team’s goals align with the company’s vision statement and broader objectives.

How Design or DesignOps Leaders shape a team vision statement

The Design or DesignOps Leader plays a pivotal role in shaping the vision by facilitating collaboration, fostering a culture of innovation, and guiding the team towards shared objectives. They are responsible for translating the company’s UX strategy into actionable goals, ensuring that the design department’s vision aligns with the company’s values and mission.

Understanding the Purpose of a Team Vision Statement

Aligning goals and values

A team vision statement aligns the design department’s goals and values, ensuring that each team member works cohesively and prioritizes the organization’s overarching objectives while staying true to its core values.

Creating a shared sense of direction

A good vision statement fosters a shared sense of direction by providing a clear roadmap for the team, outlining the desired future state, and inspiring team members to work collectively toward achieving common aspirations.

Guiding decision-making processes

The team vision statement guides decision-making processes within the design department by setting a framework that influences choices and actions, ensuring consistency and alignment with the team’s long-term objectives.

Key Elements of an Effective Team Vision Statement

Clarity and focus

A focused and clear vision statement ensures the concise and effective communication of the design department’s objectives, facilitating a unified effort toward shared goals.

Example of applying clarity and focus: “Empowering our design team to create seamless, user-centric experiences that elevate our brand and inspire customer loyalty.”

Inspirational and aspirational

A compelling vision statement is inspirational and aspirational. It must motivate team members to strive for excellence and establish what the design department seeks to achieve.

Example of applying inspirational and aspirational: “Pioneering innovative design solutions that revolutionize the way users interact with technology, setting new industry standards.”

Reflecting the team’s core values

A vision statement should embody the team’s core values, aligning the design department’s actions and decisions with the principles that define its identity and purpose.

Example of embodying the team’s core values: “Championing empathy, collaboration, and continuous learning as we craft user experiences that are both intuitive and impactful.”

Future-oriented and adaptable

A successful vision statement is future-oriented and adaptable. It enables the design department to navigate evolving market conditions and shifting priorities while maintaining a clear sense of direction and staying true to its foundational principles.

Example of incorporating future-oriented and adaptable: “We are committed to anticipating user needs and staying at the forefront of design trends and technology advancements.”

How to Create a Design Team Vision Statement

Gather insights from team members and stakeholders

The first step is to gather input from team members and key stakeholders. This collaborative approach fosters buy-in and ensures your vision statement considers diverse perspectives. For example, conduct brainstorming sessions or use anonymous surveys to gather insights on team goals, values, and aspirations.

Identify common themes and values

Analyze the feedback to identify recurring themes and shared values that resonate with the team. Look for patterns in the input and highlight aspects that consistently emerge. For example, if team members frequently mention empathy, collaboration, and innovation, these values should inform your vision statement.

Define the department’s purpose and aspirations

Use the themes and patterns from step two to define the design department’s purpose and aspirations. This step involves clearly stating the team’s reason for existing and the desired outcomes they want to achieve through their work. For example, your design department’s purpose may be to create engaging, accessible user experiences that drive customer satisfaction and loyalty.

Craft a concise, memorable statement

Craft a concise and memorable vision statement using the insights gathered that encompass the team’s purpose, values, and aspirations. This statement should be clear, actionable, and easy to remember. For example, “Designing user experiences that delight, empower, and inspire, driven by empathy, collaboration, and innovation.”

Test and refine your vision statement

Share the draft vision statement with team members and stakeholders for feedback. This iterative process ensures your vision statement resonates with the team and organization.

Communicate and implement the vision

After finalizing your design team vision statement, share it with the entire team and integrate it into your daily operations. This step involves incorporating the vision into team meetings, goal-setting processes, and decision-making frameworks. For example, display the vision statement in the team’s workspace, reference it during project kick-offs, and use it as a guiding principle for performance evaluations.

Embedding the Vision Statement into Your Design Culture

Here are some tips for embedding your vision into your organization’s design culture:

• Regularly communicate the vision statement with your team to keep it fresh in their minds. For example, you can start team meetings by recapping the vision and highlighting its relevance to current initiatives.
• Incorporate the vision statement into onboarding and training to ensure all team members are aligned. For example, discuss how the vision shapes the design department’s work and decisions during onboarding.
• Integrate the vision statement into performance evaluations and feedback. For example, discuss how a designer’s work contributed to realizing the vision during performance reviews.
• Celebrate successes aligned with the vision to reinforce its importance. For example, when a project embodies the vision statement’s principles, highlight it during a team meeting and praise the team’s efforts.

Vision Statement Examples from Leading Organizations

IDEO

“We believe a better future is for all of us to design.”

Design teams can learn from IDEO’s vision statement by embracing the idea that creating a better future is a collective responsibility. This statement empowers designers to take an active role in shaping the world around them and emphasizes the importance of inclusive design practices.

IBM Design

“IBMers believe in progress—that by applying intelligence, reason, and science we can improve business, society, and the human condition. Given our scale and scope, good design is not just a requirement, it’s a deeper responsibility to the people we serve and the relationships we build.”

IBM’s vision statement reinforces the importance of leveraging intelligence, reason, and science in their work and understanding that good design is a fundamental responsibility. The statement also highlights the impact of design on both business and society, emphasizing the role of designers in driving positive change.

MUI

“We aim high trying to design the most effective and efficient tool for building UIs, for developers and designers.”

MUI’s vision statement focuses on the team’s pursuit of excellence in its tools and processes. This statement highlights the importance of continuously improving and optimizing UI design solutions to serve developers and designers better, ultimately enhancing collaboration and efficiency.

Did you know you can bring MUI components into the design process to create prototypes that look and feel like the final product?

Import any open-source UI library or your company’s design system into UXPin using Merge technology to create a single source of truth across design and development. Learn more by visiting our Merge page.

The post Design Team Vision Statement – Definition and Steps appeared first on Studio by UXPin.

Building a design system is no small feat–but that’s just the first step. Design system maintenance is a continuous operation requiring human, time, and financial resources to evolve and mature it.

UX, technology, regulatory, product, and organizational changes require the design system team to manage and update many facets of the design system. This article provides a high-level overview of maintaining a design system, including its governance, audits, roadmap, and maturity.

Optimize your design system’s operational challenges and reduce maintenance with UXPin Merge. Sync design and development to create a single source of truth, reduce debt, and eliminate drift. Request access to Merge.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

Treat Your Design System Like a Product

In a Medium article, Nathan Curtis, founder of UX and design systems agency EightShapes, said, “A Design System isn’t a Project. It’s a Product, Serving Products.” 

Framing your design system as a product means the design system team must manage several key aspects:

• Marketing: increasing design system adoption, update/release announcements, news, etc.
• UX: creating a good design system user experience (for designers, engineers, product teams, etc.)
• Engineering: writing and maintaining scalable, error-free code
• People management: building a successful design system team–even if it’s a team of one
• Operations: procedures, systems, tools, etc.
• Governance: process and protocols for maintaining and updating a design system
• Customer service: logging support tickets and helping users solve problems with component/pattern recommendations
• Communications: talking to users, advocates, and stakeholders

Effective design system maintenance requires the DS team to create systems and protocols beyond updating pattern libraries to increase the product’s adoption and lifecycle.

For example, if you have an amazing design system with beautiful code and UI elements, but no one is using it, or it doesn’t deliver a return on investment, stakeholders will likely sunset the project or replace team members.

Start With Governance

Maintaining a design system requires good governance. It’s best to define these before launching your design system so that you’re ready to handle any issues and requests.

These are seven key areas your design system governance must address:

• Bug reporting and fixing: how do users report bugs, how do you keep a backlog, and how does the team fix these issues?
• Introducing elements: what is the procedure for adding new components?
• Promoting patterns: how does the design system team decide whether a new pattern is a one-off or best new practice?
• Reviewing and adapting patterns: procedures for ensuring new patterns meet design system guidelines and principles.
• Design system releases: defining a consistent release schedule and quality assurance procedures.
• Design system auditing: how often do you audit the design system, and what are the methods for analysis and reporting?
• Documentation: procedures for updating documentation.

Codifying Your Design System

Design system codification organizes a design system’s UI components into a searchable archive or hub with guidelines, principles, documentation, tutorials, governance procedures, and more.

Here are 11 things to consider when codifying and maintaining your design system’s documentation hub:

1. Display your design principles and values on the design system’s homepage to remind users whenever they visit.
2. A brand style guide is essential for maintaining design and copywriting consistency.
3. The writing style guide provides instructions for all copy, including content, marketing, ALT text, and UX writing–i.e., voice, tone, grammar, slang/jargon/joke/language policies, structure, messages, and labels.
4. Your design system’s best practices include a list of methods, tools, and processes–for example, how to use image assets or which design tool to use.
5. Your design system’s website/hub must have easy, searchable navigation so product teams can find components and documentation.
6. The DS team must provide clear governance for contributing and bug reporting. For example, adding forms on your design system’s website or creating specific Slack channels.
7. The component library must include an example of each component, a code snippet, interactivity guidelines, use cases/implementation, dark/light variations, dos and don’ts, and variations (size, shape, colors, etc.).
8. Your color palette must include a swatch and relevant color codes for each platform (iOS, Android, Web, etc.).
9. Include a complete list of your product’s icons and variations, i.e., outline, circular, color, etc.
10. Display approved fonts with examples for the various styles, like bold, semibold, regular, light, italic, etc.
11. Include a list of tools for design, development, accessibility, and cloud storage.

Correctly codifying your design system will reduce errors, increase adoption, and streamline onboarding.

Design System Audits

Design system maintenance starts with a comprehensive audit–if you don’t know what’s wrong, how can you fix it? Design agency Ramotion provides a step-by-step approach for auditing a design system. This audit will assess the following:

• The design system’s quality
• Identify gaps
• Assess resources
• Analyze consistency
• Update documentation

It’s important to schedule regular and consistent design system audits. This schedule will depend on the size of your design system and available resources. 

1. Step one – Create clear audit goals: where will your audit focus, and what are the desired outcomes (reporting, recommendations, actions, etc.)? Over time, you’ll want to develop frameworks for different outcomes to maintain consistency.
2. Step two – Analyze your resources: the necessary budget, time, and human resource allocation to achieve your audit goals.
3. Step three – Conduct a design inventory: the design system team catalogs the component library’s UI elements, patterns, and templates, including the corresponding documentation. They also catalog policies, principles, brand guidelines, and other parts of the design system.
4. Step four – Categorize UI elements: group UI elements and patterns by categories as they appear in your design system, i.e., buttons, icons, forms, etc. Placing everything side-by-side in categories enables one to visualize the entire design system.
5. Step five – Identify redundant and missing components: completing step four helps identify duplications, redundancies, and missing components easier. For example, you may notice two buttons with slight variations, which could be redesigned into one element to serve both purposes.
6. Step six: – Analyze the visual and typographic elements: this step includes all visual elements beyond your components and patterns, including color palette, images, fonts, etc. Does the system apply these properties correctly, and are there any inconsistencies?
7. Step seven – Perform an accessibility analysis: design system accessibility is the foundation for building accessible user interfaces. Auditors must review accessibility policies and confirm these have been applied correctly across the entire design system. They may also check Web Content Accessibility Guidelines (WCAG) for updates and ensure the design system and its digital products remain compliant.
8. Step eight – Consider the branding guidelines: auditors must assess components and copy to ensure the entire design system meets brand guidelines.
9. Step nine – Create a roadmap for the future: use your findings to create a plan and roadmap to fix any issues from the audit.
10. Step ten – Present your findings: the final step is to present your findings to stakeholders, which may include requesting buy-in for resources to execute your design system roadmap.

Create and Share Your Design System Roadmap

A design system roadmap outlines tasks, milestones, timelines, and deliverables as they relate to:

• Recent releases
• What the DS team is currently working on
• What they will work on next
• Future releases (6-12 months)

At the end of every audit, the design system team must update this roadmap to align with any updates or changes. For example, the product might be undergoing a redesign, so the team must update the component library. The audit will determine which elements the team must update and how long it will take.

A design system roadmap will influence two other important aspects of its ongoing maintenance:

• Changelog: chronologically-dated releases and notes
• Version control: the ability for teams to switch to any available version of the design system

Measuring Your Design System

The DS team must use KPIs to measure the design system and its impact on product development. These KPIs also identify problem areas and where to focus.

For example, if adoption remains stagnant, the team must market it better or interview non-users to understand why they’re not using the design system.

 Some design system KPI examples include:

• Adoption: % of users using the design system and its growth over time
• Debt (UX & Front-end): the design system’s impact on debt
• Efficiency: measure how long it takes for teams to build products using the design system vs. not using it. Also, measure how this efficiency changes over time.
• Time to market: how the design system impacts time to market–again, with the design system and without, and how this changes over time.
• Writing code: how does the design system reduce writing code, and how this relates to adoption over time.

Design System Maintenance – Michael Todd’s Frequency of Function

Design systems Manager Michael Todd describes his “Frequency of Function” in a Medium article about maintaining a SaaS design system with a small team of two.

Daily tasks:

• Lead UI design decisions
• Design system advocacy
• DesignOps facilitation

Weekly

• Collaborate with front-end engineers
• Facilitate design pattern compliance
• Run a design pattern guild
• Tracking and reducing UX debt
• Meet with various stakeholders
• Maintain and improve design tool libraries

Monthly

• Consult on the product’s UI design direction
• Mentor UX designers on systems thinking
• Anticipate future design system needs

Quarterly

• Update style guides and documentation
• Network with product leads and stakeholders

Annually

• Update the design system’s goals and roadmap

Streamline Design System Maintenance With UXPin Merge

One of the biggest challenges with maintaining a design system is managing and updating separate systems for designers and engineers. Designers use UI kits for design tools, while engineers work with a component library hosted in a repository.

UXPin Merge bridges the gap between design and development by syncing a design system from a repository to UXPin’s design editor, so designers use the same UI components during the design process as engineers use for development.

This single source of truth offers several key benefits for design system maintenance:

• Managing one component library–no more image-based static UI kits.
• No designing from scratch–Merge components include properties and interactivity defined by the design system. Designers drag and drop components for an efficient product design workflow.
• Less front-end development work–engineers already have the same pattern library, properties, styling, and interactions.
• No design drift–significantly reducing UX and front-end debt.
• Built-in version control–versioning automatically synced between design and development. Designers can choose when to update and switch to any earlier version of the design system.
• Seamless handovers–enhance workflows to demonstrate the design system’s value, thus increasing adoption while winning resources from stakeholders.

Reduce operational and maintenance redundancies with UXPin Merge–the world’s most advanced end-to-end design tool with sophisticated design systems capabilities. Request access to Merge.

The post Design System Maintenance — How to Keep Design System Up to Date? appeared first on Studio by UXPin.

The design culture examples in this article demonstrate how design-driven companies create positive customer experiences and enhance overall business success.

Creating a good design culture starts with understanding user needs, encouraging collaboration between departments, experimenting with new ideas, investing in the right tools, and developing design team rituals.

Examples from J&J, PayPal, Rexlabs, Google, Revolut, and Dave Malouf demonstrate how these strategies can lead to better decision-making, improved efficiency, and increased innovation.

Build fully functioning prototypes that look and feel like the final product for meaningful feedback from user testing and stakeholders. Create a design culture focused on solving more user problems during the design process with accurate prototyping from UXPin Merge. Visit our Merge page for more details.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

What is Good Design Culture?

Good design culture is the practice of proactively incorporating design principles into the product development process. Incorporating these principles takes a lot of work and collaboration. Design avocates must actively work to integrate design culture and user experience values into the company’s culture and daily operations.

These five key factors characterize good design culture:

• Focus on user experience
• Commitment to researching and understanding customer needs
• Advocating for UX and user needs
• Willingness to take creative risks through experimentation
• Encourage collaboration between disciplines

Creating a good design culture requires commitment from leadership and collaboration between different departments within an organization.

The importance of design culture

Good design culture can significantly impact the success of an organization’s products and services. It allows organizations to create products that are more attractive, easier to use, and better suited for customer needs.

How do you Create a Healthy Design Culture?

Here are five things you can do to build the foundation for a strong design culture.

Focus on collaboration: Design is a collaborative process. Creating a thriving design culture starts with fostering an environment that encourages collaboration between all stakeholders.

Celebrate successes: Acknowledge and celebrate big and small achievements for design initiatives. This acknowledgment helps foster a culture of creativity and innovation.

Foster open dialogue: Encourage an open dialogue between designers, developers, and other stakeholders throughout the design process. An open forum for ideas ensures everyone is in sync with the project’s vision.

Encourage experimentation: Give designers the freedom to try new things and experiment. Like successes, teams must celebrate experimentation–succeed or fail. This autonomy encourages creative thinking while celebrating the attempt and what the organization learned rather than the result.

Invest in tools: Investing in the right tools is essential for successful design projects. Designers must have the hardware, software, and resources to create great work and push creative boundaries.

Implement DesignOps: DesignOps can reduce operational burdens and break down silos that adversely impact morale and culture. The DesignOps mindset, which we discuss in DesignOps 101, takes the same strategies and thinking for design projects and applies it to your company structure and work mentality. 

Activities to Enhance Design Culture

Design team rituals

Design culture must flourish within the design department before spreading organization-wide. Design team rituals are an effective way to instill UX principles, foster connections, and create design advocates within the department.

Some design rituals include:

• Design critiques: designers present ideas and designs for feedback.
• Coffee rituals: scheduled informal meetups to keep designers connected.
• Weekly 1:1s: Design leader one-on-ones with team members to discuss their challenges, work in progress, career path, etc.
• Daily stand-ups: an agile exercise where team members share their daily progress and any blockers/challenges.
• Check-in/Check-out: morning check-in and afternoon check-out rituals foster communication and allow designers to ask for help if needed.

Design sprints

Design sprints foster a culture of experimentation, collaboration, and rapid prototyping. These intensive, focused sessions encourage a diverse team to solve problems using design thinking principles.

Including participants from different departments creates more design advocates while spreading design thinking and user experience principles across the organization.

Design thinking workshops

Design thinking workshops provide an opportunity for non-designers to learn about and practice design thinking methodologies. These workshops encourage a culture of empathy and problem-solving, which are core UX values.

Participating in design thinking workshops teaches team members how to approach problem-solving and innovation with a user-centered mindset, helping to promote design culture within the organization. Design teams can leverage this organizational mindset to encourage cross-functional collaboration for developing ideas for new products and features.

Invite team members and stakeholders to user testing

User interviews and testing are fantastic opportunities to humanize users and create empathy. Usually, only designers and researchers see how users struggle with problems, leaving other departments and stakeholders to question design decisions.

Bringing these parties into user interviews and testing sessions allows them to witness problems firsthand and how design teams use design thinking to solve them.

Design Culture Examples From Six Leading Organizations

Design culture through education at J&J

J&J debuted its design system at a “Lunch & Learn” session where the design team demonstrated how they create interactive prototypes using UXPin Merge.

J&J’s team hosts regular Lunch & Learn sessions where they discuss interactive prototyping and encourage team members and stakeholders to develop their own ideas using anything from basic sketches to high-fidelity prototypes–depending on their available tools and skills.

When team members have a concept to test, they bring it to designers to prototype using the organization’s design system and UXPin Merge. This educational process encourages everyone at J&J to develop product concepts, creating a diversity of ideas and more possibilities for innovation.

DesignOps 2.0 at PayPal

In 2019, PayPal completely reinvented its internal product development process using UXPin Merge. The org’s DesignOps 2.0 creates a single source of truth with UXPin Merge while bringing design and development into a single iterative process.

DesignOps 2.0 educates product teams and engineers about user experience and user-centered principles. Now, everyone in the product development team shares accountability for user experience, including a custom tool to measure UX success in delivering products.

Through DesignOps 2.0, PayPal’s small team of designers has increased their sphere of influence and developed a UX mindset for everyone in the product development process.

Designing a Design Culture at Rexlabs

Yolanda van Kimmenade, a Senior Product Designer at Rexlabs, describes how she and her design team designed a design culture at the software development agency.

Yolanda and her team started by defining the values and behaviors they believed were important to them and the organization, including:

• Collaboration
• Inclusivity
• Continuous learning
• Open communication
• Giving and receiving feedback

Next, Rexlabs’ designers created systems and processes to support these values and behaviors, which included:

• Establishing a shared language and set of tools for communication
• Setting up regular check-ins and feedback sessions
• Creating a system for sharing knowledge and resources within the team

Yolanda emphasizes that design culture isn’t static. The design team must revisit and adjust the culture as the organization and products evolve. Rexlabs’ designers created a positive and productive work environment by continuously aligning their culture with their goals and values.

Rexlabs’ design team spread these values through a design ritual called “Scribbles.” 

“We meet every Wednesday for ‘Scribbles’ — alternating in-person and remote meetups. We discuss topics of interest, give each other feedback on designs (e.g., user research insights, user flows, or WIP designs), and have a delicious coffee…During one Scribbles session, the topic turned to our frustrations about processes that needed improvements. Anton Babkov (our head of design and CEO, who gives us business insights and support), suggested we document these challenges and decide how we’re going to tackle them.” – Yolanda van Kimmenade, Senior Product Designer at Rexlabs.

This discovery from Rexlabs’ CEO was made possible by the company’s strong design culture that welcomes giving and receiving feedback.

Building a Better Design Culture at Google

Mike Buzzard, a Design Manager at Google, argues that a strong design culture leads to increased innovation, customer satisfaction, and overall business success.

Mike suggests three key strategies for developing a healthy design culture:

• Establish clear design principles and apply them throughout the company, so team members understand the organization’s design philosophy and how to make design decisions
• Invest in ongoing design training and education for all team members to foster continuous learning and improvement
• Encourage collaboration and communication to create a sense of community, so that team members feel invested in the success of the organization’s design efforts

“I do think Google can become more design-oriented. Signals of that would be in the vocabulary engineers use when talking to designers about their work, or even just a top-down, bottom-up sort of comfort in understanding how design influences the company’s products and culture… The number of people working in UX at Google has multiplied over the last 5 years—that magnitude of growth is partly why we created a team dedicated to UX community and culture, to ensure the health and success of UX across all of Google.” – Mike Buzzard, Design Manager at Google.

Creating a strong design culture at Revolut

In a 2020 Medium article, Lucas Vallim discusses how a strong design culture can lead to better decision-making, improved efficiency, and increased innovation.

Lucas says you must first understand the role of design within the organization and how this fits into the overall business strategy. Conversely, the company must prioritize design and invest in design talent and resources. Additionally, the company should foster a collaborative and inclusive design process and encourage open communication and feedback.

Lucas argues that building a design culture on these values helps the organization better understand its customers while creating more effective and satisfying products.

Using Holistic DesignOps for enterprise design culture

In an informative UXPin webinar, long-time DesignOps advocate Dave Malouf describes how a holistic DesignOps strategy creates a design culture beyond the design team.

Dave argues that the foundation for a holistic design culture starts with communication and collaboration, which helps everyone in the organization understand design, its principles, needs, areas of influence, and potential.

Dave describes three pillars for holistic DesignOps:

• Delivery operations: how to get things delivered by optimizing efficiency, velocity, and cost reduction.
• Practice operations: The people, spaces, methods, and tools that make it possible for designers to design.
• Business operations: Streamlining organizational bureaucracy from finance, IT, procurement, compliance, legal, etc.

Revolutionize your design workflows and bridge the gap between design and development with the only design tool built to solve modern DesignOps challenges. Discover Merge.

The post 6 Design Culture Examples and How to Create Your Own appeared first on Studio by UXPin.

Any design team needs to know exactly what they’re working towards. Without this, it can be easy to lose focus on the critical aims and goals of their work and projects.

Design team goals are a great way to ensure your team is on track to completing the right tasks and to help productivity and focus throughout the whole team. It can sometimes be hard to know how to correctly set goals, however.

At UXPin, we believe that any design team should be able to work to their full potential. That’s why in this article, we’re going to go over the ins and outs of design team goals, and how to set them. Give your team transparency, ease of work, and understanding by trying out component-driven prototyping. Get access to UXPin Merge and break silos between design and development teams right away. Discover Merge.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

What are design team goals?

Design team goals are set milestones that your designers are expected to achieve in a given time. 

Instead of being specific, a ‘design team goal’ can be fairly broad. The term is frequently used for both larger objectives and smaller tasks, which can lead to confusion. Instead, the consensus is that OKRs (objectives and key results) are the way to go about goal-setting and hitting milestones. 

OKRs are used by many top tech brands and other organizations like Nielsen Norman Group to create goals, evaluate and track progress, and reward achievements within their organization.

The OKR structure is clear and simple and is designed to be straightforward for ease of communication and understanding.

• An Objective (O) is something that needs to be solved, improved, or achieved for success.
• Key Results (KR) are measurable indicators and outcomes tracked to show that the problem has been solved. 

OKRs are popular due to how great they are at unifying a team towards a goal and help stakeholders understand what the team wants to achieve.

With this structure, product teams are more likely to work more efficiently and productively towards a target. If they have a tangible target that they can see to attain, they can move towards it and ensure they’re on the right track.

Design team goals are set to enhance collaboration, refine your processes, and help unify your team. OKRs are the best approach for achieving your aims and getting solid results.

Here, we will use this methodology to show you how design team goals can be set to support collaboration, optimize the design process, and foster belonging throughout your team.

Why is it important to set goals for your design team members?

• To help motivate your team by giving them tangible purpose: By giving your team attainable goals, you help motivate them to produce high-quality work, as they will feel as though their work has a purpose. Otherwise, their work can meander and feel like it’s not contributing to anything positive.
• To enhance productivity and the quality of collaboration: By giving your design team clear goals, you help them focus much more easily towards achieving them. With this, productivity and the quality of work increase, and team collaboration creates far better results.   
• To make sure your designers’ work supports company objectives: Making sure your team is working towards the success of your startup or enterprise organization is key. OKRs are ideal for this, as they are the best ways to ensure that your team is working positively in this direction.  

6 examples of design team goals

Improving the user journey

The following example is inspired by Nielsen Norman’s Anna Kaley’s example OKR of working towards improving the experience of customers and prospective buyers. You can measure this through different indicators — this example uses metrics, such as repeat purchases, conversion rates, and journey path abandonment rates.

Objective: Improve the user journey to save people time and effort

• KR (Key Result) 1: 25% more repeat purchases
• KR 2: 20% higher conversion rate
• KR 3: 30% lower user journey path abandonment rates

Improving design–development collaboration

This example’s objective was set for three months and was based on collaboration and workflow. The Key Results are based on making collaboration more efficient and simple to save time.

Objective: Improve the workflow between design and development to save more time

• KR 1: Reduce design task tickets reopened by development from 40 to 10%
• KR 2: Reduce the average time of “small improvements” resolved from 10 days to 3 days
• KR 3: Increase submitted design requests going into execution from 50 to 80%

Introducing new design processes that support team growth

The next example comes from Lattice. Their design team expanded from six to 39 designers over two years, which led to the company deciding to reevaluate the ways they set goals. 

Lattice’s Staff Product Designer ran an annual retrospective, which helped them set three key objectives for the upcoming year. Each objective was established and their respective teams worked to make four key results, one for each quarter of the year. The following example is one of these objectives:

Objective: Evolve processes to keep pace with team growth

• Q1: Audited our Brand and Product rituals and proposed adjustments 
• Q2: Drove more frequent design feedback and context sharing (by 2x!) 
• Q3: Created templates for easier context sharing
• Q4: Defined processes for brand + product design collaboration

Boosting landing page performance

GTMHub shared the following example based on turning ‘output into outcomes’, this one specifically being centered around improving landing page performance. With this set goal, you can have a certain percentage or number to reach, which can help your team track their performance and can push them when necessary.

Here, a specific team or subset of the design department has been assigned OKRs to help them prosper at this specific task. Their OKR examples include:

Objective: Boost performance through landing page UX/UI

• KR 1: Double CTA conversion to 16%
• KR 2: Increase page navigation rate to 5%
• KR 3: Double product image gallery open rate to 24%  

Make design language consistent

Here, Delivery Hero-Talabat’s Amber Jabeen talks about Delivery Hero’s team struggling with their design language. As it was incredibly confusing and inconsistent, their team found it hard to keep productive and efficient with its mess. So, their team took the challenge to improve it.

The video below covers this process in-depth. It shows the benefits of taking time to improve their design language consistency so everything and everyone is on the same page.

#6 Take control of project intake

In this example, Amazon/Alexa Senior UX Designer Omkar Chandgadkar talks about his aim to take more control over his impact on company operations, from what was a more passive approach to design projects’ intake beforehand. By using goals to change his approach, he managed to make a shift and stay focused on his goals and achievement.

His process here was to move his approach from tactical to strategic, which is a great goal for teams to take more initiative regarding their design work. Certainly, it will affect their design skills as well and contribute to their personal development.

He goes over the full process in this great video.

How do you support your design team in reaching their goals?

As well as setting clear goals and objectives, a great way to support your team is by taking the initiative to reach out and assist them. This includes allowing and ensuring they have access to the right tools. Especially, those that can help enable their productivity while supporting team-wide collaboration and accelerating their work. 

UXPin Merge unlocks your design team’s potential, allowing them to work more collaboratively and efficiently to result in maximum goal achievement. With Merge, designers can bring interactive components into UXPin and work faster and smarter without duplicating work. 

Collaboration is important to any team, and Merge is great for working with your team clearly and quickly. By being able to keep consistency, you can ensure that everything is well-oiled and there’s no confusion as to how systems and components are applied and implemented.

Merge is a great way to strengthen your team — as giving them more transparency, visibility, and understanding will create better design culture and better product design-development team collaboration.

Enable Your Team’s Productivity With UXPin Merge

Design team goals help establish focus and motivation within your team. OKRs make it easier to refine your design and boost the effectiveness of your end product. By creating clear goals, you can ensure that your team is working towards positive outcomes and can overcome crucial DesignOps challenges. 

However, OKRs can’t effectively be achieved without tight communication and team collaboration – especially when there’s a disconnect between your UI and UX design and product development teams.

That’s where UXPin can help. Our prototyping tool allows you to design with the same components that devs use. This helps break down limiting team silos. With UXPin Merge, you can create hi-fi prototypes of products on the fly and understand the actual user experience of the product you’re creating. 

Discover UXPin Merge and see how you can supercharge your team collaboration.

The post Design Teams Goals and How to Set Them [With Examples] appeared first on Studio by UXPin.

Workshops and design sprints are standard in most design processes. These collaborative exercises allow design teams to get valuable input from multiple departments and stakeholders.

Design facilitation provides the essential planning and framework to ensure these exercises deliver successful outcomes. Facilitators must guide team members through various tasks and activities to achieve the activity’s goals and define the next steps.

Use workshop insights to produce fully functioning prototypes to test ideas and hypotheses. Sign up for a free trial to build your first interactive prototype with UXPin.

Build advanced prototypes

Design better products with States, Variables, Auto Layout and more.

Try UXPin

What is Design Facilitation?

Design facilitation involves organizing collaborative activities like design sprints, UX workshops, ideation sessions, etc., to ensure the exercise meets its desired goals and objectives.

Rather than telling people what they must do, design facilitation provides the framework (tools, resources, methodology, parameters, and environment) for the activity to achieve successful outcomes.

These can be designer-only exercises or cross-functional activities where other departments and stakeholders come together to solve design or product problems.

Design Facilitation Skills

These are some of the skillsets of a design facilitator:

• Planning: design facilitators plan and execute events, often involving hiring venues, PA equipment, catering, and other service providers beyond the actual workshop or sprint activities.
• Public speaking: facilitators must be comfortable speaking to a group and, most importantly, capable of disseminating instructions.
• Problem-solving: no plan is perfect, and things often go wrong when planning events. Design facilitators must be problem solvers with contingency plans for any eventuality.
• Enthusiastic/charismatic: people often don’t want to take part in workshops–they do it because they have to. Great facilitators must have the energy and enthusiasm to draw people into the process and encourage participation. 
• Communication: facilitators must articulate information and instructions in multiple mediums (verbally, in writing, visually) so that people understand what to do.
• Active listening: as good communicators, design facilitators use active listening when engaging with participants to make people feel like their feedback is valued.
• Design thinking: a design facilitator must understand design thinking, as many workshop/sprint tools, processes, and frameworks use these foundational user experience principles to achieve desired outcomes.

What does a Design Facilitator do?

Design facilitators are responsible for planning, running, and synthesizing results for design exercises. Here is a basic outline of the design facilitation process from planning to completion.

Engages in early planning

A design facilitator’s first step is understanding the primary goal and deliverables. This information will help determine the format (workshop, design sprint, etc.), tools, environment, and people needed to achieve the desired outcome.

The facilitator meets with design leads and stakeholders to define the purpose and goals of the activity. They use this information to determine other elements, including:

• Outlining an agenda to meet goals and objectives
• Identifying facilitation tools, frameworks, and resources
• Choosing the appropriate workshop exercises (how might we, the 5 whys, storyboarding, collaborative prototyping, etc.)
• Listing the roles (i.e., UI designer, UX designer, product manager, front-end developer, business manager, etc.)

Next, the facilitator sets a date, selects the team, and books a location suitable for the exercise, keeping in mind that this might be a remote activity–for example, a remote design sprint or remote UX workshop.

Selects the team

The size of the team will depend on the exercise. For example, most workshops vary between 7-15 people, while design sprints generally have no more than seven participants.

Design workshops and sprints typically include a cross-functional team with designers, business experts, product managers, engineers, and other stakeholders. The aim is to get diverse perspectives and ideas for the problem you’re trying to solve.

Plans location and logistics

Ideally, the facilitator wants to book a venue close to the participants. This venue might be in the company’s offices or event space nearby. Facilitator Sara Yahyaoui offers three vital tips for selecting a workshop venue:

1. Visit the location ahead of time to see if it’ll suit your workshop’s needs–at the very least, request images and video to explore the space remotely.
2. The venue must have walls, windows, and whiteboards for post-its, storyboarding, paper prototyping, etc.
3. Workshops and sprints require people to move around freely. Sara’s rule is 2-3 chairs for every participant. If you have 30-40 people, ensure the venue has a 100-seat capacity.

Invites team members

Team members usually get advanced notice about the workshop’s date, location, and purpose.

Expert facilitator Dee Scarano from AJ & Smart recommends waiting until a few days (maximum seven days) before introducing yourself, the tools, schedule, etc., so that the information is fresh in people’s minds when they arrive.

Dee’s welcome email includes:

• A brief introduction as the facilitator and her role in the upcoming workshop–i.e., Hi, I’m Dee. I will be the facilitator for the design workshop on July 10.
• A Loom video introduction saying hi to everyone (a personal touch we love).
• Outline the schedule, including the length of the session(s) and any pre-work/homework exercises.
• If it’s a remote workshop, Dee will notify people of the tools (digital whiteboard, video application, etc.) and even share YouTube tutorials showing people how they’ll use these.

Dee’s Pro Tip: If you’re using tools, create a warm up exercise to familiarize them with it. For example, Dee sends a link to a digital whiteboard with post-it notes for participants to fill in their names, roles, and fun a question (i.e., what you learned from your first job ever?).

Dee’s warm up exercise gets people using the tool so they’re familiar with the basics when they arrive for the workshop.

Facilitates the session – welcome and introduction

The design facilitator’s first important task is to start on time. If people are late, you can fill them in during the first break and see if they have any questions.

Tips for opening a workshop:

• Introduce yourself as the facilitator and your role during the proceedings
• Venue formalities–closest toilets, beverage station, break times, meal times & location, and other venue-specific instructions
• Workshop rules–i.e., how to ask questions, not speak over one another, be respectful of ideas, collaborating, etc.
• Introducing each team member (people can do this themselves by stating their name, department/organization, and workshop role)

Facilitates the session – explaining the exercises

With formalities out of the way, it’s time to introduce people to the schedule and exercises. Having run hundreds of workshops, Dee Scarano from AJ & Smart has a simple formula to ensure everyone understands the activity and objective:

• What you are going to do
• Why you are doing it
• How you should do it

For example:

• What: we’re about to do concept sketching
• Why: we’re all going to make individual concept sketches so that we can look at a diverse range of ideas and make a final choice
• How: use a sharpie marker and a piece of paper. Look at previous examples and inspiration and sketch your version of a concept idea clearly on the page

People absorb information differently, including verbal, written, and visual instructions, so offering multiple versions will ensure everyone understands the activity and objectives.

Dee’s Pro Tip: Only give one way to complete the exercise. Through hundreds of workshops, Dee has learned that people produce the best results with specific step-by-step instructions rather than allowing them to do what they feel is best.

For example, participants must “use one sheet of paper and a black marker” for concept sketching instead of “use as many pages as you like and any colors you prefer.”

Facilitates the session

Here is an outline of a design facilitator’s responsibilities once the session is underway:

• Keeping to schedule: an essential task for any facilitator is ensuring everything runs on time, including activities and breaks. The facilitator must always set time limits for exercises and tell participants an exact time–for example, “we have 30 minutes for sketching. You have until 14:30.” Using a centralized clock or timer will help keep everyone in sync.
• Encourage participation: the aim of inviting a diverse team is to get different ideas. Facilitators must encourage everyone to participate. One way is to ask a team member’s perspective based on their expertise–i.e., to an engineer: does this idea align with our product’s technical constraints?
• Discussions and debates: design facilitators must balance free-flowing conversation and ideas with closure to keep things moving toward the workshop’s goals. They must recognize when discussions are too long or irrelevant and push participants to a conclusion–for example, voting on the best solution.
• The decider: a common role for design sprints (but also useful for workshops) for final decision-making–often when there are two strong choices or disagreements. The decider is usually a product owner, CEO, or another high-level stakeholder familiar with the product/project.

Wrapps up and synthesizes the results

At the end of the workshop or sprint, the design facilitator must summarize and document the results with the group, so everyone agrees with the outcome and deliverables. The team might also discuss possible next steps.

Document the workshop by:

• Take pictures of everything and upload them to a shared drive. 
• If you use physical whiteboards, copy the final results to a digital whiteboard (Mural, Miro, Google Jamboard) for future reference.
• Writing a summary report about the workshop and its outcomes.
• Schedule a follow-up session for feedback and progress.

Improve Your Design Facilitation Skills

These resources offer facilitation techniques to improve your skills as a facilitator:

• Workshopper: a vast library of facilitation resources and templates for product design and UX from AJ & Smart
• Facilitation Lab: a weekly virtual meetup from Voltage Control
• International Association of Facilitators: a “global community of facilitators promoting excellence in the use of professional group process facilitation to create engagement and impact.”
• A list of 21 facilitation and workshop books

Use Workshop Insights to Prototype in UXPin

After most workshops and sprints, the next step is to produce a high-fidelity prototype or MVP to test and iterate. UXPin’s advanced end-to-end design tool enables design teams to build prototypes that look and feel like the final product.

With built-in design libraries, designers can go from concept to fully functioning prototype fast! They can use these immersive prototypes that produce meaningful, actionable results from user testing and stakeholders–allowing product teams to iterate faster than traditional image-based design tools.

Turn your workshop ideas into fully-functioning prototypes with the world’s most advanced design tool. Sign up for a free trial to explore UXPin’s features today!

The post What is Design Facilitation and How to Host Your First Session? appeared first on Studio by UXPin.

Design leadership isn’t about micromanaging every little step. Rather, a good design leader is able to provide impactful direction for their team. How exactly does a design leader encourage a positive and meaningful product design work environment?

Let’s start by taking a look at the key steps to take for managing a design team successfully and what to avoid when building a cohesive team.

If you’re looking for a prototyping tool that will help your team to optimize their workflow and communicate better, we have something for you. Try UXPin Merge, a powerful technology that makes your team achieve a higher level of design maturity in no time. Read more about UXPin Merge.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

Start with a design department audit

Just like you start with auditing UX design, look back at your design team goals. Having a roadmap in place will help you more clearly see what you need to achieve in regard to design goals at your organization. This roadmap will help you get there with fewer bumps in the road.

Your next step will be to audit your design team structure as a whole. You’ll want to take inventory of who you have on your team and confirm what their strengths and weaknesses are. Taking stock of these things is helpful to see if you have enough team members with the appropriate skills needed to achieve company goals.

Team meetings are an excellent way to gain a deeper understanding of your team as a whole. Furthermore, a design team audit will go a long way in determining how well overall day-to-day operations will go. 

Auditing will help crystalize your team structure and will help to specify the role of all team members and the capacities in which they are expected to complete their roles. Clarity helps give everyone a higher sense of purpose and consistently set them to task without confusion or hold-ups.

Identify and acknowledge your wrongdoings 

As a design team leader, you’ll need to apply an honest mindset when managing your team. Inherent assumptions and old assumptions are par for the course when working in a leadership role, however, external output is extremely valuable when working in a close team atmosphere.

Don’t be afraid to ask for external input in the form of team member feedback. This could be an anonymous survey or an all-hands call to gather information from those you work with every day.

While it can be tough to hear difficult feedback, taking direct note of such input will only help strengthen your team as a whole. Poor leadership manifests in a variety of different ways. Maybe your team has expressed that you repeatedly fail to set clear goals for the team or perhaps you tend to micromanage employees.

Whatever the shortcoming may be, be willing to identify and acknowledge where you can use a little work as a design lead. No one is perfect, you and your team members included.

Write a plan on what needs to be done

Equally as important to a successful team as improving leadership style and making a plan are the factors related to project management. This goes hand-in-hand with design audits. Questions you’ll want to take stock of: Do you need to hire more people? If so, can you tell which skill gaps in your current team structure need to be filled? 

An adjacent item would be to run a skills gap assessment. Ask your team members what skills they feel good at. By requesting directly, you’ll likely find skills that weren’t readily apparent or might come in handy for future design projects.

During any one-on-one or group meetings with your team members, you can ask them about the skills they’re determined to develop. This will help you plan out how their desired career path can integrate with the competencies of your design team as a whole. Offer ways for your team members to hone and develop their skills in order to close any skill gaps. 

During the planning stage, it’s important to note if you’re successfully building the design team during the recruitment and hiring process. Take note of any areas in which you might be falling behind. Ask yourself:

• Are you seeing a high candidate drop-off rate? 
• Do your new team members continue to ask repetitive questions during the onboarding process? 

Consider these questions and other potential improvement areas such as task distribution, management of workload, and consistent performance. 

Decide how you will measure the results

Once you’ve taken stock of these items and implemented specific changes, you’ll want a solid plan as to how you’ll be evaluating said implementations. You’ll need it to measure whether or not the changes you’ve implemented have been successful. 

When assessing the overall success of your results, ask yourself:

• Did you solve the problem? – Design isn’t simply graphics and color palettes. At its core, it’s all about facilitating interactions and problem-solving through creative channels. If you identified a real problem (such as poor employee retention) and provided a better solution (more open communication and feedback) then you can count that as a success.

• Did you improve the process? – Design doesn’t always have to be about supplementation. Rather, you might identify steps that were redundant and unhelpful during your research. Good design leadership might also mean cutting down or taking away what isn’t working. If you made a process more efficient through various channels of development, then congratulations, pat yourself on the back. Another success!

• Did you open yourself for feedback? – Design success is just about the personal growth of employees and management alike. This can be shown through effective communication. A difficult skill to master, accepting feedback and open communication is one that every good leader should have. Shelve your pride and open yourself up to honest feedback. You and your team will all be better for it. 

The recommended measurement methods will depend on the specific area you’re planning to improve. For example, if you were hoping to measure your own design leadership qualities, you could run a quantitative survey like an employee Net Promoter Score which is a metric that helps gauge how employees feel about the place at which they work.

Running surveys like this allows you to see how your score has changed over the course of three or six months. This is simply one avenue you can take but it is a common way to look at employee satisfaction.

For example, perhaps you want to improve your team member retention rates and avoid employee turnover. After taking the necessary steps needed for proper employee retention, you can measure how the average tenure has changed since the implementation of certain action items.

Or maybe you’d like to measure the number of tasks your team was able to successfully complete within a 2-week timeframe, you can compare these metrics on a bi-monthly basis. Measurements can be approached through Fibonacci sequence points which provide a realistic way to approach a variety of influencing factors.

Start transformation processes 

Now you’re able to start streamlining how design teams work. Encapsulating the above steps and implementing them might look as follows:

• 1-on-1 meetings: holding one-on-one meetings are a great way for team lead and team members reports to connect individually on pressing issues and develop strong relationships. They also help ensure that employees feel like they’re valued contributors of product teams and that they are working successfully toward goals as well as improving their skill set. One-on-ones should not be used as status updates, rather, they should serve as a platform to give regular feedback and foster career growth and learning new skills.
• Daily standups: whether you call them daily stand-ups or team huddles, the idea is the same. You want your entire team to feel informed and connected. This helps measure progress, highlight necessary areas of improvement or outstanding issues, and where the team stands in terms of work completed. 
• Team building activities: a variety of activities exist to help build morale and spark teamwork. They’re helpful exercises for bringing communication to the forefront and allowing a free flow of product team collaboration and an encouraging the best work atmosphere. Team building helps product managers and employees alike learn more about each other outside of a traditional workplace setting. Your activity might be something fun and engaging like an escape room or a day at the golf course. 

Growth and collaboration are crucial to a team’s success. As outlined in the first pillar of our DesignOps eBook, the well-being of a team of designers should be at the forefront of your management plan. The above steps are simply a few suggestions that can help your team thrive and feel cared for.

Don’t miss out on the power of iterations

Growth isn’t a linear process. Remember to check in with the members of your team on a regular basis. This will help you see what seems to be working and what techniques haven’t quite landed. Allowing you to pivot from there. 

Again, ask your team members for honest feedback. This can be done either during face-to-face meetings or in a survey. Fostering an openly communicative environment is ideal for a well-running design process and product development workflows. Employees that feel noticed ultimately feel valued. Remember to focus on clear points of action, rather than generalities. Drill down to specifics and everyone will be better for it.

If you decide to go the survey route, make sure not to overdo the frequency. Firstly, the time frame in which you’ve gathered data might be too short to draw relevant conclusions. Secondly, you don’t want to ask team members to evaluate your decisions on a frequent basis, as it could come across that you’re unsure of your design leadership capabilities. Be sure of the direction you’re taking as a design lead and your team will appreciate it.

Iterate and experiment with improvements to your team collaboration and design team management methods. Remember: proper design team management is a marathon, not a sprint. Cultivating a good team takes trial and error.

Lead your team to success

The first pillar of design operations deals with the core of a good business: people. If you want to support your people, you need the right tech stack for the job.

UXPin Merge is such technology. It allows your team to bring your devs’ interactive components to the design editor and build prototypes that are easily understood by stakeholders, product managers, and above all else, developers. Bridge communication gap and strengthen the workflow in your organization. Read more about UXPin Merge.

The post How to Manage Design Teams (Effectively)? appeared first on Studio by UXPin.

Design systems can be very confusing and complicated if you don’t fully understand the terminology associated with them. It’s important for designers and developers alike to be on the same page for the most effective communication efforts. 

For this reason, we have comprised some key terms along with associated applications and examples to provide a clearer understanding of design systems.

UXPin helps you build interactive prototypes and manage design systems like no other prototyping tool in the market. Build consistent interfaces 10x faster and speed up development that stays in line with your designs. Manage a complete library of interactive elements in UXPin Merge. Find out more about it.

Design System 

Definition: A design system is a set of standards, best practices, components, and rules that define a design project’s approach to creating websites in a certain style or brand identity. A style guide, for example, is often included as part of the design system. A pattern library of samples and the real assets – fonts, images, CSS frameworks, JavaScript libraries, and so on – all components needed to complete the final product.

Application: Front-end developers and designers use these to replicate designs through pre designed components and elements. The elements can be repeated and reused, which saves teams a ton of extra time. By including guidelines within these systems, some entry-level designers may find them as useful educational references.

Examples: Google Material Design, Atlassian Design System, and other design system examples.

Related resources:

• Comprehensive guide on Creating a Design System
• eBook on building Design Systems quickly
• How to create a design system roadmap?
• Design Systems in UXPin

Components 

Definition: Components are the building blocks of a design system. They can be small (e.g., buttons, icons) or large (e.g., navigation systems, carousels). A core aspect of components is that they’re designed to be as simple yet as flexible as possible so that they can be used in multiple instances.

Application: Companies use/reuse components to create patterns within their systems and to improve user experiences. Overall, components improve the quality and effectiveness of workflows. Many design systems will have component libraries that help designers and developers share UI elements that have interactivity and responsiveness build into them. 

Examples: buttons, footer, carousel, etc.

Related resources:

• What is component-driven prototyping?
• MUI components
• Top 5 UI Components in Atomic Design
• Supercharging UI components in UXPin
• Creating UI components in UXPin

Design System Principles 

Definition: A design system requires a governing model that acts as a set of rules. These are required to manage all components within a project. They might pertain to visual design (e.g., animation, colors, typeface) or refer to a more complicated aspect of a project, like the personality or style of the branding or writing.

Application: These act as guidance for decision-making processes through preset standards to be followed throughout a design system. They help keep design teams on track and moving in a consistent direction. Teams commonly follow them for advice on how to achieve goals. An effective foundation will provide a clear framework for the team’s ideal system. 

Related resources:

• Design System Principles
• USWDS Principles
• UX Design Principles

Single Source of Truth

Definition: A single source of truth is a reference point between designers and developers that help them make their product consistent. Design systems, or particularly component libraries serve as a great single source of truth that product designers, product managers, and devlopers can use when building products.

Application: Teams that struggle with removing silos, front-end UI debt or misalignment can develop a single source of truth as the first attempt to bring the whole team closer. They start with building coded UI component library that they can share across the whole product development process. 

Related resources:

• What is a single source of truth?
• TeamPassword’s struggle to consistency

Prototypes 

Definition: A prototype refers to a sample version of a product (or its specific aspect), used by designers to test the solution out before launch. It is used to test or de-risk ideas, simulate the final product, address any assumptions, and eliminate concerns towards any other elements of its conception quickly and inexpensively. This allows the designer/s to work on the project, making modifications or adjustments in direction on the end goal if necessary.

Application: Designers will commonly use prototypes to test their product and gain user feedback during an initial trial period prior to an official launch taking place. This helps them save money by testing the product for inefficiencies, which saves time and resources in the long run. 

Examples: high-fidelity prototypes vs. low-fidelity prototypes, mockups

Related resources:

• eBook The Ultimate Guide to Prototyping
• What is a prototype? A guide to functional UI
• What can help you create interactive prototypes?

Component Library 

Definition: A component library is a collection of UI components that can be reused across multiple projects. It typically includes code, documentation, and guidelines on how and when to use each component.

Application: Component libraries help ensure effective communication and collaboration between teams. They provide a quick access point for reference guides and stored, reusable components. Front-end developers can use these to help reduce cross-browser and cross-device incompatibility. In addition, component libraries eliminate the need to convert design to code, which lowers code duplication. 

Examples: MUI component library, Ant Design component library, Bootstrap component library,

Related resources:

• Storybook frameworks you can use to build component libraries
• React component libraries to use
• PayPal’s prototyping process with components

Material Design 

Definition: Material Design is a visual language that Google developed in 2014. It’s based on the principles of how materials exist and interact in the physical world. Many companies have since adopted Material Design as their design system of choice.

The language aids in the development of digital experiences for platforms like Android OS, iOS, Flutter, and websites. The structure makes the technique for creating components such as grid-based layouts, animations and transitions, padding, responsive compositions, dimensional depth effects, and more straightforward.

Application: Material Design is used by designers to optimize the user experience through 3D effects and lighting/animation features in GUIs. The approach helps eliminate confusion among users and provides consistency. For designs, it’s a key feature for animations and getting feedback on graphics. 

Related resources:

• UXPin’s Material Design UI kit
• Motion and interactions in Material Design
• Rules of Material Design
• Material Design Library

Design Language 

Definition: A design language is a set of rules, guidelines, and best practices that govern the design of a product. A strong design language will make a product more consistent, cohesive, and easy to use. It also defines the overall visual identity of a brand.

Application: Design language helps teams follow a specific set of rules and methodologies. It makes the design process run smoothly without inconsistencies or unnecessary confusion. By creating a set of standards to follow, users can feel more comfortable navigating designs that feel familiar to them. 

Example: Apple’s human interface guidelines are a design language that governs the design of all their products.

Usability 

Definition: Usability measures how easy it is for users to accomplish their goals when using a product. A product with good usability is tested through five criteria – learnability (i.e., a soft learning curve), efficiency, satisfaction (how satisfied users are after interacting with it), memorability, and the number of errors users make.

Application: Usability helps designers and developers measure how well they are adhering to the needs of their users. It is an approach that assesses the effectiveness, efficiency, and appropriateness of a system and helps to identify how easily users will be able to solve any potential problems on their own. 

Related terms:

• 10 usability heuristics
• What is usability?
• Basics of usability tests

Typography 

Definition: Typography refers to the practice of arranging type (letters and text) to ensure the copy is clear, aesthetically attractive, and supports the content and design. Variables within typography include font size and style, as well as spacing and the length of copy on a line and page. 

Good typography should be invisible—the user should be able to focus on the content, not the typeface.

Application: Good typography carries a myriad of benefits for designers and developers. It is perhaps one of the most important elements of a design system and helps communicate things like tone, sentiment, and the overall message. Typography will typically be used to draw a reader in while providing legibility. 

Related resources:

• The web typography checklist
• Typography tips for product designers
• Using local fonts in UXPin

Icons

Definition: Icons are visual symbols that represent a concept, action, or object. They can be used to help users navigate a product or to provide additional information about a particular element on the screen.

Application: Designers use icons to help users quickly navigate through a system with graphical representations. Icons are a great tool because they help free up space for other things since they’re typically quite small. They’re also an ideal tool for marketing efforts to add visual appeal. 

Examples: Material Design Icons

Related terms:

• Icon design tips
• Icon libraries in design system

Spacing 

Definition: Spacing is the use of empty space to separate elements on a page. Good spacing can make a product more legible and easier to use. Spacing can be implemented across all aspects of a product, from the margins and gutters to the spacing between lines of text.

Application: Clear and concise spacing helps developers and designers maintain an aesthetically pleasing atmosphere for users. Spacing is typically very deliberate in the way that it is placed throughout a system. It allows for things like optimal readability, consistency, and harmony across a design system. 

Grids

Definition: Grids are a system for organizing content on a page. They can be used to create structure and hierarchy or to divide a page into sections. Grids can be implemented in various ways, from simple columns to more complex multi-column layouts.

Application: Grids help designers develop a user-friendly system that’s low-cost and provides consistency across multiple devices. Grids are typically designed in one spot then reproduced in other areas of a design system. Overall, they’re a great tool for designers to use for organizing information and providing precision.

Style Guide 

Definition: A style guide is a document that outlines the rules and guidelines for the design of a product. It includes information on typography, color, iconography, and more. A style guide is an essential tool for maintaining consistency across a product. It’s a must-have if you’re working on a design system. 

Application: Style guides are generally used for entire teams to work together more cohesively. It allows designers, project managers, and developers to stay on the same page with project expectations. In addition, teams can utilize style guides to quickly transition new hires and get them up to speed with a particular project. 

Examples: WIx Style Guide

Related resources

• Style guide vs. design system, etc.
• How to go from style guide to interactive design system
• Style Guides.io

UI Kit 

Definition: A UI Kit is a collection of graphical user interface (GUI) elements that can be reused in digital products. A UI Kit typically includes buttons, icons, input fields, and other basic elements that can be used to build user interfaces.

UI kits usually come from companies or design teams who want to share their work with others. They can be a great starting point for new projects or a way to speed up the development of an existing project.

Application: Most commonly, UI kits have two primary uses, which include prototyping and mobile and website design. They’re especially useful for rapid prototyping where design functions are shared with developers, stakeholders and designers while a design is still in production. UI kits are especially useful for designers with no coding experience. 

Examples: Apple UI Design Kit, Microsoft UWP

Related resources:

• Using UI kit in UXPin
• Create mockups faster with UI kit

UI Patterns 

Definition: Patterns are recurring solutions to common problems. They can be used to solve design challenges in a variety of ways, from layout to interaction. Within most design projects, patterns will be used to help with the structure and flow of the product.

Application:  Patterns are commonly used for better consistency and for saving time by helping a team run more efficiently. By producing design patterns that are familiar to users, a team’s message and overall goal can be better focused on. Patterns make coming to decisions much easier due to the predictability that they bring. 

Examples: color, font, navigation patterns, control patterns, interactions 

Related resources:

• What is a pattern library?
• Useful UI Patterns

Properties 

Definition: Properties are the characteristics of an element that define its appearance and behavior. In CSS, for example, properties include things like color, font size, and margin. In HTML, this could be used to make an element bold, italic, or a certain color.

Application: Some designers can find benefits from visual properties such as image-rendering, drop-shadows, border-radius cascading style sheets (CSS), or linear gradient to help improve design tasks. They might also use properties (like bold or italics) to emphasize a set of text, so users can quickly identify keywords. 

Related resources:

• Component Properties
• HTML Attributes vs. Properties

Pilot

Definition: ​​A pilot is a miniature, self-contained version of a larger project. Pilots are often used to test new ideas or approaches before investing in a full-scale implementation.

They can be a great way to get feedback on a design system before committing to a full rollout and will typically be used by a smaller team or group of users.

Application: A developer might put together a testing group for a new video game that has yet to be released. They will allow the group to offer feedback for the game and offer any helpful suggestions for improvements. Pilot projects are a great way to identify mistakes and mitigate risk prior to an official launch.

Tokens and Variables 

Definition: Tokens and variables are used to store values that can be reused throughout a product. In CSS, for example, variables can be used to store colors, sizes, and spacing values. Tokens and variables can be a great way to maintain consistency across a product.

They can also make it easier to make changes to a product since you can update the values in one place and have those changes propagate throughout the solution.

Application: Tokens and variables are helpful for designers who are looking to make an update to their system or put together an entirely new project. They’re also helpful for maintaining future updates and managing a system that spreads across multiple platforms. For those using Material Design, tokens are optimal for features like dynamic color.

Related terms:

• What are design tokens?

Classes 

Definition: Classes are used to group elements together. HTML elements, for instance, can be grouped together by their class attribute. Classes can be used to create reusable components or to apply styles to multiple elements.

You could create a class for all of the buttons on your site. This would allow you to style all of the buttons in the same way and make it easy to update the styling if you want to change it in the future.

Application: By classifying certain elements on a site, designers can ensure that similar tasks are simplified in the future. This, in turn, saves time by making future updates quicker. In design software, designers can quickly group elements through a keyboard shortcut to optimize future processes. 

Binding 

Definition: Binding is the process of connecting an element to data. In HTML elements can be bound to data using the data-* attributes. This allows the element to display the data in a specific way.

Binding is a powerful way to create dynamic and interactive user interfaces. It can be used to build things like data tables, form controls, and charts.

Application: Binding is commonly useful by front-end developers to link components to variables. This can also be done by linking variables to components, which is also referred to as to-way-data-binding. Some developers will use binding techniques to link a user interface and the data that it shows.

Related resources:

• How to become a code-based designer?
• UX designer vs UX engineer

Slots 

Definition: Slots are used to insert content into a component. They are a great way to reuse components and to make sure that your content is always up-to-date. Among others, by using slots you could create a slot for your site’s navigation and insert the latest links into it whenever the content is updated.

Application: Slot components help product designers by customizing certain components to save time with their designs. They help reduce the complexity of projects in order to make them more flexible. Many choose customized design system libraries with slot components, for example.

Related resources:

• How to use UXPin Merge?

Events 

Definition: Events are used to trigger actions in a product. HTML elements, for instance, can be given event attributes that will cause them to respond to user input. They are a powerful way to create interactive user interfaces and be used to trigger things like modals, forms, and navigation.

Application: Events have a variety of applications, such as marking the start and end of a visitor session, obtaining visitor profile data, and changing a visitor audience level. Many applications allow users to access an events summary via a system dashboard. This report can usually be filtered to show most relevant data. 

Framework 

Definition: A framework is a collection of code that can be reused to build software products. They can include aspects of a project like libraries, tools, and best practices.

Frameworks can be a great way to speed up the development of a product. They can also make it easier to maintain a product over time. They are helpful for both small projects and large enterprise applications.

Application: Teams will commonly use frameworks to facilitate an in-depth analysis of certain issues and come up with a plan of how to take prompt action. Frameworks are an important part of any design system because they allow users to identify new insights at any given point in a design process. 

Related terms: 

• Angular, React and Vue frameworks
• Storybook frameworks
• Code-based prototyping in UXPin

Reference Site

Definition: A reference site is a website that provides information about a specific topic. You can use it to learn about new technologies or to find solutions to common problems.

Reference sites can be a great way to get started with a new technology or to troubleshoot an issue. They can also be an excellent resource for finding more information about a topic.

When designing a product or service, most teams will develop a reference site to ensure that everyone is using the same terminology, components, and processes.

Application: Reference sites are usually the first touchpoint for someone looking for a specific design system. These are posted by teams to make important information accessible in one centralized location. These generally include a component library along with a set of guidelines.

Design System Governance 

Definition: Design system governance is the process of managing and maintaining a design system. This includes things like setting up standards, creating documentation, and enforcing rules.

Application: Design system governance is important for preparing a system for change. It ensures that everyone is following the same standards. Governance is key to managing requests and keeping track of decisions. For this reason, many teams use it for better collaboration efforts and contributions. 

Related resources:

• Design system advocacy

Design System Graveyard 

Definition: A design system graveyard is a collection of abandoned or outdated design systems. This can be a great resource for learning what not to do when creating a design system. When a design system is no longer being used or maintained, it is said to have been “put to rest” in the design system graveyard. This is usually because the product or service that it was created for has been discontinued or because the team has moved on to a new system.

Application: Designers and Developers can benefit from the design system graveyard by studying it and educating their teams on what not to do if they want to keep their system afloat. Some also find it effective to utilize the graveyard to construct alternative designs from abandoned data. 

Examples: Gwern – Design Graveyard, 5 UX Designs That Died 

CSS Modules

Definition: CSS Modules are CSS files which define, by default, animation and class names. By using CSS modules, you ensure that your CSS code is consistent across projects.

They are a great way to manage CSS in large projects. They can also be used to create reusable components that can be applied across multiple projects.

Application: CSS modules are commonly used to build element styles more granularly. They help developers write more legible, maintainable code and are ideal for situations where application styles are expanding. When they expand, the likelihood of two classes ending up with identical or similar names increases, so these modules help developers combat this issue.

Related terms:

• Use CSS to Style Elements in UXPin

Storybook

Storybook

Definition: Storybook is an open-sourced tool that can be used to develop and test UI components. It allows for the creation of isolated environments for each component. The software can be used to generate static documentation for a component library.

Storybook lets designers test out different variations of a component to see what works best. It also offers the ability to generate documentation for a design system.

Application: Storybook helps designers and developers collaborate more cohesively. It’s used to locate inconsistencies through connecting common tools that designers use with the different tools that developers use. For example, Storybook connects components of JavaScript with (e.g., React) with prototyping tools like UXPin. Even more, the platform allows for UI review and feedback to be in one centralized location. 

Related terms:

• Storybook and UXPin Merge integration
• Storybook best practices
• Storybook examples
• Import components with Storybook
• Storybook Args

Design system maturity

Definition: Also known as a design system maturity model, this refers to the way to measure the progress of a design system. It can be used to track the development of a system and to identify areas that need improvement.

There are four stages of design system maturity: initial, foundational, comprehensive, and integrated. Each stage has its own challenges and characteristics. These include;

• Stage one – Style guides.
• Stage two – HTML & CSS.
• Stage three – Design & code components.
• Stage four – Fully integrated.

Application: Design system maturity models are commonly used by companies to help them follow a more cohesive, consistent system. Their effectiveness vastly outweighs traditional models; therefore, they reap more promising results. The models help teams handoff a design with ease knowing everyone is on the same page, and, for this reason, it is especially useful for designers and engineers alike. 

Examples: Design System Maturity Model

Related resources:

• How Iress managed to increase their maturity?
• Checklist to track design system maturity
• UXPin Design System Maturity

Atomic design

Definition: Atomic Design is a design system methodology, which is based on the idea of modularity and reuse. Atomic Design is made up of five stages – atoms, molecules, organisms, templates, and pages.

Application: One of the best uses for atomic design is gaining the ability to seamlessly switch between abstract to concrete. It allows users to switch and see their interfaces broken down to their atomic elements. Furthermore, atomic design breaks down the process of combining those elements to reach a final experience. 

Examples: Atomic Design Methodology, Andela – Atomic Design Principles

Related resources:

• Atomic design
• How to use atomic design in A/B testing?
• Atomic design system checklist

Atom

Definition: An atom is a design model that refers to the smallest unit of a system. In other words, it is the most basic building block. All atoms have the same structure and cannot be divided into smaller parts. Design-wise, this could refer to a simple component like a button or a form field.

Application:  Atoms help designers and developers break down components into their smallest form (e.g., button). They can be matched with other components to form things like molecules or organisms (see below). They’re ideal for combining into molecules to make web pages. 

Examples: buttons, inputs, labels

Molecule

Definition: A molecule is a design model that refers to a group of atoms that are bonded together. Molecules are slightly more complex than atoms but still considered basic building blocks. A step up from atoms, a molecule could be a button with an icon or a group of form fields.

Application: Molecules help teams build more complex structures out of existing atoms. For example, a profile molecule would be comprised of an avatar element and name label elements. Overall, molecules are great for bringing different elements together to form unique groupings. 

Related resources:

• Build and keep molecules with UXPin Merge Patterns

Organism

Definition: An organism is a design model that refers to a group of molecules that are bonded together. Organisms are more complex than molecules but are still considered to be basic building blocks. An organism could consist of an element like a header, footer, or search form.

Application: The organism stage of atomic design helps take the process one step further from molecular level. It allows designers and developers to utilize it as a component that can be reused across numerous designs (although it is not yet a completed design). 

Repository

Definition: A repository is a collection of code that is used to manage a design system. This can be used to store and share components, templates, and other assets. A repository can be hosted on a server, or it can be stored locally. Respectively a Design System Repository is a collection of code that can be used to manage a design system. It contains all of the assets needed to create and maintain a system.

Application:  Designers use repository hosting services, such as Github, to access and store resources. Programs like Github are helpful because they save code, store it, allow it to be shared with team members. This makes collaboration efforts simple and seamless. 

Examples: Bitbucket, Github

Related terms:

Git Repository

Definition: A Git repository is a type of repository that is used to manage code. It is a distributed version control system that allows for collaboration on code. Git repositories can be used to store and share components, templates, and other assets.

Application: Designers use GIT by identifying versions of their code, which can be accessed at any time. GIT is effective throughout every step in a project’s lifestyle because it keeps track of any changes that take place along the way. They are generally tracked via snapshots or paper trails. 

Related terms:

• Git for designers
• Merge Git integration
• How to use Merge?

NPM Package

Definition: Also referred to shortly as NPM, it is a collection of software tools built in the JavaScript programming language. It acts as a type of repository that is used to store and share code. NPM packages are frequently used to share components, templates, and other assets. 

Application: While, as a designer, you don’t need to understand the intricacies of how NMPs are built, it’s worth knowing that you can use them in tools like UXPin to facilitate your work on user interface designs. Namely, you can use NPM packages to import UI elements from component libraries and, as a result, design interfaces with ready-to-use elements directly from the code.

Related resources:

• What is npm
• npm Merge integration
• MUI npm integration with UXPin
• Ant design integration with UXPin
• Bootstrap integration with UXPin

Bridge communication gap between design and development teams at your organization. Try the most advanced prototyping tool on the market that’s powered with its proprietary Merge technology. Bring interactive, code-based components and build interfaces in minutes instead of hours. Find out more about UXPin Merge.

The post Design System Glossary – 34 Powerful Terms You Should Know appeared first on Studio by UXPin.

Design team rituals help build company culture and community. They’re also excellent tools for fixing common corporate issues like silos, big egos, poor communication, etc. In cross-functional teams, a design team ritual brings designers together to strengthen bonds and collaboration toward successful project deliveries.

This article explores five popular design team rituals, how to create one, and best practices to maximize engagement and long-term success.

Boost communication and engagement with UXPin–a collaborative design tool. Sign up for a free trial to discover how UXPin can enhance UX workflows to deliver better user experiences for your customers.

What are Design Team Rituals?

The purpose of any team ritual is to bring people together to strengthen bonds and develop a shared company culture. A ritual involves repeating conscious and deliberate action(s) on a specific day, date, or time.

For something to be a ritual, people must repeat it regularly and consistently. The ritual could be as simple as Friday morning coffee with the team, or something bigger, like an annual retreat.

Rituals tend to be light-hearted and informal; however, people are encouraged to take the process seriously and abide by any rules or conditions. The aim is to align values and behaviors towards a shared goal or purpose.

Design team rituals are specific to designers, excluding other teams and departments–which can be especially valuable when working in cross-functional teams. The aim is to encourage collaboration, growth, and culture among designers while providing a space to discuss design-related topics and challenges.

5 Popular Design Team Rituals

Here are five popular design team rituals, whether you work at the office, remotely, or in a hybrid environment.

1. Design Critiques

Environment: In-office or Zoom

Benefits: Good for solving design problems and encouraging collaboration

Design critiques are an excellent way for designers to present ideas for group feedback. For many, combining public speaking and a critique of their work can be an anxiety-inducing experience, so you’ll want to make sure there are rules to keep things light-hearted and respectful.

It’s good to use a semi-formal setting where presenters can use a projector to show their design(s) to the entire team. Time will likely be an issue, so create 15-20 minute slots team members can book in advance.

Design leader Jared Zimmerman recommends designers prepare a single slide with three points:

• The problem the designer is trying to solve
• Where they are in the process
• What feedback is most useful for them today

This format makes these design critique rituals purposeful and encourages team members to make the most of their short time.

Jared emphasizes the importance of presenters telling the group exactly what they need in terms of help–“I’m really having trouble with X; what do you think would solve this?”

2. Coffee Rituals

Environment: In-office or Zoom

Benefits: Good for breaking silos, team bonding, and developing the organization’s culture

Coffee rituals are a fantastic opportunity for design team members to discuss topics freely. Design lead at Atlassian, Alastair Simpson, has a simple daily morning coffee ritual format. He asks team members what they did over the weekend and what work challenges they’re experiencing.

In these informal settings, team members often think more freely and openly, resulting in solutions and ideas to solve big challenges.

3. Weekly 1:1s

Environment: In-office or Zoom

Benefits: Good for leaders to connect with individual team members

Rituals don’t only apply to group activities. Design managers and leaders can create weekly 1:1s with team members to discuss their challenges, work in progress, career path, etc.

Trello (Atlassian) Design Manager, Marc Jenkinson, has created this 1:1 agenda template. Marc says in a remote environment, managers can use these sessions to get to know employees on a more personal level–maybe get introduced to the kids/pets, learn about a hobby, etc.

4. Daily Stand-ups

Environment: In-office or Zoom

Benefits: Excellent for quickly communicating daily progress and issues

Stand-ups are an agile exercise where team members share their daily progress and any blockers/challenges. The format is simple. Each person stands up and briefly answers three questions:

1. What did I work on yesterday?
2. What am I working on today?
3. What issues are blocking me?

There are various stand-up adaptations, like a weekly version or an additional question, “What am I planning to do tomorrow/next week?” 

A morning stand-up ritual is an excellent way to align designers, develop daily communication, and keep everyone on the same page.

Atlassian’s “Stand-ups for agile teams” goes into greater detail with best practices and running virtual stand-ups for remote teams.

5. Check-in/Check-out

Environment: In-office or Zoom

Benefits: Great for keeping teams connected

Morning check-in and afternoon check-out rituals are excellent for keeping teams connected. These check-ins work especially well for remote teams where some members never see each other.

Check-in rituals are informal and can be fun. Keep things light-hearted, so team members enjoy these brief times together. Joël van Bodegraven, a Product Designer at Miro, has a four-step check-in format:

1. Step 1: Gather in a circle or huddle.
2. Step 2: The lead or facilitator drops a question–“Ok, team, how are you feeling this morning?” Team members can answer in one or two sentences about how they feel that morning/afternoon.
3. Step 3: Allow everyone to have their say.
4. Step 4: End with a team clap, something funny or energizing to lift everyone’s spirits before heading into their next task.

One way Joël makes his check-ins fun is by creating random themes, for example:

• Check-in as a superhero
• Check-in as an animal
• Check-in as an actor
• Check-in as another team member

You get the idea.

How to Create a Ritual?

Rituals work best when they have a purpose or fix a problem–like improving communication or boosting morale. Fearless Culture has an excellent five-step plan for creating a team ritual.

Step 1: Identify the problem

What is the cultural problem you’re trying to solve?

Does your team feel fragmented by poor communication?

Is there tension among team members?

Set up 1:1s with team members to get their perspectives. Fearless Culture recommends asking team members to list five problems, identify a top five, and get everyone to vote. Involving team members increases the likelihood of getting team buy-in.

Step 2: Reframe the problem into a challenge

Use the “How might we…?” format to turn the problem into a challenge. Ask your team to share what people do, say, and think when the problem arises.

For example, you might find team members don’t feel appreciated for their work. Reframing the problem, “How might we design a ritual to start celebrating small victories?”

Step 3: Brainstorm team rituals

Brainstorm ideas and rituals with your team to find a solution for your problem.

• Where will your ritual take place (onsite, offsite, virtual)?
• If you meet in-office, do you want to avoid tech?
• If you have a big team, do you need to split up?
• How much time do you need?
• What is the frequency–daily, weekly, etc.?
• How do time zones and remote employees impact your ritual?

Answering these questions will help narrow down what’s possible with the time and resources available.

Step 4: Create the narrative

According to Fearless Culture, creating a narrative is the best way to design a team ritual. There are five components to this narrative:

• Ritual trigger: What triggers your ritual? Is it a specific time of day, completing a project or milestone? How do team members know to gather for the ritual?
• Beginning: How does the start? Joël van Bodegraven’s check-in starts with, “Ok, team, how are you feeling this morning?”
• Middle: How do you know when the ritual is complete? In Joël’s example, everyone has checked in. 
• End: What happens to close the ritual? Joël’s check-in ends with a team clap to energize everyone.
• Reward: What is your collective accomplishment? For example, once everyone has checked in and clapped together, they feel a sense of community with an energized excitement to begin the day.

It’s important to test and iterate on your ritual process until you find the right solution for your team and purpose.

Rituals Best Practices

Here are some design ritual tips and best practices. We borrowed most of these from Arki Sudito’s article, Co-founder and CEO of di Growth Center.

1. Use any ritual you find as a template–customize it to meet your team’s needs.
2. Create a safe space for employees to speak and express themselves openly.
3. Involve team members in the process to increase buy-in and engagement.
4. Find advocates to help evolve the ritual and will encourage others to participate.
5. Create a Slack channel to discuss and develop your team ritual–crucial for remote team rituals.
6. Don’t force people to take part in your rituals. Create an enjoyable experience team members are excited to partake.
7. Arki Sudito recommends you don’t call your ritual a ritual. Many people are skeptical of ritualistic or culture-building practices.
8. Keep it cheap and “lightweight.” Anything that costs money risks scrutiny from stakeholders, prematurely ending your ritual.
9. Ensure your ritual takes place at a convenient time. You don’t want to interrupt important workflows and processes.
10. Make sure your ritual offers underlying value, intention, and purpose for team members. Don’t choose something that may exclude people–like getting drunk after work or intense physical activity.
11. Don’t be afraid to ditch a ritual if it’s no longer useful.

Make delivering high-quality user experiences your team’s daily ritual with UXPin–the world’s most advanced design, prototyping, and testing tool. Sign up for a free trial to discover how UXPin can revolutionize your UX design process.

The post 5 Design Team Rituals that Will Bring The Team Together [+ How to Create Your Own] appeared first on Studio by UXPin.

Design consultants have been around for some time, with companies using external services firms and agencies to take care of their design consulting needs for many years.

But as design change management evolves, and with contemporary design thinking transforming how design teams are integrating their efforts with other departments, design industry roles like these are delivering a range of exciting possibilities and benefits. 

In this article, we shed some light on the growing role that internal design consultants are playing in the industry. We discuss how they’re positively influencing design quality and design team performances.

We explore how internal design consultants are integrating with these teams, unpack the benefits they’re bringing to design quality, and look at the steps involved in setting up an effective internal design consultancy.

How to gain the time necessary to set up and run a design consultancy? Improve your current workflow. One of the ways of doing that is trying out tech that helps you speed up prototyping and design handoff process. UXPin Merge is exactly what you need. Read more about how it helps companies fight front-end debt and develop products that are based on your design system. Explore UXPin Merge.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

What is an internal design consultancy? 

Before diving in, let’s explore the design consultancy concept and how these consultants function as in-house organizational problem-solvers whose role is to identify and implement workable digital design solutions.

An internal design consultancy can be defined as a function within a design company which suggests ideas, makes recommendations or audits, and then advises on an existing design system.

From offering observations about the form or functionality of a digital product’s design to the aesthetics and even the marketability of something, an internal design consultancy understands how these features and elements integrate with one another. 

These consultants play several important roles within a design team and offer their expertise, adding value by:

• Helping design team members consider and make the best decisions available
• Keeping the team informed and up to date about potential solutions and alternatives
• Assisting in streamlining work processes and tasks using design frameworks

Monitoring and then improving a team’s overall performance and output by developing an effective design strategy.

A design consultant’s day-to-day actions may include:

• Arranging and hosting design workshops
• Supervising the creation of an organizational design system
• Adding experience and input to design ideation and execution

Internal versus external design consultants

Internal design consultants are almost identical to their external counterparts, though with a much better insight into the design company’s operations and team dynamics. The difference between internal design consultants and external ones lies in their relationship with the client organization.

• Internal design consultants – are hired full-time or on a contract basis by the client organization, reporting directly to them. They work continually for their employer, focusing exclusively on the organization’s in-house product design efforts and forging long-term relationships with the company’s executive and design teams.
• External design consultants – come from design consulting firms and are hired for a short period of time to complete a specified design-related project or task. They are often employed by external consulting and design services, work on projects for different organizations simultaneously, and bring ideas based on their own experience and a broader business perspective. Ideo is a famous innovation consulting firms you might have heard about. This company that’s based in Palo Alto helped many startups with design initiatives.

To sum up, internal design consultants are dedicated solely to your company and usually, participate in long-term projects. While their external counterparts are leased out from agencies and support you in shorter assignments.

What are the advantages of internal design consultants?

1. Ensuring consistency and clarity

Rather than disrupting your product design team’s workflow efforts every time you rope in an external consultant, investing in having an internal design consultancy capacity functioning within your product design efforts means consistency and clarity for everyone.

This may involve having your team follow a design thinking process built around the core pillars of empathizing, defining, ideating, prototyping, and testing. Crucially, internal design consultants are effective at governing change management in design.

Internal design consultants are the perfect candidates for supervising and managing this massively important, though time-consuming, process. By organizing and streamlining efforts to ensure consistency and clarity across the team, change management in design can permeate throughout the organization. 

2. Increasing intellectual capital & problem-solving skills

A design company boasting internal consulting groups within their product design teams can drive cost reduction, enable better design services talent acquisition, accelerate the product development, coming up with strategic design solutions or even brand strategy. This, in turn, promotes the growth and retention of intellectual capital – which can only be earned through internal consulting – allowing employees to gain a better understanding of the company itself. 

As full-time, committed employees working on the front lines, internal design consultants accumulate extensive experience and knowledge of the company’s design architecture. These in-depth insights help other employees improve their problem-solving skills as they interact with the internal design consultants or shift into different line management positions.

3. Promotes design across the organisation

Most design teams struggle to promote design thinking across an organization. An internal design consultant on your payroll means having a design advocate on your team, too. 

Internal design consultants live and breathe design thinking, ensuring that your strategic design ambitions constantly receive the visibility and attention they deserve. They also function as design ambassadors, helping other business stakeholders understand the importance of product design and usability in digital products, for example. 

4. Bridges the communication gap between design and other departments

Many design industry players note how difficult it can be to deconstruct silos within an organization. Design change management demands clear, unambiguous communication, not only between design team members but between different departments as well. 

Internal design consultants who constantly advocate for design change management and design thinking are adept at helping other departments and role players understand how the system can make their work and lives easier. They are skilled at explaining a system’s complexities by filling the gap in communicating a system’s functionality and role in branding strategies to, for example, software developers, who can then better align with design teams. 

These updated processes, however, need more than good communication. They also require the right tools to work. Tech stack like UXPin Merge allow design teams to bridge the gap between UI and UX designers and developers by aligning them with a single source of truth, leading to a more connected working environment and fewer isolated, obstructive silos. 

A great example of how such a tool can help comes from none else but influential design operations guru Dave Malouf’s. In a webinar, he discusses how much such software can help internal design consultants break down organizational silos by leveraging a single source of truth and closing the divide between design teams and departments. 

How to set up an internal design consultancy?

So, you’re looking at adding an internal design consultancy to your design operations? Great. But you’ll need a plan before getting started, and it all begins with adopting and communicating a design thinking philosophy before kicking off your internal design consultancy. 

Step 1: Communicate

Internal design consultancies are still gaining traction in the design industry, and teams are often likely to either be used to having external design consultants reviewing and updating their design systems or have learned to take care of consultancy work themselves. 

Remember, the objective of setting up an in-house design consultancy is to improve team performance, so be sure to communicate and engage with the team beforehand. Make sure they understand why you want to bring an internal consultant into the mix and how having a dedicated consultant will take the design burden off their shoulders, help to solve problems and ensure design thinking consistency. 

Step 2: Define objectives

Without goals, your consultant and team will be shooting in the dark, unsure of the deliverables they’re striving for. The next step involves clearly defining the internal design consultancy objectives early on. 

Some of these consultant objectives may include:

• Helping the marketing team to improve the customer experience via a revised email flow that would bring new business in
• Assisting the customer success team with improving user experience of the account cancellation process
• Putting design mechanisms in place which boost collaboration and communication between design teams and developers, centered around a single source of truth
• Working with the sales department to design a more efficient leads conversion process
• Engaging with employer branding team to schedule more engaging media releases about company updates or helping them revise their social media strategy to showcase good design of their product

Step 3: Start consulting

​​Next, start doing the work. Once you’ve engaged with your design team, clearly defined and communicated the internal design consultancy objectives and found your consultant, start pursuing your mandate. 

Engage with different departments. Confer, observe, and test. Brainstorm with the team, audit and update processes, secure feedback, and report on whether you reached your objectives or not. 

Step 4: Measure and learn

Once you’ve had time to put your efforts in motion, you’ll need to measure, analyze the outcomes, and tweak your efforts. Solicit feedback from your team, look at the data and identify any shortfalls in the process you can look to improve. If you spot any mistakes, use them to learn and adapt your design strategy. 

Once completed, you’ll need to take your measured results and compare them to your stated objectives established at the outset. If you’ve reached them, continue to consult and refine. If not, go back and start again. 

Create top design consultancy with our tips

As the needs of design teams evolve and become more complex, design companies and organisations are finding that the benefits and possibilities of hiring, training and developing in-house design consultants outweigh the need to bring in external ones.

Think of internal design consultants as sports team captains roped in for a new season to steady the ship and guide the team to new heights. Their job is to improve performance and to get the most out of their “players”.

Internal design consultants are already showing how important they are to design services and will soon become key drivers of design thinking in workplaces everywhere. They ensure consistency in the product design process and help close the gap between what designers are aiming for and how developers understand the need for design systems. 

Improve your productivity

Internal design consultants are the perfect design thinking advocates and, armed with design tools like UXPin, can now get the most out of their design teams and increase their productivity.

UXPin offers a technology called Merge, which helps to build prototypes with the exact building blocks of your digital product – functional UI components. In effect, the design handoff is much smoother. Devs know exactly what they need to build. They can copy the code behind the design elements and use it in their process. The outcome? A greater transparency between design and development and more clarity across the company.

The post Design & Consultancy – How Internal Consulting Can Benefit Your Team appeared first on Studio by UXPin.

With limited resources and competition from other departments, creating a compelling business case for UI/UX design initiatives is crucial to secure buy-in. You must prove you have the best solution and can execute your initiative successfully.

This article discusses how user experience design professionals can create a convincing UX business case, including an example from the UAE-based home delivery service, Delivery Hero.

Use UXPin to create a fully functioning prototype to support your business case. Stakeholders and usability participants can engage with prototypes like they would the final digital product. Sign up for a free trial to discover how code-based design can revolutionize your UX workflows and usability testing to improve product development.

Build advanced prototypes

Design better products with States, Variables, Auto Layout and more.

Try UXPin

What is a Business Case?

A business case outlines the benefits of a project, initiative, or strategy and why the company or department needs it. A UX business case relates specifically to design-related projects–for example, building a design system, purchasing a design tool, or investing in a big UX research project.

Through a business case, the UX team must:

• Demonstrate a need (or problem) for the expense(s)
• Offer a design solution

The solution is often more effective when paired with a value proposition. How will this project deliver an ROI for design and the organization?

Why do you need a Business Case for UX?

Getting buy-in from stakeholders can be challenging, particularly for UX projects. Many non-designers don’t understand user-centered design principles or design thinking and are reluctant to make design investments.

Your UX business case must show stakeholders how improving a product’s customer experience is good for the bottom line. For example, a design system is a significant investment. Stakeholders often can’t see how a library of reusable components will deliver business value, so designers must demonstrate this value through a business case.

Delivery Hero’s Business Case Value Proposition

Delivery Hero is an excellent example of using a value proposition in a business case for a design system. After several attempts at pitching their design system to stakeholders, Delivery Hero’s product design team realized they had to make a more convincing case, including a real-world case study and value proposition.

Delivery Hero’s product design team used a single screen to compare building a user interface with and without a design system. The results were staggering:

• Building without a design system – total time: 7.5 hours
• Building as a reusable component – total time: 3.25 hours

The experiment demonstrated a 57% time reduction in front-end effort and zero percent front-end debt with a reusable component.

Front-end debt had become a compounding issue for Delivery Hero, so eliminating this problem and reducing delivery time by almost 60% demonstrated a significant return on investment for stakeholders.

Delivery Hero’s stakeholders were impressed with the results and gave the go-ahead for the company’s design system, Marshmallow–read more about Delivery Hero’s story here.

What should you include in a UX Business Case?

Now that you understand a business case’s purpose and importance let’s explore the points to include. 

• Executive Summary
• Mission Statement
• Market
• Problem Statement
• Proposed Solution & Value Proposition
• Risks
• Roadmap
• Required Resources
• Team

It’s important to note that you won’t always use all these points, only those relevant to your business case and project. The goal is to keep your business case thorough but concise. If stakeholders want to see the research, you can present that separately.

Executive Summary

An executive summary summarizes your business case and its sections. Essential elements to include in a business case executive summary are:

• The problem
• Your solution

Mission Statement

The mission statement summarizes the project’s purpose and goal. It’s usually a few sentences and can appear on the same slide as your executive summary. The mission statement guides the design process while uniting team members and stakeholders on a common idea and purpose.

Check out ProjectManager’s article, “How to Write a Mission Statement.”

The Market (or Users)

If your UX business case is for an internal initiative, you can replace this section with The Users and identify who your project aims to serve. For example, a design system helps product, UX, and engineering teams, but it also positively impacts end-users. You can represent your end-users with personas so stakeholders can empathize with real people.

Problem Statement

Your problem statement outlines a key issue, who it impacts, and its effect on the business. Laura van Doore, a Design Manager at Atlassian, says, “there are two parts to executing a good problem statement.”

Problem Selection: 

“Select and emphasize problems that will appeal to your audience.” 

When pitching to stakeholders, demonstrate how the problem impacts the business, rather than only focusing on the design team. 

In Delivery Hero’s case, the product team showed that their current project workflow accumulated front-end debt, inconsistencies, and slow time-to-market, ultimately costing the business time and resources.

If you’re presenting a problem that directly impacts users, you may want to include UX artifacts like a customer journey, user research, and other UX insights to give stakeholders a clear understanding of the issue.

Framing the Problem:

Laura’s next step is to frame the problem around your target audience:

• Identify the core problem
• Outline who the problem impacts and how
• Describe the adverse effects on your audience and the business

Proposed Solution & Value Proposition

Describe how your solution solves the company’s problem and its value proposition. The value proposition is critical for your business case. It describes the value and return on investment (ROI).

Stakeholders are less concerned about solving workflow issues than business-related impacts. How does your solution deliver an ROI?

Amber Jabeen from Delivery Hero’s design system team says your solution must use business metrics and KPIs to describe the positive benefits for the organization. How will you reduce costs, increase revenue, improve time-to-market, or make the product more competitive?

Risks

A thorough business case also considers the risks and how you plan to tackle them. Stakeholders like to see that you’ve looked at your solution from multiple angles and prepared for potential issues.

In her article, Laura van Doore from Atlassian says, “Be realistic, rather than utopian…If you sell the dream too much and present a utopian story of success-only, your case will seem too biased and might get chucked to the bottom of the pile.”

Roadmap

Another critical element to your business case is a timeline or roadmap. How long will it take to deliver the project, and when can the company expect to see the value you outline in your solution. What are your KPIs so stakeholders can monitor progress?

Again, it’s important to use relevant business metrics. For example, when discussing human resources, estimate the total hours per department, i.e., design, product, engineering, etc. This breakdown allows stakeholders to see how the project affects the company’s human resources and other projects.

Required Resources

What resources will your project need?–human, financial, technical, design, etc. If possible, include multiple scenarios to give stakeholders options based on available resources.

Think about what resources you’ll need before, during, and after the project delivery. For example, a design system requires a design audit before you start, people to build and deliver it, and a team to manage and scale it. As a design system matures, it requires more resources.

Team

Describe your core team behind the business case and the people you’ll need to deliver and scale the project, most notably:

• UX Designers
• Engineers
• Product managers
• Analysts
• Stakeholders

Best Practices for a Strong UX Business Case

We’ve borrowed some of these best practices from our May 2022 webinar, Enterprise Design System – How to Build and Scale, with Amber Jabeen, DesignOps Director at Delivery Hero MENA (talabat).

1. Start with a real pain point

Your business case must include a pain point that adversely impacts the product, its users, and the business. Stakeholders are less likely to take action if you only show how a problem affects team members. 

Suppose you can prove that problem creates rework (extra cost), usability issues (losing users and producing costly support tickets), technical debt (extra cost), and slow time-to-market (less competitive and revenue loss). In that case, you have a real pain point to grab stakeholders’ attention.

2. Build a value proposition

Build a value proposition around your pain point. Your solution must solve the issue and deliver a return on investment. Remember to be realistic and show stakeholders you have weighed the risks.

3. Identify your biggest supporters and sponsor

Finding leaders and stakeholders outside of UX to support your business case will give it more weight. They will advocate that:

1. The problem you identify is real.
2. Your solution and value proposition are the best option.

Include these advocates in your business case and possibly a quote from your most influential stakeholder.

4. Show before you tell

People outside of UX have trouble understanding user experience and design thinking principles. Explaining the problem isn’t enough; you must show them what’s wrong and how it impacts the business.

As we saw from Delivery Hero, Amber’s team presented an experiment showing the inefficiencies and problems costing the company time and money. They proved their solution could solve the problem and deliver value to the organization.

If you present a theory to stakeholders, they’ll send you back for proof. Take the time to conduct tests and experiments to prove you can execute your solution, and it works!

5. Talk business metrics

Your problem and solution must include numbers to support your business case. Stakeholders want to see metrics and KPIs to assess:

• The state and scale of the issue
• How your solution improves these numbers

6. Don’t go alone – build your network

Talk to cross-functional team members, leaders, managers, and everyone impacted by the problem to get their support and buy-in for your solution before presenting a business case to stakeholders. When you have the organization behind your project, it’s more likely to get approval from decision-makers.

Support Your Business Case With a UXPin Prototype

UXPin’s code-based design tool allows designers to build fully functioning prototypes with code-like fidelity and functionality. Instead of imagining how a feature will work, UX designers can accurately replicate the final product experience–creating a more convincing business case for stakeholders.

Sign up for a free trial to build better quality prototypes for stakeholders and user testing.

The post UX Business Case – How to Build a Strong Case for Investing in Design appeared first on Studio by UXPin.

Maturing and scaling DesignOps is crucial for long-term success. But where do you start, what do you track, and how do you measure the right metrics?

We took inspiration from the NN Group’s DesignOps Framework and questions from our UXPin Community to create a checklist template DesignOps practitioners can use to track and measure maturity.

Sync your component library to UXPin’s editor to create a single source of truth and increase adoption with UXPin Merge. Check out Git for React libraries or our Storybook integration for other popular front-end frameworks. Discover UXPin Merge.

Reach a new level of prototyping

Design with interactive components coming from your team’s design system.

Discover UXPin Merge

Using Metrics to Track DesignOps

Without tracking DesignOps efforts, it’s impossible to know whether changes are successful or the organization’s maturity level. These metrics are also crucial for reporting success to stakeholders, getting buy-in, and scaling Ops.

Picking the Right Metric

Our December 2021 webinar with Patrizia Bertini looked at the ROI of DesignOps and picking the right metric. Patrizia framed DesignOps metrics in two categories, efficacy vs. efficiency.

• Efficacy is about behavior and doing the right things. It can be subjective and challenging to measure.
• Efficiency is measurable and quantifiable using numbers, percentages, and ratios.

Stakeholders like seeing efficiencies because it clearly shows cause and effect. But efficacy is just as significant because behavioral and subjective improvements help to increase efficiencies, thus helping to scale and mature DesignOps.

Watch the webinar again on our YouTube channel and learn how Patrizia approaches efficacy and efficiency. Subscribe for upcoming webinars on DesignOps, design leadership, and design systems.

Using a DesignOps Framework as a “Maturity Checklist”

The NN Group’s DesignOps framework is an excellent template for understanding the “DesignOps landscape.” DesignOps leaders can use this framework as a checklist for tracking maturity and identifying areas for improvement.

A 2020 survey of 557 design and UX practitioners from the NN Group found that DesignOps was “low in most organizations.”

The survey reported that “organizations only did 22% of recommended DesignOps efforts, did not have DesignOps-dedicated roles, and had low DesignOps maturity overall.”

Using this framework as a guide, DesignOps practitioners can create a checklist to track progress and maturity.

According to the framework, there are three primary DesignOps areas:

• How we work together
• How we get work done
• How our work creates impact

How We Work Together

“How we work together” scored the lowest in NN Group’s DesignOps maturity survey with an 18% average. The category “Humanize: Enable development and growth” was the poorest performer in this area.

Executives and Design/DesignOps leaders must be particularly concerned with poor performance in this area because it correlates to collaboration, communication, teamwork, hiring, and skills development–metrics related to UX output.

Organize: team structure

Building the “right team” is crucial for a project’s success. The NN Group’s survey identified three critical areas for improving DesignOps maturity:

• Shared design team organizational structure
• Balanced design teams with complementary roles and skills
• Design leaders are peers with leaders from other departments

Collaborate: effective communication

• Design’s role is understood and agreed by design team members and stakeholders
• Communication channels for designers to share UX knowledge and insights
• Work environments encourage internal and cross-functional collaboration
• Formal channels for team members to share interests and passions

Humanize: Enable development and growth

• Consistent hiring and interviewing practices that encourage objective candidate assessment
• Defined onboarding milestones and goals with regular check-ins for new team members
• Clearly defined paths for designer career development
• Existing processes for regular skills evaluation to identify growth opportunities

Awareness of DesignOps services

Another way to frame “How we work together” is awareness–socializing work to build awareness and engagement across the organization. Some examples include:

• Awareness of skills – essential for building the right teams
• Awareness of skill gaps – crucial for long-term growth and scaling UX
• Awareness of career status and opportunities – inspiring individual development and growth to retain talent and keep employees motivated
• Brand and culture recognition – keeps UX in touch with the organization’s broader vision

Want to get better in the “How We Work Together” area? Get our free eBook about the first pillar of DesignOps and learn about this important aspect of DesignOps. Get it here: DesignOps Pillar: How We Work Together.

How We Get Work Done

How we get work done relates to project workflows, tools, processes, and protocols. This area is usually a primary focus for DesignOps because it influences productivity, project delivery, and consistency.

The NN Group’s DesignOps maturity survey showed a 20% average across all metrics. 

Standardize: Use consistent tools and processes

• Standardized, documented design process shared with stakeholders and used by internal design teams
• Design is adequately incorporated in the development process
• Designers work with standardized UX principles that guide work for consistent project delivery
• Designers use a consistent toolset for creating UX artifacts
• Design tools integrate with external partners, primarily product and engineering

Harmonize: Share resources and insights

• Shared design system or style guide
• Centralized, searchable, shared research artifacts and insights
• Shared, easy access to design artifacts

Prioritize: Decide what to focus on and why

• Design teams operate at a realistic capacity–i.e., there is enough time for proper research, design, prototyping, testing, documentation, and delivery
• Realistic timeframes and budgets for design projects

Usefulness of DesignOps Services

We add one more component to the NN Group’s framework, the “usefulness of DesignOps services.”

• Design leadership and stakeholder’s awareness of design projects’ status
• Design team health
• Successfully completed design programs
• Design system impact–productivity, efficiency, time-to-market, consistency, etc.

How our Work Creates Impact

Impact is the final DesignOps area of focus. While Impact scored highest on the NN Group survey at a 30% average, many metrics were below or near single digits!

Design advocacy plays a crucial role in scaling and maturing this DesignOps component.

Measure: Define and track design quality

• Consistent tracking of design metrics for accountability
• UX metrics tracked per project and towards a broader vision and roadmap
• Objective, consistent measuring of design quality

Socialize: Educate others about design’s role and value

• Design successes and case studies shared with partners and stakeholders
• Unified messaging and sharing of design role and value to partners and stakeholders
• Recognizing non-designers when they apply user-centered design principles
• The organization understands design’s value

Enable: Cultivate organization-wide use of design activities

• Design activities and methods are available to external partners to use
• Design skills training for non-designers–i.e., design thinking for problem-solving
• Employees outside of design participate in design processes–i.e., ideation, prototype testing, design sprints, UX research, etc.

Adoption of DesignOps services

We add another layer to the Impact component: Adoption. Adoption and completion are crucial for Impact because it gives DesignOps case studies and success stories to share with the organization and stakeholders.

• Adoption of tools, processes, and systems–encouraging change
• Attendance for design events, design team members, external partners, and stakeholders
• Projects that follow standardized design processes
• Projects that follow the design review process
• Number of design programs managed
• Number of successfully completed programs

Scale Design With UXPin Merge

You don’t have to hire more designers to scale design output. After adopting UXPin Merge in 2019, PayPal delivers projects 8X faster–and they didn’t have to hire more designers!

With a fully integrated design system syncing design, product, and development, teams spend more time focused on building amazing products with little or no designing and coding from scratch. Iress created a “fully integrated design system“ with UXPin Merge, giving them:

• Design in (no) code
• No design drift
• Consistent design
• Seamless (no) handoff

Eliminate many DesignOps challenges with a single code-based design solution from UXPin Merge. Request access to this revolutionary technology and start building better product experiences for your customers.

The post Checklist to Track DesignOps Maturity appeared first on Studio by UXPin.

Scaling UX is a challenge many design leaders encounter. With limited resources, it’s often impossible to hire more designers. But even if you do have the resources, is hiring to scale a viable and sustainable strategy?

This article looks at how organizations can scale design simply by switching their tool stack. We also provide an example of how this strategy was successfully implemented at the enterprise level–meaning it can work for anyone, especially cash-strapped startups.

Scale design with the world’s most advanced component-driven prototyping tool.

Scaling Design – More People or Better Tools?

When scaling design, we often think of hiring more people. Organizations consider increasing their designer-to-developer ratio, thinking that adding more designers and researchers is the best way to scale.

There are two problems with this approach:

1. It’s expensive and increases monthly overheads
2. It doesn’t scale inefficient processes and workflows

How PayPal Scaled Design by Switching Tools

In 2019, Erica Rider, Senior Manager for UX – Developer tools and platform experience at PayPal, was stuck with the challenge of scaling design without hiring new people. 

At the time, Erica had five designers (including herself), +-100 products, and over a thousand engineers working on PayPal’s internal product development projects.

They had many usability and consistency issues. As Erica says in her interview with UXPin, “no two products looked the same!”

Erica’s idea was to empower product teams to build and deliver projects. The problem was most product team members had little or no experience with design tools. Teaching them UX practices and new tools would be time-consuming and more expensive than hiring new designers!

Eventually, Erica came across UXPin Merge–a technology that syncs a component library from a repository to UXPin’s design editor. This technology meant PayPal’s product teams could drag and drop approved components to build new user interfaces. Erica could also set constraints via the React component’s props to ensure product deliveries met a high standard of cohesion and consistency.

By switching tools, Erica scaled design itself rather than her department. PayPal’s product teams complete 90% of their projects, with UX designers acting as mentors and helping when a challenging usability issue arises. 

Switching to Merge has also significantly reduced time-to-market. Product teams can create a one-page UI 8X faster (with substantially higher fidelity) with Merge than experienced UX designers could using an image-based design tool. 

You can read more about PayPal’s story here. And watch Erica’s Design Value Conference talk from May 2022, where she talks about educating the organization about user experience to hold everyone accountable for delivering user-friendly products.

The Landscape of Design Tools

The Evolution of Design Tools

Wireframing and prototyping for web design and usability testing began in the 1980s. In 1990, Adobe released Photoshop 1.0, the UX design industry standard for many years.

In the 2000s, we saw a greater emphasis on user experience design and the importance of prototyping and testing. While a wide range of design and prototyping tools were available, they were all iterations of Photoshop 1.0 that rendered raster graphics. 

The tools revolutionized UX workflows but matured very little to meet the fidelity and functionality of code. UX designers had to rely on engineers (and still do at many organizations) to build prototypes for solving complex usability issues.

Nowadays, we have tools for every stage of the design process, including design system tools for managing and scaling design systems.

The Code-Based Design Revolution

We also have a new breed of design tool–code-based design tools capable of building prototypes that accurately replicate code fidelity and functionality.

Code-based design allows designers to test user actions and functionality they could previously only achieve using code prototypes. Or, if they could build them in an image-based tool, it would take many hours (even days) and countless frames to achieve the desired result.

For example, with UXPin, designers can build prototypes that capture user inputs, perform form validation, verify a username and password, build a functional checkout flow with computational components, and more.

In 2019, UXPin released Merge, revolutionizing the prototyping and testing process. Merge allows designers to build prototypes using the same component library as engineers. You can sync React components via Git or Storybook for other front-end technologies, including Angular, Vue, Ember, and more.

This single source of truth eliminates drift, enhances user testing, improves cross-functional collaboration, and streamlines the handoff and development process.

As we saw in the PayPal case study above, Merge empowers non-designers to build, test, and deliver design projects. Organizations can scale design and its operations without hiring more designers.

Request access to UXPin Merge and see how powerful it is.

How to Introduce a New Tool to the Team in 6 Simple Steps

eSignature giant HelloSign created this six-step strategy for introducing a new digital tool to your team.

Step 1: Keep the initial introduction simple

Don’t overwhelm team members with an information overload about your new tool and how it works. Instead, design a strategy to educate and implement the tool slowly.

If you’re introducing a design tool like UXPin, perhaps you only get designers to use it for prototyping at first–since this is UXPin’s strongest advantage over image-based tools.

Step 2: Hear out your challengers (and find your champions)

Change is hard for many people. Even if you can demonstrate that your new tool will solve their problems, the overwhelming thought of change and learning a new system makes them reluctant.

We’ve seen this reluctance with organizations implementing design systems and new tools. Finding advocates and supporters who will help you convince others to adopt your new solution is crucial. 

In How to Evangelize a Design System? we outline some strategies for getting stakeholder buy-in and promoting adoption. Also, check out What is Design Advocacy? for techniques on engaging with and educating team members.

Step 3: Practice answering the hard questions

Sit with your implementation team to prepare answers for skeptics. Reluctant stakeholders and team members will always look for holes in your plan, so preempt and prepare for the hard questions.

If you come across a question you haven’t thought of, avoid arguing your point and instead answer with, “Great question. I’ll have to research that more and get back to you.”

Step 4: Don’t just share features; share specific examples

Demonstrating what something can do is far more effective than listing the tool’s features. When PayPal switched to UXPin Merge, they used an experiment to demonstrate the tool’s capability to reduce a single page prototype design time from over an hour to under ten minutes.

Results like that are hard to argue against. Find examples to demonstrate a new tool’s effectiveness, and frame those benefits to your audience.

Step 5: Give team members the autonomy and resources to explore

Some people learn by reading documentation; others prefer to watch tutorial videos, and then you get people who what to learn by playing with the new tool.

Give team members the options to learn and discover through a medium that works best for them. Host demos and Q&As so people can learn first-hand and ask questions.

Step 6: Listen to (and use) feedback

Be open to feedback and be willing to try ideas and suggestions. People will be more inclined to reciprocate when you show that you’re flexible and open to ideas. It also gives team members ownership, thus increasing the likelihood of adoption.

You can set up a Slack channel, create a feedback form, organize Q&As, workshops, etc., to engage with team members and encourage feedback.

Get a taste of Merge technology. See how much more consistent and scalable your prototyping gets once you switch to using UXPin with Merge. Request access to UXPin Merge.

The post Switching Design Toolstack to Design at Scale appeared first on Studio by UXPin.

Researching DesignOps can take you down a rabbit hole of blog posts, whitepapers, webinars, talks, communities, and more! What if you had everything bookmarked in a single resource with links to all the best DesignOps resources? Well, here it is!

This comprehensive list of DesignOps resources includes everything from articles to tools and networking communities.

These DesignOps resources are brought to you by UXPin Merge–the world’s most advanced code-based design tool built to overcome many DesignOps challenges. Request access to Merge and improve the UX design process and streamline product development.

What does DesignOps do?

DesignOps (short for Design Operations) refers to optimizing design processes, people, and technologies to improve the design organization and deliver business value for stakeholders.

The DesignOps role looks at several core areas:

• Operations management: Developing a Design roadmap and setting long-term goals
• Process design: Identifying frameworks, templates, methodologies, and tools to optimize operational processes
• Project management: Optimizing design workflows, assigning projects, setting timelines, and removing any bottlenecks
• Communication & Collaboration: A point of contact between Design and the rest of the organization while eliminating silos
• Onboarding: Orienting and training new team members
• Design team culture: Creating and implementing team building and culture initiatives
• Budgeting: Managing Design budget allocation and justifying costs
• Legal: Creating any legal documentation for designers and user testing
• Procurement: Managing procurement processes for Design
• IT and Security: Working with IT to integrate tools with other software and ensure everything is security compliant

DesignOps Tools

• UXPin Merge – A code-based design tool to sync a component library to UXPin’s design editor
• Adele – A repository of publicly available design systems and pattern libraries
• Storybook – An open-source tool for building UI components and pages in isolation (more for DevOps but can use to display component examples in design systems. Also syncs with UXPin Merge)
• Pattern Lab – A Brad Frost project for creating Atomic Design Systems
• Mechanic – an open-source framework that helps design teams to create web-based design tools

DesignOps Websites & Blogs

• Studio by UXPin
• re:Work by Google
• Amplify Design by Dave Malouf
• DesOps.io
• Nielsen Norman Group on DesignOps
• Patrizia Bertini on Medium

Single Articles

A collection of articles from design leaders and DesignOps managers.

• Building DesignOps at REA Group by Cha’an Armstrong
• DesignOps at Airbnb: How we manage effective design at scale by Adrian Cleave
• Understanding DesignOps and Its Role in Design Teams by UXPin
• Understanding the Value of DesignOps by Red Dolan
• Dialling Up the Joy, Turning Down the Pain: Design Ops at Spotify by Cliona O’Sullivan
• The Way We Build: How rethinking the Airbnb app changed the way we approach design by Alex Schleifer
• Scale your speed-to-innovation with Design Systems by Ryan Mulloy
• DesignOps – How to Improve Your Design Workflow and Operations by UXPin
• DesignOps: Unleashing the potential of our design studio by Mark Argyle
• Distilling How We Think About Design Systems by Sarah Federman
• A Design System isn’t a Project. It’s a Product, Serving Products. by Nathan Curtis
• Research the Problem: How to Get Started with DesignOps by UXPin
• Design Ops for all of us by Fabian Fabian
• How DesignOps Work – The Mindset of Design Operations by UXPin
• GE’s Predix Design System by Jeff Crossman
• A Pocket Guide to Design Operations by Rachel Posman
• Tools for DesignOps Specialists by UXPin
• A Field Guide to DesignOps by Micah Bowers
• How to Write a Mission Statement for a UX Team: A Case Study in Design Operations by Kate Kaplan (Nielsen Norman Group)

DesignOps Talks

• Scale design efficiently with DesignOps 2.0 – Erica Rider, Developer Tools UX Design Lead at PayPal
• DesignOps 2.0 – Scaling Design (A different perspective to Erica’s first talk) – Erica Rider, Developer Tools UX Design Lead at PayPal
• Measuring DesignOps’ Impact – Patrizia Bertini, Associate Director of Design Operations
• Holistic Design Operations – Dave Malouf, Director of Design Operations
• How To Design a Plane While Flying It – Omkar Chandgadkar, Sr UX Designer at Amazon
• A Path to Proving DesignOps and Business Impact – Salomé Mortazavi, Director of DesignOps at SiriusXM
• DesignOps Layers of Impact (from a design program management perspective) – Maggie Dieringer, Design Operations Lead at Uber Eats
• The rise of the DEO (TEDx) – Maria Giudice
• Living Design Systems – Jina Bolton
• Building a Strong and Resilient Design Community – Henry Stewart  
• Amplifying Design Value (DesignX Community) – Dave Malouf
• Operationalizing Design from the Ground Up (DesignX Community) – Anne Purves
• The Impact of DesignOps at ServiceNow – Peter Boersma
• Scaling Design with Peter Merholz (Adaptive Path), Anne Purves (Pinterest), Anne Thibodeau (Shopify)
• Designing for Growth – Netflix Case Study – Chetana Deorah
• Kim Fellman @ Design Leadership Summit 2018 (DesignX Community)
• Airbnb Design Talks: Negotiating Chaos featuring Crisis Negotiator Rudy Granados

DesignOps Books and eBooks

Books

• Rise of the DEO by Maria Giudice & Christopher Ireland
• Work Rules! Insights from Inside Google That Will Transform How You Live and Lead by Laszlo Bock
• Thinking in Systems: A Primer by Donella H. Meadows & Diana Wright
• DesignOps Handbook by Kate Battles, Meredith Black, Dave Malouf, Colin Whitehead & Gregg Bernstein
• Org Design for Design Orgs: Building and Managing In-House Design Teams by Peter Merholz & Kristin Skinner
• Make Space: How to Set the Stage for Creative Collaboration by Scott Doorley & Scott Witthoft
• Thinking, Fast and Slow by Daniel Kahneman

eBooks

• DesignOps 101: Guide to Design Operations
• The Guide to UX Leadership
• DesignOps Pillar: How We Work Together

DesignOps Podcasts & Interviews

Interviews

• Driving Digital Transformation at Scale: A Chat with GE’s David Cronin
• DesignOps in a Post-Industrial World: Crash-Coursing Complex Systems
• How Designers Can Get a Seat at the Table
• The Business Impact of Design – with Jose Coronado, Fabricio Dore and Patrizia Bertini
• Designing Org Structures – Open Panel Discussion

Podcasts

• xOps Today
• Airbnb Design
• DesignOps with Patrizia Bertini and Leo Marti
• Organizing DesignOps with Patrizia Bertini
• DesignOps from UX Like Us
• Reimagine Digital Transformation with DesignOps & Atomic Design
• Operate – Design Operations & Workflows
• Human, the designer by Joint Frontiers
• NCOMMON: Jacqui Frey and Alison Rand

DesignOps Communities

• Rosenfeld – DesignOps Community
• DesignOps.lol Community
• DesignOps Assembly
• DesignX Community
• DesignOps Portland

DesignOps Events

• UXPin’s Design Value Conference – Virtual
• Rosenfeld DesignOps Summit – Virtual & live in San Francisco, USA
• DesignOps Global Conference – Virtual
• Joint Futures: A holistic design conference – Live in Helsinki, Finland
• Design It. Build It. – Live in Edinburgh, Scotland
• UXistanbul – Virtual
• QRCA 2022 Annual Conference – Virtual & live in San Diego, USA
• UXDX – Multiple virtual & live events
• Fluxible – Virtual & live in Canada
• UX Australia conferences – Multiple virtual & live events in Australia
• UX STRAT – Virtual & live in Boulder, USA
• UX & Product Design Week – Live in London, UK

Streamline DesignOps with UXPin Merge

One of the biggest DesignOps headaches is design system operations and finding ways to enhance collaboration between design and development. The DS team works hard to sync UI kits with component libraries, a time-consuming manual process prone to error.

UXPin Merge allows you to sync a component library from a repository to UXPin’s design editor, so designers and engineers use the same components.

Any changes to the repository automatically sync to UXPin, so designers and engineers always work with the most up-to-date components–a single source of truth across the organization.

The post DesignOps Resources – A Collection of Top Links appeared first on Studio by UXPin.

DesignOps has become a crucial operational function for many organizations. Some companies still operate without a dedicated DesignOps practitioner or team, working around bottlenecks and inefficiencies.

According to a 2020 NN Group survey of 557 UX practitioners, “organizations only did 22% of recommended DesignOps efforts, did not have DesignOps-dedicated roles, and had low DesignOps maturity overall.” 

This article explores four stages of DesignOps maturity and the goals you should set at each stage to scale and grow your team.

Are you still using outdated image-based design tools? Join UXPin’s code-based design revolution with advanced Merge technology syncing design and development with a single source of truth that’s fully interactive and reusable.

Stage 0: Nobody is Responsible for DesignOps

For products with small-cross functional teams working together, the motivation for DesignOps is low. Something the NN group calls a “Scattered Team Structure.”

Product managers, design leads, and managers are responsible for various operational activities–hence the Ops work is “scattered” among team members. At his Design Value Conference 2022 talk, Omkar Chandgadkar, Senior UX Designer at Amazon, called this stage “Designing a plane while flying it“ because UX teams operate reactively or tactically rather than strategically.

This was true during the early days of Airbnb, where product teams consisting of designers and engineers worked closely in the same office, interacting and engaging throughout the day. They worked closely and solved operational challenges together, an “all hands on deck” growth strategy. 

But Airbnb’s success and growth meant teams separated, and silos emerged–a common problem among fast-growing startups and enterprise organizations.

“…we reached a tipping point where things suddenly became harder. Teams could no longer all fit on the same floor… Access to information, design standards, workstream collisions, and quality issues all became very real problems.” Excerpt from Adrian Cleave’s DesignOps at Airbnb article.

At this stage, Airbnb developed its Design Language System, and DesignOps was born.

Key DesignOps Stage Zero Resources

• How DesignOps Work – The Mindset of Design Operations
• Understanding DesignOps and Its Role in Design Teams

Stage 1: DesignOps team of One

The first stage of DesignOps is what the NN Group calls the “Solitary Team Structure.” DesignOps becomes a team of one dedicated full-time to the role. As Salomé Mortazavi, Director of DesignOps at SiriusXM, points out in her Design Value Conference 2022 talk, “70% of DesignOps departments are a team of one.”

When starting as a DesignOps team of one, Salomé recommends practitioners begin by listening and taking notes. Get to know the people, space, processes, etc.,–in group and one-on-one environments.

This listening approach will expose the company’s organizational and systemic problems. The DesignOps practitioner also builds trust with teams and stakeholders because they can identify and articulate the organization’s issues.

The goal for DesignOps stage one is to identify bottlenecks and issues and prioritize fixes accordingly. Salomé uses a Design Maturity Index to identify issues and themes. Some of these DesignOps must be solved, while others will fall on design leadership.

Key DesignOps Stage One Resources

• DesignOps 101: Guide to Design Operations
• Transitioning from a Product Designer Role into DesignOps
• Research the Problem: How to Get Started with DesignOps

DesignOps Stage 2: Hiring DPMs

Once a practitioner has a few successes and the organization sees value in scaling DesignOps, it’s time to start building your team. NN Group defines this as the “Specialized” DesignOps stage because the practitioner identifies the need for a dedicated team member in specialized areas.

Design program managers (DPMs) are often the first hires when building a DesignOps team. These DPMs might work alongside teams to streamline day-to-day workflows or focus on specific areas like onboarding, tool curation, licensing, etc.

While DesignOps has an impact and solves problems, stage two is still very tactical rather than strategic. The DesignOps team is effective for solving problems and developing short-term solutions, but they don’t have a roadmap or spend little time on long-term goals.

Key DesignOps Stage Two resources

• Tools for DesignOps Specialists
• ROI of DesignOps: All You Need to Know About Quantifying DesignOps’ Impact
• DesignOps Pillar: How We Work Together

Stage 3: Scaling DesignOps

A mature DesignOps team operates under a “Distributed” or “Elevated” structure according to the NN Group’s DesignOps Team Structures. DesignOps leans towards strategic operations with roadmaps, long-term goals, and monitoring project trajectories in these mature structures.

There’s a dedicated DesignOps leader who is inward-looking and process-oriented. In Measuring DesignOps Impact, Associate Design Operations Director at Babylon, Patrizia Bertini summarizes the DesignOps Leader role in five bullet points:

• Mission: the How / the performance
• Focus: End-to-end design process & teams
• KPIs: Team health, spending, & performance metrics
• Deliverables: Ops roadmap & strategy
• Skills: Change management

And the Design Program Manager’s using the same five points:

• Mission: Execute Ops roadmap
• Focus: Align processes to execute
• KPIs: Program metrics
• Deliverables: Blueprints, project status
• Skills: Process & project management

Patrizia Bertini defines three DesignOps areas for intervention:

• Business operations: Managing budgets, resources, and other business-related design functions.
• Workflow and design operations: A holistic view of the end-to-end design process. How do designers get from concept to final product?
• People operations: Considers the human aspect of design teams, like skills development, communication, and culture.

You can watch the webinar about measuring DesignOps on UXPin’s YouTube channel.

Scaling DPMs in a Mature DesignOps Environment

DPMs use frameworks to apply either tactical or strategic strategies for projects. In DesignOps Layers of Impact, Maggie Dieringer uses a “framing and scaling” methodology to determine:

• Where is your time best spent?
• How do you ensure that you’re having the most impact with that time?

Rather than looking for the “right” to do something, Maggie’s framework identifies where DPMs can have the most impact through three framing factors:

• What’s the size of the design team and the state of the organization?
• What type of resourcing and allocation environment are we operating in?
• What level is my primary design partner?

Once Maggie has the answer to these framing factors, she looks at increasing her impact depending on a spectrum of engagement with zoomed-in on one end and zoomed-out on the other:

• Zoomed-in: Working with teams on day-to-day tasks
• Zoomed-out: Advocating, strategy, and planning

Maggie outlines a support DPM trajectory based on her framing factors and level of impact by answering five questions:

1. Which activities and environments bring me job fulfillment day-to-day?
2. Which activities will have the most impact and influence right NOW on the team I support?
3. How can I leverage my partner to work on the things that are important to my career?
4. How can I use my team size to influence the desired behavior and engagement?
5. Do I thrive doing tactical or strategic activities (or both)?

She also considers:

• Where are you today?
• Where do you want to be?
• Where does your team want to be?

Key DesignOps Stage Three Resources

• DesignOps at Uber: Who Are DPMs and How Do They Create Impact?
• DesignOps vs. Design Leader
• Patrizia Bertini on Medium
• re:Work by Google
• Amplify Design by Dave Malouf
• DesOps.io
• Nielsen Norman Group on DesignOps

Scaling and Maturing DesignOps With UXPin Merge

As a DesignOps team of one, your time and resources are limited. As you mature, you want to focus on high-level strategies and long-term goals. Ensuring design teams have the tools to grow and scale is crucial for every DesignOps team.

UXPin Merge solves many DesignOps challenges, giving practitioners and DPMs the time to focus on strategic initiatives and creating value. With this technology, you can use your dev’s component library in your design process.

It speeds up prototyping, design handoff and product development. Request access to UXPin Merge and start prototyping with interactive UI elements that are a single source of truth between design and development.

The post DesignOps Strategy – How to Grow the Design Operations Team? appeared first on Studio by UXPin.

Dave Malouf is a DesignOps expert and industry veteran. He’s contributed to developing the practice, including sharing his knowledge through blog posts, interviews, and talks.

UXPin hosted a free webinar with Dave where he shared his insights on a Holistic Design Operations approach to enterprise design.

UXPin Merge is the ultimate DesignOps tool. Simplify and automate many DesignOps challenges with a code-based design tool that bridges the gap between designers and engineers. Sign up for a free trial to explore UXPin’s advanced features, including its powerful Merge technology via our MUI integration.

5 Takeaways from Dave Malouf on DesignOps

We’ve put together five ideas from Dave’s talks and blog posts to help improve your Design Operations. You can find links to all these resources at the end of this article.

1 – Create “Intentional Spaces”

In Amplify Design, Dave talks about how “intentional spaces and processes encourage serendipity, emergence, and exploration.” He says spaces (where teams work, collaborate, and ideate) are one of the most “valuable pieces for amplifying the work of designers.”

Dave’s favorite workspace is a team pod surrounded by whiteboards with a high-top desk or podium in the center. This setup works for both designers and cross-functional teams.

Team members sit facing the whiteboards so they can focus undistracted. They can also look up at the whiteboard for notes or ideas they’ve scribbled.

The high-top desk in the center encourages collaboration. Team members use the high-top to address the rest of the team with questions, ideas, or presentations. This “intensional space” facilitates work while fostering communication and collaboration. 

Dave’s intentional spaces method aligns with another DesignOps expert, Salomé Mortazavi, who talks about a practices-first approach–optimizing practices (the way people work) rather than processes.

Salomé presented some of her ideas about approaching design operations at Design Value Conference that UXPin hosted in March.

2 – Define What Designers Amplify

In his famous DesignX Community talk, Amplifying Design Value (also published on his Medium account), Dave outlines ways Ops can increase Design’s value within the organization through:

• Form giving: How form creates value–line, layout, composition, color, type, texture, volume, negative space, juxtaposition, alignment, flow
• Clarity: From information architecture that enables users to use a digital product
• Behavioral fit: How design provides an intuitive user experience that streamlines or compliments a real-world activity
• Exploration: How designers discover possibilities through sketching and trying ideas

3. Write a Design Manifesto for Better Futures

Dave wrote a design manifesto to compliment form giving, clarity, behavioral fit, and exploration. The manifesto starts with the prefix; Designing happens better when…

• different activities happen at their most appropriate cadence
• intensional spaces & processes encourage serendipity, emergence, exploration
• a balance of both quantitive and qualitative data are synthesized into actionable insights
• collaboration & inclusion are balanced with coordinated, focused development
• the exploration of a multiplicity of narratives have people gaining meaning across possible futures
• we understand that what attracts and motivates engaged designers is different from others
• we mutually understand & value what quality design output, AND quality practice is

4. Discover the Four Laws of Design Program Management

Dave has four vectors or laws a Design Program Manager must consider when managing design work:

1. Fidelity: Providing the right support for different fidelities in the end-to-end design process
2. Collaboration: Creating an environment to encourage collaboration to happen naturally and scheduling collaboration at critical parts of the design process
3. Cohesion: Ensuring teams and projects work cohesively towards “a singular vision”
4. Reflection: Creating time and spaces for teams to reflect, evaluate work, thinking, and creativity

5. Increase Design Value Through DesignOps

In How does DesignOps increase your design value? Dave identifies three areas where DesignOps leaders can amplify Design’s value:

Staff

Hiring, developing, and retaining the best people with your available resources. When Dave talks about “hiring,” he doesn’t only refer to attracting the most experienced and expensive “rock stars.” 

Investing in employee development or finding people with the highest potential and strong leadership is often better in the long run. 

Dave looks at four aspects of people operations:

• Onboarding: How quickly can you develop highly functioning employees?
• Reward & recognition: How does your organization recognize good work, and are the rewards relevant to each individual?
• Developing people: Does your organization create paths and opportunities for growth and leadership?
• Career ladders: Defining criteria for growth helps manage expectations while setting standards for hiring the right team members.

Infrastructure & Tools

DesignOps leaders must choose tools wisely. As Dave points out, “in the digital world, there is a stack of tools, digital and analog, that impact the use of their tools at the point of contact of craft.”

A case in point is how Erica Rider of PayPal tested many design tools before arriving at UXPin Merge. Erica needed a design tool to empower non-designers (PayPal’s internal product team) to design, prototype, test, and handoff new products.

With UXPin Merge, PayPal’s product teams drag-and-drop components to build fully functioning prototypes 8X faster than the experienced UX team using traditional image-based design tools.

Finding tools to fit the craft is crucial for team members to produce great work.

Governance & Workflow

Bureaucracy can often impede or slow team members from working or adopting new tools and processes. DesignOps must evaluate governance and workflows, removing roadblocks to increase delivery quality and pace.

Learn more from Dave Malouf

Here are some resources to learn more from Dave’s knowledge and experience:

• A Guide to UX Leadership – a free eBook from UXPin
• Holistic Design Operations – a free webinar hosted by UXPin in February 2022
• Challenges of Scaling a Design System – a discussion panel with top industry leaders hosted by UXPin and Whitespace

Increase Design’s Value With UXPin

With UXPin’s code-based design tool, designers and engineers speak the same language–facilitating better collaboration with smoother design handoffs.

Enhance your organization’s end-to-end design process to deliver a greater design ROI. Sign up for a free trial to explore all of UXPin’s advanced features.

The post 5 Powerful Insights About Design Value From Dave Malouf appeared first on Studio by UXPin.

At UXPin’s first annual Design Value Conference in March 2022, we hosted five design industry leaders to understand Design and DesignOps at some of the world’s biggest organizations.

Omkar Chandgadkar is a Senior UX Designer at Amazon Alexa Smart Home with a practical step-by-step approach to DesignOps. The humorous title of his Design Value Conference talk, “How to design a plane while flying it,” starts by discussing common design team challenges and how to develop strategic processes to achieve long-term goals.

One way to improve the end-to-end design process while enhancing cross-functional software development collaboration is through UXPin Merge. 

Sync your design system’s component library to UXPin’s editor, so designers, product teams, and developers all work with the same UI elements. Sign up for a free trial to explore code-based design and advanced UXPin features. Get a taste of Merge while using MUI kit in UXPin.

Common Design Team Challenges

Omkar starts his talk by highlighting three common issues with design teams using a plane-design analogy:

• Stuck on a blueprint: “We spend a lot of time on the big picture vision, but we ship none of those things.”
• Baggage fell off on the runway: “Most of our design gets scoped back and then never revisited post MVP launch.”
• Designing a plane while flying it: “I feel like I am involved at the last minute, for specs that were needed yesterday.”

Omkar has two solutions for these challenges that design teams can apply at all stages of the software development process.

1. Connecting the dots map: To help you get unstuck and gain momentum when faced with different tactical or strategic projects.
2. Design offerings: A proactive approach for you to be intentional about project intake to maintain a balance of tactical and strategic.

Framework One: Omkar’s Connecting the Dots Map

Omkar simplifies the software development process into sets of activities and milestones (dots) for design, product, and engineering. 

“Stepping into Design Operations is about realizing where these dots from different disciplines should intersect before moving to the next milestone.” Omkar Chandgadkar is a Senior UX Designer at Amazon Alexa Smart Home.

DesignOps practitioners must understand how artifacts across design, product, and engineers are interconnected. 

• What are these points of interaction?
• How do these artifacts inform each other?

How are Decisions Interconnected?

The aim of the connecting the dots map will help you identify how your orgs make decisions and how these decisions are interdependent. To connect the dots, Omkar asks four critical questions:

1. What areas can we invest in?: Shared documentation of the project’s current state, like a customer journey map.
2. What are the best ways to solve these problems?: Your product vision or “north star.”
3. What do we solve first?: This might be a shared set of launch goals, slide deck, etc.
4. What is the experience?: What are we shipping right now? i.e., sprint plans, design specs, wikis, etc. Launch-readiness documents.

To see Omkar’s Connecting the Dots Framework in action, check out the example scenario from 7:00 in his Design Value Conference talk.

Framework Two: Omkar’s Design Offerings

Omkar’s Design Offerings framework encourages DesignOps practitioners to take a step back and ask themselves, “What value does Design’s involvement add to different stages of product development?”

Omkar uses the Design Offerings framework in conjunction with Connect the Dots to create a set of product offerings from Design to the business. Examples include:

Horizons Class Project: A compelling product vision we can aspire towards in the next “x” years. Value:

• Reinvigorate product backlog
• Explore “What ifs”
• Build a compelling pitch to get customers/product team excited

Mountains Class Project: An end-to-end design for a major product launch this year. Value:

• Launch products that are usable and useful
• Spend time on end-to-end customer experience, edge cases

Plains Class Project: Optimized experience for an existing product to improve basic usability. Value:

• Refine and define UX patterns and update components
• Quick fixes for unimportant areas of the product
• Fix usability issues

Omkar recommends DesignOps marketing these offerings to PMs proactively, saying, “These are packages Design can offer your projects.” Omkar even created brochures, delivered them to PMs, and left them in public spaces to advocate for Design’s value.

Omkar uses his offerings to decide what type of support Design offers during project intake or when working through his product backlog. These offerings allow DesignOps to immediately identify next steps, assign resources, and begin work.

How to Use Omkar’s Frameworks?

Connecting the Dots Map:

• As a reference to navigate projects and create project plans
• As a mechanism to identify gaps in previously made decisions

Design Offerings:

• As a vehicle to educate partners about how they can benefit from design
• As an intake mechanism to balance tactical and strategic projects

To shift from “designing a place while flying it” (tactical) to a more strategic approach, Omkar’s frameworks help:

• Connect the dots on how decisions are made in your org. Use it to be proactive about future decisions and illuminate past decisions.
• Identify design offerings based on this mapping and use them for marketing design value and as an intake mechanism.
• Balance the distribution between your tactical and strategic projects through regular introspection.

Watch Omkar Chandgadhar’s Design Value Conference talk, How To Design a Plane While Flying It, for an in-depth explanation of his DesignOps frameworks and methodologies. You can also check out the complete list of Design Value Conference 2022 talks here.

Improve Design’s Offerings With UXPin Merge

UXPin Merge is a fantastic tool for creating Design value across the organization. Merge empowers non-designers, like product managers, to design, prototype, and test products without the help of UX designers.

PayPal’s Erica Rider proved this concept when she and her team created DesignOps 2.0–a framework where product teams complete 90% of design projects with UX designers providing mentorship, support, and stepping in to fix complex UX problems.

UXPin Merge also creates value for engineering teams and streamlines design handoffs. With a single source of truth between designers and engineers, UXPin Merge reduces drift, writing code, errors, and other time-consuming activities linked to image-based design tools.

Engineers no longer have to interpret or imagine what a prototype does because they use the same components with the same properties, interactivity, and functionality.

The post Omkar Chandgadkar from Amazon – Implementing DesignOps as a UX Designer appeared first on Studio by UXPin.

Erica Rider (UX Lead EPX @ PayPal) and PayPal are no strangers to UXPin. Erica has been very vocal in her praise for UXPin Merge over the years and how the technology revolutionized PayPal’s internal product development process.

At Design Value Conference 2022, Erica talks about PayPal’s DesignOps 2.0, a new framework for scaling design at the digital payment giant.

UXPin Merge played a crucial role in helping PayPal develop its new product development workflow. Request access to UXPin Merge and explore UXPin Merge and discover how code-based design can revolutionize your end-to-end design process. Sign up for a free trial and give UXPin Merge a try by designing with code components via our integration with MUI library.

Traditional DesignOps vs. DesignOps 2.0

With only five UX designers, including herself, Erica realized that a traditional DesignOps model wouldn’t fit PayPal’s needs. DesignOps’ principles work well for large design orgs but wouldn’t suit a 5-person team.

With more than one thousand engineers, DesignOps at PayPal had to incorporate design and development in a streamlined end-to-end product development workflow.

DesignOps 2.0 had to:

• Provide users a consistent and predictable user experience across all tools
• Enable product teams to successfully deliver useful and usable products
• Scale design significantly as efficiently as possible without adding new designers

After trying several popular enterprise design solutions, Erica and her team realized they had to create a hybrid DesignOps/DevOps framework. Instead of creating DesignOps, Erica and her team operationalized design within DevOps.

Evolution of Responsibilities

Erica realized one of the keys to realizing her vision was shifting the user experience responsibility from UX to the rest of the organization. Incorporating design into DevOps meant that product and engineering teams had to deliver products with a “good user experience.”

Product Teams

Product teams had to take on some UX responsibilities, including:

• Deliver products with a good user experience
• Conduct user research in collaboration with the UX team
• Design prototypes with guidance from the UX team

UX Teams

UX designers evolved from designers to visionaries and mentors. The department’s responsibilities changed to include:

Enable “Self-Service UX” for product teams

• Design and research tools easy for PD teams to learn and use

Provide mentorship and guidance to PD teams

• Team teams design thinking, user-centered design
• Help teams understand their place in the platform

Design solutions at a platform level

• Services that can be shared or are needed by most products

Solve big UX problems

• How to establish trust between users and the platform
• Build real-time user research analytics to collect both quantitive and qualitative user data directly in the platform

Educating Engineering Teams About User Experience

Erica had to shift engineers’ thinking of user experience as aesthetically-pleasing UI to problems that cause bottlenecks and roadblocks.

She created a product development workflow to demonstrate the user experience from an engineer’s perspective:

• Failed build–don’t know why? = poor user experience for engineers
• API contract changed–didn’t know that changed; who do I talk to? = poor user experience for engineers

Erica also discussed several user experience issues with product and engineering teams, including:

• Latency: If you click a button and it takes too long to load, that’s a poor user experience.
• Availability: If a URL doesn’t load, that’s a poor user experience.
• Security: If someone hacks my account, that’s a really bad user experience!
• Error messages that are not “human-readable” or have no way for the user to resolve them: “Error Code 1578-B1273 – FAILED!” Why are you showing this message to users without telling them what it means or how to fix it? Another poor user experience.

Erica used these examples to educate engineering teams about user experience as a full-stack problem. UX cares about these engineering issues, latency, availability, security, etc., because these all impact the user experience.

Evolving PayPal’s DesignOps 2.0 Process

When Erica introduced DesignOps 2.0 in 2019, it was to scale design and make work easier for a small design team.

Now that the process is operational, Erica and her team are looking at optimizing DesignOps 2.0 for product teams to deliver better products rather than a system to reduce designer workload.

Erica is working on a system to operationalize user research. The “Getting to DesignOps 2.0” roadmap still has three critical user research components to complete:

• Developing an understanding of the user
• Measure the success of UX
• Holding PD teams accountable

Accountability is one of Erica’s biggest challenges to overcome. Most companies have a significant control/accountability imbalance:

• UX designers have zero control over UX delivered to users but 100% accountability.
• Engineers have zero accountability for UX delivered to users but 100% control.

To deliver a great product with a good user experience, Erica believes designers and engineers must have balanced control and accountability. The UX team works with engineers to deliver a good user experience at PayPal, but the engineers are accountable for the final product.

Measuring the Success of UX

Erica and her team developed a wizard tool that automatically tracks user behavior and success rates during the product development process. This tool allows the UX team to track and identify issues.

Continuous & automatic collection of user metrics:

• Developers do not need to code anything special
• Automatically feed data for every instance of the wizard component to PayPal’s dashboards

Tracking time-to-complete and drop off rates:

• Total time to complete the workflow
• Time to complete each step
• Total drop off percentage
• Step with the highest drop off rate (used to identify step-specific issues)

Real-time qualitative data with strategic interrupts:

• Trigger interrupts when users are having trouble
• Only when a user meets the criteria

Baseline and benchmark analysis built-in:

• Is your time to complete going up or down?
• Is your drop-off rate improving?

We recommend watching Erica Rider’s 30-minute Design Value Conference talk for an in-depth explanation and context of PayPal’s DesignOps 2.0.

UXPin Merge Scaled Design in Erica’s Team

UXPin Merge played a pivotal role in helping Erica achieve her vision for PayPal’s new product development system.

Merge allowed Erica to empower product teams to build fully functioning prototypes without endless documentation and training–an impossible feat for a small UX team!

PayPal syncs 63 React prototyping components from a repository to UXPin’s design editor, so product and engineering teams use exactly the same UI elements–a single source of truth across the organization.

Working with engineers, Erica used React component props to set constraints and allow design flexibility. These constraints enable PayPal’s product teams to deliver consistent quality across its 100+ internal products.

If UXPin Merge can scale design for an enterprise organization with five designers and 1,000+ engineers, imagine what it could do for you! 

Sign up for a free trial to give a UXPin Merge a try by prototyping with an MUI library’s components synced to UXPin. Request an access to see full possibilities of designing with code components.

The post DesignOps Beyond Design Team at PayPal: How to Work with Engineers? appeared first on Studio by UXPin.