Authored by Primate

A rather awesome, informative
and witty blog about all things web

Using Personas To Help Create Better Web Sites

Tom Cruise from Magnolia

Many a person has wished Tom had spoken these words to them

For a while now we’ve been going through a process of creating personas for every web site we’ve been commissioned to develop. Rather than unleashing the savage beast that is Espen straight onto Photoshop, we’ve been taking a moment to sit down and really have a think about what the heck we’re doing. Who’s the target audience? What’s the personality of the site? How would it talk if it were a real person? What techniques are going to be used to really engage and capture people’s attention? These are all very important aspects to consider.

Although we’ve only been doing these for a few months now, personally I find it very exciting and, as a company, we’re starting to see some great results from it, not just in the overall quality and effectiveness of our final products but also in terms of guiding our clients through the design and copywriting process. So, with that in mind, we figured it would be fun to share our processes with the world and take a look at what’s involved in each step and, at the end of the day, what the potential benefits are.

Of course, I can’t publish any documents that we’ve made for client project so we’ve put together an entirely fictional example just for this article called the SEOBeast.org. It’s actually an idea I had a couple of years ago for a SEO/SEM blog that has a particularly, ah, macho style to it. You’ll find out more if you download the related material at the bottom of this article but, suffice to say, they are a tad indulgent. What can I say, I have a flair for melodrama.

Why bother?

First up, it’s important to note that you can’t really do any of this stuff without your client’s help and collaboration. It’s all about getting as many details out of them upfront as possible and then basing your material on the information they supply. As much as I’d love to spend weeks with clients, really digging into their business and doing the necessary market research to truly understand their target audience, it’s just not possible (although I dare say I’m sure some big agencies do go to those lengths) so ultimately there is a certain amount of guesswork involved based upon your own common sense and logic and the client’s knowledge. Still, establishing their goals, message, values etc is important as it will form a foundation for all of the persona material and then the entire site.

It’s also worth noting that none of this stuff is particularly new or original and we’ve simply copied from the greats out there and tweaked the material they are already using. Message First utilise an amazing persona model which we ripped off for our own use (although ours is far less sophisticated), Aarron Walter’s fabulous design persona for MailChimp proved to be heavy inspiration for our own document of the same name, and finally we even stole a few ideas from the wonderful Erin Kissane and the brilliant Colleen Jones. I ease my conscience into sleeping soundly at night by telling myself that all the best artists steal. That and Nytol.

“Who are you trying to reach? You can’t influence people if you don’t know much about them.”

- Colleen Jones, Clout

But to answer the question ‘why bother’, I guess we need to look at what we’re actually trying to achieve by producing this material. Ultimately, it should:

  • create a process that forces consideration of all of the aspects of the project upfront
  • help focus design and give the designer something to measure concepts, ideas and layouts against
  • make the design and copywriting process faster, more considered and less arbitrary
  • improve content and copy, creating a clearly defined, consistent style
  • ensure that the style, tone of voice and level of technical difficulty suit the intended audience

and perhaps most importantly:

  • allow us to come up with engaging concepts where everything has meaning
  • create something truly memorable and influential
  • breathe life into the client’s brand and give their online profile a distinctive personality

User persona

SEOBeast.org user persona
The primary point of a user persona is to help define the target audience for a project. It’s meant to reflect the typical user, the type of person that the site is aimed directly at and summarise their personality, likes, dislikes, knowledge, goals and influences. Of course, as mentioned before, without conducting a whole lot of detailed market research, the user persona is likely to never be 100% perfect but it’s still a very worthwhile asset to have as it makes you think about what you’re creating and, more importantly, who you’re creating it for. At the end of the day, it’s absolutely vastly important that the user persona likes the design persona and that there is a connection between the final product and the user.

For our user peronas, we break them down simply into a detailed background description and lists of goals, influences, knowledge, pains, and influences. We also name them, find an appropriate photo on the web, and give them an age and job title to try and make them as identifiable as possible. When we can, we also base components of them on real people we know.

Design persona

SEOBeast.org design persona

After creating a user persona, we put together a design persona, a document inspired by Aarron Walter that details as much as possible about the identity of the web site we’re delivering. A great way to do this is through anthropomorphism, asking ourselves the simple question ‘if this web site were a person, who would it be?‘ as it makes you think about all of the the characteristics and traits that your creation might embody, forming a unique entity with its own traits and personality. Detailing the voice of the site, along with copy examples, is also very important at this stage too as it informs and guides the entire copywriting process, helping to create a consistent and cohesive writing style.

In our SEOBeast.org example you can see that just by reading a few paragraphs of text you gain a very strong sense of what this site would be like if it were to ever be made. You can feel the personality ooze out and start to envision what it might look like or what the final copy might say. All of this makes designing the final site, and creating all of the content for it, much, much easier as essentially you’ve already got a strong initial basis to work from.

Concept overview

SEOBeast.org concept overview

Although not technically a ‘persona’, our concept overview is an amalgamation of ideas we nicked off Aarron Walter, Erin Kissane and Colleen Jones, all of whom are sickeningly talented individuals. What we try and do here, based upon our knowledge of the target audience and design personality, is come up with an overarching concept that drives the site and creates elements of engagement and influence. We want our sites to tell a story and hook people in and this a great way of refining ideas down onto paper.

Aside from taking the opportunity to look at colour, typography and general style in more depth, we also take a bash at detailing the rhetoric of the site – why it would appeal to people rationally, emotionally and via reputation – as well as any forms of engagement that might attract visitors and keep them interested for longer. For SEOBeast.org, I always had the idea of using gamification as a hook, rewarding people who participated a lot with silly titles and top rankings on a leaderboard. For other sites it might be something more technical like funky JavaScript functionality on the homepage or bold, honest copy. Basically, whatever you come up with should revolve around trying to create something compelling and engaging.

The results

So, after going through the entire process on several jobs for several clients, what have we found? Is it even actually worthwhile? Without a shadow of a doubt, I can answer that it absolutely is.

As detailed at the beginning of this article, we always suspected that developing these supporting materials would improve the quality of our work and I’m happy to say that it completely, unequivocally does. It provides us with a strong vision and foundation for both design and content that seeps into every aspect of the entire project. It creates a consistency in what we do, giving us a clear anchor point to always refer back to during the design and copy process, reducing the chance that we go off on a tangent or completely fail to hit the mark with the target audience. I suppose in many ways it’s like having a good blueprint or specification, laying out the foundations of the work right at the start of the project.

“What if I were to tell you that the most important factor is how a site makes a visitor feel?”

- Anthony Wing Kosner

Once crafted, the material also let us pack more emotion into our work, a vastly important aspect in helping to influence the user and create a meaningful web site that actually does something other than exist to highlight a phone number. Inducing an emotion in the visitor is quite possibly the most fundamentally important thing any site can do and I can easily say that by going through the process of developing and utilising personas, it becomes that little bit easier and more likely to occur.

And whilst the benefits that these materials can provide to the final product are huge, perhaps most surprisingly of all though was how they affected our clients and our internal workflow. By taking our clients through the personas when we meet with them to show them initial designs, we’re finding that they’re far more likely to respond positively and accept our decisions because they can understand why we’ve made them and done what we’ve done. No longer in their eyes is design a subjective art that anyone is qualified to comment on but suddenly it becomes a logical, recognised and thought-out measured quantity that has been carefully considered. The benefit of this is that they connect with the project more and trust us more, streamlining the whole design process and improving our workflow as a result.

Downloads

Below is a list of all of the material created for this blog post – feel free to download them, read until your heart’s content and re-use as appropriate.

Image credit: Tom Cruise in Magnolia (New Line Cinema – please don’t sue us)

If you liked this article then why not subscribe to our RSS feed.

Author: Gordon McLachlan

Gordon is uncomfortably good looking.

Tags

,

Comments

Showing 2 Comments

Leave a comment
  1. Todd Zaki Warfel December 14, 2011 at 11:45 pm

    Hey Gordon,

    Thanks for the shootout to persona model I created for messagefirst. We put a lot of work into that thing, blending narrative with visualizations. It’s really been a great artifact to communicate empathy, voice, and make data-informed design decisions.

    • Gordon December 15, 2011 at 6:13 pm

      Our pleasure, Todd. Love your work at messagefirst and hopefully our interpretation of your excellent user persona does it some justice!

Leave a Reply