Designing for Success: Streamlining the Design QA Process in Product Development — Insights from Tamara
It is essential to consider the Design QA process from perspectives beyond just that of a product designer.
Let’s begin by highlighting the context.
As a company focusing on shopping, payment, and banking service, Tamara must build a solid sense of security and consistency to establish itself as a trustworthy financial service. Therefore, presenting high-quality products is crucial in gaining consumer trust and loyalty.
Product designers must ensure that these principles are incorporated into the designs of Tamara’s products. Their responsibility extends beyond the initial design phase and delivery to developers. Product designers should actively review and test to ensure the proper implementation of the designs and to identify any defects or bugs before the product’s release. This process is called the Design Quality Assurance (QA) process.
So what about the QA Engineer team?
Recently, we had some discussions to bridge the collaboration between product designers and developers. The QA Engineer team can support the design review and code testing phase. However, we realize that our QA Engineer team has a different approach where functionality aspects are the main parameters to consider, ensuring that all edge cases are covered and all components are in place for users to complete their tasks. The testing doesn’t thoroughly evaluate visual aspects, such as spacing between components, differences in text styles, or even more detailed aspects like how micro-interactions work
Each design team may have a different approach to conducting the design QA process. Regardless of the method used, it is crucial to document all feedback and consistently identify any issues in detail. This includes highlighting incorrect implementation and explaining the correct implementation and the correct value that should be used. Additionally, flagging any identified issues allows for easy identification and prioritization of areas that require immediate attention, enabling the team to allocate resources effectively.
Design QA should not overcomplicate
First, we need to realize that the design QA process will add a checkpoint to the development cycle. However, when we find an issue in our process, we focus on improving the existing process instead of adding more processes.
Understanding the root cause of an issue is a solid approach rather than just focusing on resolving it. Design defects and inconsistencies in development can arise due to various reasons. If every defect is the developer’s responsibility to fix, does this indicate that inconsistency always arises because the developer does not follow the design specifications? — It’s not always the case.
“This process is not about finding where the developer made mistakes.”
Let’s optimize the process
The product team needs to reflect and have a product development cycle that is designed to minimize errors as much as possible. All teams should be aware of the process, especially the main parties involved in the design QA process: the product designer, front-end developer, and QA engineer. Minor issues can be resolved quickly; we are just one Slack chat away. Yet, there are learnings we can apply to be more efficient without overcomplicating the existing process.
1. Interactive Refinement meeting
Conducting thorough and detailed refinement meetings during the handoff process is essential. These meetings allow developers to review designs, clarify anything unclear, and offer constructive feedback. By engaging in such discussions, the team can better understand the design flow and make more accurate estimations. Confusion often arises at this stage, particularly when developers are not allowed to participate and actively contribute their insights about the design.
2. Well-maintained Design System
We can argue about the consistency of our product, but the important thing is that we need to define guidelines for how our product should look. Without this understanding, discussing consistency becomes challenging and lacks substance. One way to initiate this is by creating a style guideline or, on a larger scale, a design system.
A well-maintained design system certainly requires significant effort from product designers and developers. The design system may evolve to meet new requirements for any new product as necessary. However, this is a worthwhile investment to minimize inconsistencies. Even though this cannot guarantee the prevention of defects, it can build the same awareness between product designers and developers about the existence and importance of the design system. By doing so, we can minimize the chances of encountering issues such as inline styling or using random new classes, making code maintenance difficult for developers.
3. Make the process official within the team
The design QA process often needs a shared agreement within the team. Ensuring the design QA process is a key element in every task’s acceptance criteria is crucial. Additionally, everyone should be aware of the need to estimate design QA. Ignoring the estimation of design QA can impact other timeline constraints, as implementing feedback may take longer than anticipated.
4. Prioritize and Document Design Debt
Developers may only sometimes be able to address all the feedback from defects identified during the design QA process within the same sprint. This could be due to time constraints or limited capacity. However, it is essential to note that allowing these defects to accumulate over time contributes to the overall Design debt. It is crucial to avoid developing a product with inconsistencies, as this negatively impacts the user experience and leads to confusion. Remember, ensuring the trustworthiness of our product should be our top priority.
Design Discrepancy Report. This is a report created to document any identified defects or bugs during the design QA process. List down all the feedback and defects, then align with the team to prioritize which improvements are crucial for the release and which can be considered for future enhancements. Clarity enables the team to consistently monitor the latest version in production and estimate timings for implementing improvements.
Take away
The benefits of an effective design QA process are significant. It builds a reputation for Tamara as a trustworthy product, enhances productivity and efficiency by catching design issues early on, and helps prevent the accumulation of design debt over time. By incorporating design QA into the product development cycle and making it an integral part of the team’s workflow, Tamara can ensure consistent and high-quality products that meet user expectations and contribute to overall product success.
