As digital designers these days, it’s typical to be working in an agile fashion.

Jon Aizlewood
Jon Aizlewood
24th July 2019

You know the score: the features get specced. The scope defined. The product owner creates the user stories. You roll up your sleeves and dive in. It’s Sprint 1 and the team are already estimating, the PO is grooming the backlog like a pro. Smashing. If you’re the designer, this is also where you might feel like this:

Jon with his head in his hands text reading 'this is Jon'

Designers thrive on exploration. We aim to find the best creative solution for the problem at hand. Sometimes this exploration takes time… a resource not in great abundance on agile projects. As the project dives into features and stories, it’s easy to get stuck designing details, with no real understanding of the greater picture.

Agile sacrifices cohesion in the name of creativity.

Agile and design is like looking at a picture through a keyhole. By slicing big things into smaller things, designers must work incrementally. It’s this incrementalism that can lead to what I call the ‘Frankensteining’ of a digital product or service.

Exquisite corpse representing the masthead, body and footer of a website
Andy Thornton’s Exquisite corpse for Clearleft.com 100 days project

Frankensteining occurs when products or services created using Agile become fragmented or disjointed. The fragmentation can lead to a lack of cohesion and vision, undermining the user’s experience.

Through the keyhole

Frankensteining occurs when products or services created using Agile become fragmented or disjointed. The fragmentation can lead to a lack of cohesion and vision, undermining the user’s experience.

There are many websites today that display this characteristic. You’ve noticed them yourself, consciously or not. Sites with headers that look nothing like the rest of the site. Pages in a booking flow that look and feel different from anything else in the same journey. These and many other examples are symptomatic of teams running agile; delivering continuously but lacking that integral zoomed-out view.

Design debt

One of the more sinister side-effects of Frankensteining is that of Design debt.

Technical debt is a term agilists are familiar with. It happens when developers cut corners to reach a goal or release cycle. They might take an ‘off-the-shelf’ solution to their problem versus doing it themselves. Each cut corner results in more time needed down the line to do it right. That more time equates to more money spent.

austinknight.com/writing/design-debt
austinknight.com/writing/design-debt

Design debt is tech debt’s evil twin. This debt occurs when a product’s design creeps away from its original roots. Like all debt, it will have to be repaid.

7 ways to make design and agile play well together

The fact is, Agile is here to stay. As a method for the efficient and effective delivery of digital products and services, it does the job and it does it well.

According to the 2019 State of Agile report, 97% of survey respondents stated their organisations practiced Agile development methods to some degree. 34% of that group said their organisations have been practicing agile for 3–5 years. 27% stated they’ve been practising for over 5 years.

Yet more than half (53%) of organisations using agile said their use of it was still maturing. This is likely due to design starting to take a larger share in the creation of many digital products and services.

Clearleft has been exposed to hundreds of internal teams, each using their own blend of agile, waterfall or a blend of the two. We’ve collected tips, tricks and insights to inspire other teams when trying to make design and agile play well together.

1. Use Sprint zero

Sprint zeros are common to developers, but designers don’t seem to use this pre-sprint enough. Starting before the actual work, designers can use Sprint Zero to better understand the product and its constraints.

2. Do a best first pass

Often in-tandem with Sprint Zero (or even preceding it), doing a best first pass can pay huge dividends later in an agile project.

Creating a high-level pass of your product allows designers to view the full size and extent of the project. Using all of the knowledge at your disposal at this stage you can better understand how the experience will stitch together. This will let you identify any gaps in the process, early.

A great way to do this: sketch lo-fi first passes of your product’s experience and align them in order on a large floor. Actually standing over your sketches to see how they flow together is highly under-rated!

3. Have a North star

A great way of reducing design debt: have a strong creative direction. This sets your North star, a term that’s apt as it maintains the direction of travel for a product team’s efforts. Setting a strong creative direction in a fast-moving agile project isn’t easy. You need to do just enough design without over-egging it. A great way of doing this is through something called element collages.

Element collage for the first Patterns day
Element collage for the first Patterns day

Element collages are a process we use often at Clearleft. They help kickstart the creative process without creating design debt. Element collages are mood boards of fictional and real-world UI elements. They let designers have free rein, quickly exploring new ideas and approaches. The collages solicit buy-in. They create a shared understanding of a design style and direction… without having to design any actual pages or features.

4. Get your Devs involved early

An under-rated but important tip (but your devs will appreciate it). With agile dependent on speed, there’s every likelihood for design decisions to be made without dev input. As the devs tackle your design approach, things can quickly grind to a halt, impacting the project as a whole.

Including your devs earlier in the design process lets them input into critical design decisions. It reduces risk and surprises, and lessens technical and design debt down the line.

5. Work in swim lanes

At Clearleft we prefer staggered starts for each discipline on a project, moving in parallel, like swim lanes. Keeping UX & Design at least a sprint ahead of development affords more freedom for design.

This staggered approach could be misconstrued as being a bit waterfall-y. And you know what? It is, and that’s not always such a bad thing!

6. Always zoom out

Zooming out at set intervals during a project sounds easy. Yet when you’re in amongst the weeds and designing the small details, it’s easy to forget.

At Clearleft we build zoom out points into each sprint. Similar to conducting a ‘best first pass’ this gives the whole team the opportunity to stop and review where things are and how they fit together.

The login screen designed and developed in Sprint 1 might not look anything like the account screen in Sprint 12. Being able to zoom out and take stock can pay dividends for reducing the Frankensteining of a digital product.

7. Keep 10% time

One of the most important lessons we’ve learnt over the years is to block out (and defend) 10% of every sprint’s time for fixing design bugs.

Building in 10% of time per sprint to seek, find and fix design issues works to improve the cohesion and experience of your product or service. This is where your Project Manager earns their keep. PM’s will need to fight extra hard to ensure designers have the time they need to refactor any design… just as developers are able to refactor code.

pie chart showing many different agile methodologies
No one knows what they’re doing

A post agile world

We’ve already started seeing signs of clients, organisations and agencies using parts of agile that work for them and discarding the rest. The diagram above shows that everyone is, in effect, winging it, using Agile as they need it. Apt, seeing as the agile manifesto always stated that it’s about “people, not process”.

As design gets more embedded into the fabric of the products we use today, as creators we must change our mindset. We need to champion design methodologies and design thinking in agile practice. We need to focus less on ‘shipping’; instead on creating unified experiences that benefit our customers more than our internal processes.

At the end of the day, your customers, your users, the humans who interact with your product or service… they don’t care how your product was made. They only want a great experience that lets them fulfil a task.

Don’t make design fit into agile. Make agile fit your design.

This article was originally published at jonaizlewood.com