Iterative Design – Building Effective Websites Over Time

In the beginning there was a new website or a redesign… and people were impressed. Compliments were passed. Beer was shared. The website was built according to plan—populated with snappy content and interesting images—and it finally launched with a sigh of relief. Months passed and people were (still) impressed. But analytic data started to tell a different story. Underutilized pages, headlines and calls-to-action that worked less well than others…CRM data revealed a pattern of complex purchases requiring a phone call to the customer service desk rather than being completing online. What to do? I mean, you DID usability testing. You had focus groups!

We think of websites as constantly evolving, at least when it comes to words and images. But what about the design of the website? Should the website design constantly evolve too? If websites remain static, their biggest strength (near-instant adaptability and change) turns into its biggest weakness (irrelevance and obsolescence).

Consider how often you notice CNN or Amazon changing their web design—hardly ever, yet their sites are constantly evolving. Favoring minor, data-driven changes (the movement of a button up the page, a slight change in text size, rearranged navigation elements) that nip and tuck the user experience into the seamless, rather than rearrange-everything design overhauls.

We need to shift our mindsets: ‘redesign’ to ‘iterative design.’ It requires us to think about building websites that are purpose-built for change, much like a theatrical stage is designed to support any kind of set or lighting transformation.  

1. Retire risk early. If you attack the biggest, riskiest parts of a project first, the course corrections that follow are likely smaller and less costly downstream. One of the biggest risks in website building is how the aesthetic design concepts (the look/feel) will interact on the device itself. How will the page respond as you mouse-over? How about on a mobile device? How will information be revealed to the user and how do you design for slower mobile network speeds? Frontload the most critical design decisions and work on those first. What you learn by solving these problems will likely serve you well on the rest of the site.

2. Prototype using paper. Why paper? It’s ubiquitous. It’s tactile. You can point to it, poke at it, and crumple it up. It’s low-tech and everyone knows how it works. Which leads me to #3.

3. Make everyone prototype. Yes, everyone. Ask them to sketch on paper how they visualize solving a particular design challenge of the site. Walk them through one scenario at a time and assure them that a first-grade level drawing is all that’s required. When they say they’ll ‘talk you through it’ instead of drawing it… hand them a pen. There is something magical about having someone sketch it out on paper—it brings them into the problem-solving mode with you. It makes them face nuances and complexity of the design they’d otherwise not have to encounter. 

4. Build a MVP (Minimally Viable Product). When you’re building a new website, it’s a great idea to have the developers erect working prototype pages as soon as design concepts take shape. If you’re iterating on part of an existing site, create “1.0” of these new pages and launch them. Get these pages in front of real users right away before you’ve polished and perfected them. Your analytics will tell you a lot about what works well and what doesn’t.  

The point is to not be afraid to launch “1.0” website pieces—watch, learn, iterate— then launch “2.0”— watch, learn iterate— and go from there. Google does it. Facebook does it. If it backfires, they call it a bug and fix it or roll it back. This is a concept that is totally foreign to traditional media forms but native to the web. Beta that sucker!

5. Data is the key for iterative design to work.  Finding a data nugget (maybe it’s the conversion rate on your key product pages or finding the biggest drop-off point during register) will set you on a path for refining your site to perform at its best. You can make a huge difference by just tuning one or two key pages. 

6. Approach website budgeting holistically. How to pay for all this? Instead of thinking on a 3-4 year big redesign/rebuilt cycle, spread that budget out over time. You may still have to do ‘big bang’ rebuild (see New York Times 2007-2014 redo) but it will be far less frequent if you learn to adapt and change your site to keep it looking fresh and responding to data insight iteratively. If you have a developer on-staff to make the code changes, great! If not, find a web development partner who also gets this iterative design concept and negotiate a fair price with them. 

The United States Digital Service has an unofficial motto, “Make New Mistakes.” I like this idea. Take risks, expect to fail, expect to grow and change, and know that you will establish new and more successful ground. Repeat.

Kristin Darrow leads the web products division at Tessitura Network.  @krdwerd | @tessnetwork