Evolutionary Website Design

Iteratively improve your website user experience using the oldest scientific process in nature.

No design is ever perfect – and yes, fellow Apple fans, that includes your beloved products too. In fact, the iPod provides an excellent example of how a good design can become iteratively better with mass feedback and as the surrounding environment evolves.

Creative Commons licensed image by juanpol.
See also: 7 Years of iPod evolution on wired.com

The same applies to your website; no matter how much user testing, standards-compliance or best practice you have undertaken, it can always be better. Unfortunately, we do not have the same intrinsic beauty of Mathematics in our industry: there are no exact solutions for our problems. All we can do is continually strive to get a better answer, one that fits more closely.

We should be used to this ‘never good enough’ process; we have after-all been undergoing it for billions of years via evolution. In programming, we have taken this idea – which is fundamentally ‘trial and error’ – and applied it to a range of problem domains, under the name of ‘Genetic Algorithms’. The web industry can use the Genetic Algorithms approach to good effect too: Let’s take a look how.

Mutants are your friends

There are three steps you’ll need to take for each iterative improvement:

1. Determine the mutations,
2. Implement mutations via multivariate testing,
3. Measure responses and adapt accordingly.

Step 1. Mutations are small changes to your website. All the different features that make up the style of your website (developers amongst you will be thinking CSS attributes) can be a different target for mutation. These can include font size, line spacing, foreground and background colors, link behaviors and widths and heights.

You’ll also want to consider non-style elements that can be easily changed, such as variations in content (menu labels, calls to actions) and imagery. To stay true to the method we are attempting to copy, you should try to include at least some ‘random’ mutations: those that you may not think will work, but could produce a surprising result.

Step 2. Using a multivariate testing tool (such as Google Website Optimizer), implement as many of the mutations as you can for a small subset of your users (best not to refer to these users as ‘mutants’ though, if you value their patronage).

If you want to start more simply, opt for testing single changes at a time (A/B testing), but this doesn’t follow the evolutionary route so closely: would our opposable thumbs haven been so useful if our arms hadn’t also grown longer?

Step 3. This is trickiest step, where we’re not quite as clever as nature: working out which mutations are successful. Your multivariate testing tool should provide you with a range of metrics for each mutation (and, importantly, combination of mutation permutations).

Exercise caution when analyzing the meaning of these metrics: an increased session duration may be an improvement if it means the user is buying more product, but it could also mean the readability and signposting has taken a turn for the worse.

When you think you know which improvements to implement, make an evolved version of your site and A/B test it against the current version (again, with a subset of users) before deciding to roll out the new ‘stronger’ mutation as the default website.

And then repeat the process. Forever…

Conclusion

Evolutionary Website Design is a long-term take on standard multivariate testing, with a more random approach to choosing test versions. By constantly offering small changes to a subset of your audience, you can continually improve your user experience, potentially adapting to changes in audience behavior before they have been identified and analyzed.