Design Ahead: Harmonizing Design and Development Timelines for Optimal Results

Many times, I have come across organisations where the design people must run at least one week or one sprint ahead of the development people. In this article I share the design ahead approach, a possible option for aligning the the design and development timelines.

What is Design ahead?

Design Ahead is an approach where design professionals concentrate on UX research, design, and prototyping for upcoming features or user stories in advance. This preparation ensures that the developers receives well-defined and thoroughly planned work items, enabling them to effectively start on their work.

The Design Ahead approach helps in aligning the design and development timelines, ensuring that the developers have clear and detailed user stories to work on. It also provides room for iterations and improvements in the design before development starts, ultimately enhancing the overall product quality and user experience.

?

When to use Design ahead approach?

The “Design Ahead” approach is best suited for various scenarios in software development:

1. Complex Projects: When dealing with intricate user interfaces or complex interactions, designing ahead allows for thorough research and thoughtful design decisions.
2. Iterative Development: In projects requiring continuous iterations, having designs ready in advance enables developers to implement new features after each iteration.
3. Cross-Functional Collaboration: In situations demanding close collaboration between different teams (e.g., design team and delivery team), having designs prepared in advance ensures clear communication and seamless integration.
4. Projects with External Dependencies: In projects reliant on external factors like third-party APIs or hardware components, designing ahead enables effective planning, accommodating these dependencies during the design phase.
5. Innovation and Exploration: For projects involving innovative features or exploring new technologies, designing ahead offers a dedicated space for brainstorming, experimentation, and idea refinement before actual implementation.

It’s important to note that while the Design Ahead is a viable, it should be balanced with the option of having one aligned team designing and developing at the same pace.

When not to use Design ahead?

The “Design Ahead” approach may not be suitable for every project or situation. Here are instances when it might not be appropriate to use the Design Ahead approach:

1. Simple Projects: For straightforward projects with minimal user interface complexity or known, standard solutions, investing extensive time in designing ahead might lead to unnecessary delays and inefficiencies.
2. Rapid Prototyping: In situations where rapid prototyping and quick validation of ideas are crucial, spending a significant amount of time in the design ahead can hinder the agility needed for rapid iterations and experimentation.
3. Uncertain Requirements: When project requirements are highly uncertain or likely to change significantly, investing too much time in designing ahead can lead to rework if the designs need substantial revisions due to evolving requirements.
4. Tight Deadlines: Projects operating under extremely tight deadlines might not afford the luxury of a design ahead approach. In such cases, it’s often more practical to integrate design and development efforts closely within shorter cycles.
5. Limited Resources: In resource-constrained environments, allocating an extensive amount of time to design ahead might strain the team’s capacity, leading to neglect of other crucial project aspects.
6. Highly Agile Environments: In highly agile environments where rapid adaptations and continuous feedback are paramount, rigidly following a pre-defined design might hinder the team’s ability to respond quickly to changing user needs or market demands.
7. Projects with Evolving Technologies: When working with emerging or rapidly changing technologies, the Design Ahead approach might become obsolete or less effective as new tools and methods emerge during the project’s lifecycle.
8. Projects with Strong Client Involvement: In projects where clients prefer active involvement in the design process, immediate collaboration between the client and the development team might be more effective than having designs prepared too far in advance.

In these situations, a more iterative and adaptive approach, where design and development activities occur concurrently, might be more suitable, allowing for quick adjustments based on evolving project dynamics and requirements.

?

Design Ahead and Scrum

Scrum, as defined by Scrum.org, is a comprehensive framework for developing and sustaining complex products, encompassing roles, events, artefacts, and the rules that intertwine them. Within this framework, the Sprint Backlog stands out as a vital plan meticulously crafted by Developers. It vividly illustrates the tasks to be accomplished during the Sprint, steering towards the achievement of the Sprint Goal (source: Scrum.org).

However, there are scenarios where the Scrum team finds it imperative to adopt a Design Ahead approach before the Sprint Planning session. In this context, features are meticulously detailed, either in user stories or tasks, depending on the preference.

These Sprint backlog items, integral to the Sprint, often hinge on preliminary design work. This includes crucial activities such as user interviews, prototyping, UI design, and UI content creation. For the Development people to seamlessly carry out their tasks during the Sprint, these design elements must be ready and available right from the Sprint’s beginning.

In essence, the Design people, operating in Sprint N, diligently prepares the artefacts necessary for the development work in Sprint N+1. This synchronised collaboration between design and development ensures a smooth workflow and enhances the overall efficiency of the Scrum process.

It is important to emphasise that utilising the Design Ahead approach does not imply the exclusion of design professionals from the Scrum team. It is entirely possible to embrace Design Ahead while still fostering a unified team dynamic. In fact, this collaborative approach is highly recommended; a cohesive, multifunctional team striving towards a shared objective. The key distinction lies in the specific tasks undertaken by each team member at any given time. For instance, a design professional might be engaged in crafting a prototype for a feature that developers will implement in the subsequent Sprint. This synchronised effort ensures that every team member’s contributions align seamlessly, propelling the Scrum team forward cohesively.

?

Design Ahead and Kanban

Kanban, renowned for its ability to manage the workflow of an incremental and evolutionary process, operates on the principle of visualising the workflow and taking action to prevent team overload. In the realm of Kanban, specific boards serve as visual representations of work progress and allocation.

For a typical Scrum team working on a digital product, the progression from Backlog to In Dev to Testing and finally Done is a standard kanban board configuration. This structure ensures the systematic execution of development tasks without overwhelming team members.

On the other hand, typically, design people utilizes a different kanban board layout: Design Work To Do, Design Work In Progress, Ready for Dev. This specialised configuration caters to the unique demands of design work. By visualising the tasks at simple stages, it enables efficient design planning and execution.

In some instances, a unified Kanban board can seamlessly blend these workflows. This unified board encompasses stages such as Design Work to Do, Design Work in Progress, Ready for Dev, In the Backlog, Dev Work, Testing, and Done. Alternatively, two separate boards can be implemented, with one board positioned downstream of the other, ensuring a streamlined flow of work from design to development completion.

By integrating the principles of Design Ahead with the flexibility of Kanban, teams can achieve a harmonious workflow that maximizes productivity, minimizes bottlenecks, and ensures the successful realisation of projects. This adaptable approach ensures that both design and development people can effectively collaborate, resulting in superior outcomes and satisfied stakeholders.

An Example of Design Ahead

In a recent collaboration with a startup team, during a Lean Inception workshop, the team aligned on the first few features for the startup Minimum Viable Product (MVP), Then, a few weeks after the workshop, the team tackled a very important feature: the Parent Competency Assessment for their mobile app. This feature empowered parents to evaluate their interactions with their children through a structured competency assessment.

As we delved into the development tasks, we identified several crucial components:

• Prepare the Competency Categories Table: Adding the competency categories to the database was foundational to the assessment’s success.
• Update Parent Records: Implementing the functional code to add the selected competencies and their corresponding levels to parent profiles.
• Integration Testing: Developing comprehensive integration tests to ensure seamless integration with existing parent features.
• Create Competency APIs/Microservices: Building the necessary backend services to handle competency data.
• UI Development: Coding the user interface prototype that seamlessly connected with the new competency APIs.

However, before diving into these tasks, there were pivotal prerequisites. Design Ahead became instrumental in ensuring the feature’s effectiveness and user-friendliness. The design people faced two primary challenges:

1. Comprehensive Competency Categorisation: Creating a categorisation system that not only aligned with professional standards, endorsed by doctors and psychologists but also resonated with parents. It needed to strike a balance between complexity and simplicity, ensuring it was meaningful and user-friendly.
2. Prototype Optimisation: Addressing the common concern raised by parents – the tedious and time-consuming nature of such assessments. The design people undertook the task of solving this problem, aiming to make the process engaging and efficient for users.

Given the startup’s agile framework with one-week sprints, this feature was slated for Sprint 4. During Sprint 3, the design people focused their efforts entirely on this feature. Their objective was clear: to finalize the best design proposal before the Sprint 4 planning session, a goal they successfully achieved.

This proactive approach not only streamlined the development process but also ensured that the resulting feature was not just functional but also user-centric, aligning seamlessly with both professional expertise and parental needs. The Design Ahead strategy significantly contributed to the feature’s success, marking a vital milestone in the app’s journey.

?

Design ahead and Dual track development

Dual track development, also known as dual-track scrum, is an agile development practice that combines discovery (exploring and validating ideas) and delivery (building and releasing features) tracks in parallel. When synchronised with the Design Ahead approach, it creates a powerful synergy, ensuring that both ideation and implementation phases are well-coordinated.

What is Dual Track Development?

Dual track development recognises that software development isn’t a linear process; it’s inherently iterative and involves two parallel tracks:

1. Discovery Track: This track focuses on exploration and learning. It involves activities like user research, user interviews, and prototyping. The goal is to identify user needs, pain points, and potential solutions.
2. Delivery Track: This track is where the actual development takes place. It involves coding, testing, and releasing features based on the insights gained from the discovery track.

Read more on Dual Track Development from the creator original blog post.

?

Integrating Design Ahead with Dual Track Development

Let′s look in how design ahead is well integrated with dual track development.

• Discovery Track and Design Ahead:The Design Ahead approach perfectly aligns with the discovery track. While the discovery track explores ideas and validates concepts, Design Ahead ensures that the design people is one step ahead, preparing detailed prototypes and user stories (or another form of requirements) for the upcoming features.

• Delivery Track and Design Ahead: As the discovery track provides valuable insights, the design people can work ahead on the identified features. By the time the development work kicks in, detailed designs, prototypes, and user stories are already in place.

?

Benefits of Design Ahead and Dual Track Development:

1. Reduced Development Time: With design elements ready in advance, the development people can start their work immediately, eliminating downtime between design and implementation.
2. Improved Collaboration: Dual track development encourages constant communication between the discovery and delivery tracks. Design Ahead ensures that the communication is streamlined, with clear documentation and visual prototypes guiding the development process.
3. Enhanced Product Quality: Thorough research and design iterations, facilitated by Design Ahead, lead to a well-thought-out product. By integrating this with dual track development, the end product is not only functional but also highly user-centric, meeting the precise needs of the users.
4. Flexibility and Adaptability: The iterative nature of both Design Ahead and dual track development allows for quick adjustments. If insights from the discovery track necessitate design modifications, the design people can swiftly iterate, ensuring that the changes are seamlessly integrated into the ongoing development process.

Integrating Design Ahead with Dual track development methodologies offers a robust framework for organisation's aiming to stay ahead of the competition. By strategically aligning ideation, design, and implementation, teams can create innovative, high-quality products that resonate with users, setting new benchmarks in the ever-evolving tech industry.

?

Design Ahead and Lean Inception

The Design Ahead approach, while powerful, can sometimes create a disconnect between design and development people. To address this challenge, aligning everyone on the product vision and desired outcomes becomes crucial. This alignment is precisely what the Lean Inception workshop facilitates.

In just a few days, the Lean Inception workshop unites the entire team—business, design, and development—establishing alignment not only on the product vision but also on the sequence of desired outcomes. During the workshop, the team plans the Minimum Viable Product (MVP), the simplest version of the product to validate key hypotheses, along with subsequent increments. These plans map outcomes and hypothesis validation to features and output, guiding the team’s work.

Throughout the Lean Inception workshop, artifacts such as the sequencer and the MVP Canvas are generated. These artifacts provide clarity on the initial features deemed essential to achieve the desired outcomes. However, the workshop itself doesn’t delve into detailed design activities, leading Scrum teams to often adopt the Design Ahead approach. Following a Lean Inception, it is common for Scrum teams to utilize Design Ahead, ensuring meticulous design outlines before transitioning to feature development. This collaborative integration of Lean Inception and Design Ahead harmonizes the initial aligned vision with practical design, ensuring a smooth transition from concept to implementation.

?

Design Ahead and the PBB Canvas

In the Design Ahead approach, the design people initiates the process by researching and deciding on the design prototype for a feature. Subsequently, the Product Owner (PO) formulates user stories for the features, incorporating design information, acceptance criteria, and development tasks.

Certain teams, especially those emphasising collaborative work, leverage the PBB Canvas to dissect features into user stories. They collaboratively write and prfioritize these stories for inclusion in the next sprints backlog. The PBB Canvas streamlines the transition from the feature and prototype level to well-crafted user stories, encouraging collaborative writing and effective prioritisation within the team.

?

Conclusion: Orchestrating Success in Software Development

In the intricate dance of software development, synchronizing design creativity with technical prowess is essencial. The Design Ahead approach, seamlessly integrated with dual track development methodologies, offers a refined solution to align these crucial aspects. Understanding the delicate balance between design and concurrent workflows is the essence of innovation.

By strategically weaving Design Ahead into methodologies like Scrum, Kanban and Lean Inception, teams create an environment where creativity thrives and projects flourish. As technology evolves, embracing Design Ahead becomes pivotal, ensuring our products not only meet but exceed user expectations. In this symphony of innovation and implementation, Design Ahead takes the lead, orchestrating a future where exceptional user experiences define our digital landscape.

This article was originally posted at Caroli.org