Go back Close

This was our first cue to dig deeper into the shift in the approach to designing websites. The traditional “waterfall” method gave everyone a headache. Eventually, we have arrived at the conclusions shared in this article. We hope it saves you hours of research and pushes you in the right direction – no matter if you’re an agency or a business struggling with the endless delays of digital projects.

What is agile design?

Agile design is a collaborative process where a cross-functional team breaks tasks down into smaller items.

These items are actioned during short periods of time called sprints, which can last between one and four weeks. At the end of every sprint, the team inspects the progress and adjusts the direction if needed.

In terms of agile web design, sprints usually need to be just one week long. As explained in the description of the agile web development process, building a website is not as complex as developing software – hence web design calls for shorter sprints to improve communication and the alignment of the team.

The benefits of agile web design

  1. It’s collaborative. Agile increases the sense of ownership across your organisation. The process thrives on diversity.
  2. It’s visual. Not only in the sense of design but also in the tools used for agile project management. Creative work is hard to estimate and track, but agile makes the progress more tangible.
  3. It’s granular. You’re not designing “a home page”, or “a website”. Every task is split into manageable sub-tasks. This gives your team frequent opportunities to inspect the progress and give feedback before changes become too costly to make.
  4. It’s user-centric. In textbook agile, a task is only done when the team made sure it works for the user. Of course, there are no guarantees. But the process is all about validating features with the target audience and reducing the risk to a minimum.
  5. It’s predictable. At least long-term. We, humans, are terrible at estimating. The granularity and iterative nature of agile helps with that in the long term.

Principles of agile web design

The most important rule of agile is to ditch perfection. In the agile methodology, progress is much more valuable than lengthy discussions. The emphasis is on building, testing and iterating the solutions. Agile encourages:

  • Daily stand-up meetings of the agile team (usually not longer than 10-20 minutes)
  • Tangible outcomes over documentation
  • Customer-centric approach with frequent user tests
  • Rapid prototyping
  • Continuous delivery by working on a Minimum Viable Product
  • Flexible response to change

How to switch to the agile design process

When we decided on a transition to agile, we were extremely excited. We knew we were onto something, but we had our objections. We couldn’t fully embrace agile just yet.

Now, how do you write the copy for a website in the agile model?

What about the design?

Can we be part of something that was originally built to produce software?

Marketing strategy?

It’s getting crazy here.

The final thorn in the neck is the difficulty of pricing the project upfront. You can’t commit to a fixed price, because agile goes against the concept of being tied down. In hindsight, this is a great advantage of agile, yet many clients will want to know the cost before they jump the ship. They’re used to the traditional approach and you can’t blame them.

Using the Design Sprint in an agile process

It wasn’t long before we found the solution. Or, to be accurate, the inspiration for the solution. It was the Design Sprint workshops, originally invented by Google Ventures and used to build software and brands from the likes of Gmail, Red Bull, and more.

In short, our interpretation – a Web Design Sprint – is a way to build a user-tested prototype of a website in a week. Yes, you read that right. In just a single week. We always recommend running at least two iterations to iron out issues and action the feedback from user tests, but in extreme scenarios, it could take a single week.

We achieve that by running three workshops with the client’s team, which then help us build a prototype in just one day. On the final day, we test it with the target audience, and that’s a wrap. This article is not the place to go into the nitty-gritty, but if you’d like to learn more, here’s a deep dive into our agile process.

This gives us a solid foundation and the much-needed headstart for the designers. With a validated prototype, we can design the website in parallel with developers working on the backend features.

Have you struggled to work using the traditional waterfall methodology?

Let me know in the comments about the worst things that happened to you because of using waterfall. I’ll let you know how these could’ve been avoided when working in an agile way.

Estimating design in agile

There are well-documented ways to estimate development complexity in agile. But for us, the design was a bit of a pickle. We’ve settled for the t-shirt size estimation of designs. This means that tasks for our designers get assigned a letter from S to XL, just like clothing sizes. This is the typical scale, but nothing is stopping us from using XS or XXXL if needed.

It’s an internal metric and a rather abstract one. That’s because there are a few things that impact the “size” of a design:

  • the number of components – an MVP of a button consists of the backplate and text; it’s much smaller compared to navigation which potentially includes a logo, several buttons and other components.
  • the number of interactions for each component – a paragraph generally has just a single state, while a button has a hover-over effect, an on-click effect, a disabled variation, etc.
  • features of a component – estimating designs is the first step to developer estimates because design dictates the features that will be needed

Estimating creative tasks was never easy, regardless of the approach. The main benefit of t-shirt size estimation is to take the focus away from time. As you may already know, agile is all about the users. Design estimates are still important internally, but you don’t want team members to worry about committing to a specific timeline for each individual task.

The difference between collaboration and “design by committee” – FREE PDF

Learn how the perceived collaboration of “design by committee” hurts your website, and what you can do to improve it. We give you immediate access to the PDF – no personal data needed.

Open the guide

Originally published Dec 12, 2019 9:37:00 AM, updated September 7 2023.

We expose the secrets of B2B websites to inspire your team.

Bimonthly website breakdowns for marketers and business owners.

Sign up for Webabunga!