Make sure your design ships every time and with high quality.
The product development lifecycle UX entails producing design and documentation for technical teams to build. Building and shipping a product is a team sport and everyone has a role. Product managers are responsible for representing the business problem. Designers are responsible for designing the product. Engineers are responsible for implementation. The team works together to determine customer pain points as it relates to the business problem. If you’re lucky you’ll have a user researcher to help identify opportunities and gather customer input on the pain points they’re experiencing.
Consequently, the project team works together to define, build and ship the product to customers. The shipping part refers to the execution process in the product development lifecycle.
The role of interaction specs and annotations
Oftentimes but not all the time, the product manager defines the product from the business perspective in the form of a requirements document. However, in organizations with light documentation, the product definition falls to design. In these cases, the product definition is in the form of an interaction spec or annotation document. This design document is handed off to engineers, and should have enough information for them to implement the product using code. As a result, it’s essential the document is clear in its instruction for how the design should interact.
Planning for technical constraints
An important aspect of the annotation document is ensuring technical feasibility. Technical feasibility is whether the design can be implemented in the timeframe scoped or at all. For example, you might have a design that pulls data from a source that the engineers haven’t built yet. In this case, that part of your design will need to be reworked to take in this new constraint. Or, the engineers have to agree to build out the functionality for the project.
It’s essential these conversations take place before the design is finalized. If not, the project might run late or not ship at all. These trade-offs are commonplace in UX design. As designers we should be aware of the constraints that will shape our experience. Just like architects and industrial designers must work within the constraints of their medium, so must digital designers.
Design communication approaches
The easiest way to communicate design with engineers is to create a prototype, and a design annotation spec or interaction document. Design annotation specs provide contextual notes on what behavior is expected, and expose design assumptions. Once the prototype and doc is created, review them with the engineering team.
Reviewing the interaction design spec with the engineers gets everyone on the same page on what the expected design should be. A clearly written annotation spec opens up the lines of communication to make sure you’re delivering a high quality product. If you don’t deliver annotations, you might end up disappointed. Engineers will often make decisions about the design in the absence of direction.
A good clear documented design results in a shipped product that delights customers and ensures there aren’t any surprises.
Figma annotation plug-in:
Checklist of engineering handoff