What does it mean to ship a product? A UX perspective
UX design is part of the product development lifecycle, and designers have an important role in shipping products.
What does it mean to ship a product?
In digital product development, shipping a product refers to the final execution stage, where a product or feature is released to customers. When a product ships, it goes live and becomes available for people to use.
The typical product development process includes:
- Discovery
- Design
- Implementation
- Testing
- Execution
- Monitoring and Iteration
Why shipping a product is essential for UX Designers
Recently, I encountered a designer on Reddit who was questioning whether they were a designer because they had never shipped a product. They mentioned leading teams through discovery but "didn't do UI." This perspective shows a limited understanding of user experience. While design discovery is crucial, it's only one part of the overall design process.
Designers must transform abstract concepts like insights and requirements into usable, functional flows and user interfaces. Focusing solely on discovery means you're not fully designing. To ship a design effectively, it's essential to create designs that are:
- Shippable
- Communicated to engineers in a way they can understand
Failing to achieve these two goals will result in either:
- The product or feature not shipping
- The product shipping according to the engineers' or product manager's ideas rather than yours
As UX Designers, we create excellent user experiences and designs that work for our customers. If we're not delivering shippable, high-quality designs, we're not fulfilling our responsibility to our users.
UX design and its role in product development
The design phase occurs between requirements gathering and development in a typical product development process. Both digital and physical products are designed before they're developed.
In organizations without dedicated UX or product designers, engineers often handle design with guidance from product managers. When companies mature and hire designers, they sometimes mistakenly view designers as people who "make things pretty." While design does have an aesthetic component, it primarily shapes systems and user interactions.
Designers aren't solely responsible for shipping products; as part of the project team, we significantly impact how something ships and its quality level.
Design and bad UX
Creating shippable designs well-communicated to engineers is crucial, but we must also consider the entire experience. This includes all use cases, error states, and designing for common goals.
The quality of your design directly relates to how the product works. The design will feel broken and unusable if you forget essential use cases. Accommodating all scenarios users might encounter helps eliminate unknowns, but it requires capturing and designing for these scenarios.
The project team shares responsibility for ensuring the design incorporates all edge cases and use cases to make it functional.
Ensuring your design ships with high quality
The product development lifecycle involves producing design and documentation for technical teams to build. Building and shipping a product is a team effort, with each member playing a crucial role:
- Product managers represent the business problem
- Designers design the product
- Engineers are accountable for implementation
The team works together to identify customer pain points related to the business problem. If available, a user researcher can help identify opportunities and gather customer input on their pain points.
The project team then defines, builds, and ships the product to customers. The shipping part refers to the execution process in the product development lifecycle.
The role of interaction specs and annotations
Interaction design documentation is handed off to engineers and should contain enough information for them to implement the product using code. The specs need to provide precise instructions on how the design should interact.
Interaction documentation doesn't have to be in a separate document; it can be integrated into design tools like Figma. You can easily document design interactions and flows with prototypes to help engineers understand the layout, flow, and interactions.
Planning for technical constraints
An essential aspect of the annotation document is ensuring technical feasibility—whether the design can be implemented within the scoped timeframe.
For example, your design might require data from a source the engineers have yet to build. In this case, you'll need to either rework that part of your design to accommodate this constraint or have the engineers agree to develop the necessary functionality.
These conversations must occur before finalizing the design to prevent project delays or non-shipping. Such trade-offs are common in UX design.
As designers, we should be aware of the constraints shaping our experience. Just as architects and industrial designers work within the limitations of their medium, digital designers must do the same as part of the product development lifecycle.
Design communication approaches
The most effective way to communicate design with engineers is through a prototype and a design annotation spec or interaction document. Design annotation specs provide contextual notes on expected behavior and expose design assumptions. Once you've created the prototype and document, review them with the engineering team.
This review ensures everyone understands the expected design and opens up communication lines to deliver a high-quality product. Without annotations, you risk disappointment, as engineers often make design decisions without direction.
A precise, well-documented design produces a shipped product that delights customers and prevents surprises.
Final thoughts
Designers play a crucial role in shipping high-quality products. To ensure a great release, capture all critical use cases and essential details and ensure your design documentation communicates effectively. By doing so, you'll contribute significantly to the success of your product and the satisfaction of your users.
Resources
Figma annotation plug-in: