Bare Naked App

We wrote the text for the website a while ago and passed it over to Jason, who has since produced some very stylish designs for the site’s homepage. However, there has been some debate on how to present the strapline for the app (or in simple terms, the sentence that explains what the app does).

Ideally, your strap would state exactly what your app does in simple language, in one neat sentence (max 5- 6 words). However, things are not always that simple. In our case things were complicated by the fact that we have two types of user. If we aimed the strapline at one type of user we would effectively alienate the other by completely ignoring their needs. It took us a while to get our heads around this one.

When we wrote the text in Word a couple of weeks ago we thought we had it pinned down. We would write a vague (catch-all) strap line in a kind of “connect, share, be friends” kind of way (once again Amigo is not social software it’s just an example). And then we planned to use a longer sentence to really nail what Amigo does, aimed at both sets of users. It seemed to work - on paper.

When Jason sent through the design (see example number one) we knew it wasn’t right. It was too long-winded and it took an age to actually ‘get’ what the software was about. It was all wrong.

Roll in example number two (second down from top). Here we tried to drill down to the very basics of what the long sentence was trying to say. We split it into two sections (one for each type of user) and put a bullet point infront of each. The style we used was: “User number one: this is why Amigo is great for you” then “User number two: this is why Amigo is great for you”.

Nope! This was still not working because lower down the page Jason had created some neat little icons to represent each type of user and your eye automatically floated down to read the text associated with which user you were. The bulleted list was now superfluous and actually confused the eye when looking for data.

So we ended up with option number three (third down). We deleted all extraneous waffle and let the icons draw the users in to their particular area, where they would be told, succinctly and quickly what Amigo can do for them. It worked.

The whole process of deciding this one very small (but very important) part of the site took us the best part of week.

And by the way these screenshots are not Jason’s final designs. I have replaced the original text with dummy text so that I could post about it here. The real versions are slightly neater!

Jason wanted to use Futura Medium as the typeface for headers on Amigo. The only way to do this (to my knowledge) is sIFR, a clever technique with Flash that allows you to use any typeface you want, regardless of whether or not the user has it installed.

There’s one major drawback to sIFR though: if you increase your font size, it doesn’t dynamically scale. It will only rescale the browser text size if you reload the page. I think that this is a pretty big usability problem.

So in the end, we decided to go with bold Arial. Obviously not quite as fun, but definitely more user friendly.

It’s time to write the copy for the website so that Jason can start to put the site together design-wise. It took us about two days to write the copy for the website and for the first half day we wrote nothing at all but looked at other sites, and thought about what our visitors would want to know. Good site copy is concise, short, to the point with absolutely no jargon, but it doesn’t start off like this. Getting your ideas down is the first hurdle. You can always smarten it up later with a few tricks stolen from the world of journalism.

As you know we have the logo and name already in place but we needed a strap to sit under the logo that tells the visitor in five or six words exactly what the product does. For instance, ‘Flickr - the best way to store, search, sort and share your photos.’ The strap should be short, to the point and leave people in no doubt what your service does and/or who it’s aimed at.

Once you have the strap pinned down things get much easier. Firstly, because you know who to aim your copy at tone-wise and secondly because you should begin to get a clearer idea of what information people will want to know next.

Try to suspend reality for one moment and imagine that you are not so immersed in the build of your new app that you know every nuance of its character. Imagine that you are your mum, and you have stumbled on a new site called Amigo that has a nice smiley face for a logo. Oooh! nice, tell me more… What does it do? (this is solved by the strap line). Sounds great. Now think - what’s your mum’s next question? It could be ‘how much is it?’ or ‘how does it work?’ or ‘how do I sign up?’ This will be specific to your app.

Of course your mum may not be your target audience so you have to be sensible when writing your copy from this point on. However, it’s useful to imagine that when your customers arrive at your site they will know as much about your app as your mum probably does right now, so make sure to explain everything in clear terms and second-guess the questions your visitors will be asking themselves.

Skype does this very well. The first box you see on Skype’s site is a huge green box that says: With Skype you can talk to anyone, anywhere, for FREE, forever’ - with the word free in caps on its own line. Why? Because when you land on the site and you start to understand that Skype is all about telephony, your next question is ‘aah but how much does it cost?’ Skype dissolves this barrier immediately by telling you it’s FREE. After that, most people are sold and so the next button you find is ‘download Skype’. For those who are not sold there is always the ‘learn more’ button.

In journalism college when they teach you how to structure a news story they tell you to use the ‘Who, What, Where, When, Why, How?’ test on your copy. Who did it, what did they do, where did they do it, when, why and how? A good news story will give you all these facts very quickly in the first paragraph and usually in this order (grab today’s newspaper and check it out, most still use this structure).

You can use this to double check that you have all the information your visitors require quickly accessible on the home page.
Who - who is the app aimed at?
What - what does it do?
Where - where do I sign-up?
Why - why should I use it?
How - how does it work? (edit: better still, How much?)

All this information should be on the first half of your home page.

It’s very important to keep your copy concise. People get bored if you go on and on so don’t use three words where one will suffice. The space on your home page is precious. Each pixel is marketing space that needs to work hard for its place. Don’t use phrases that are vague, can be misconstrued or include jargon. Jargon in particular will alienate your potential users. You may know that your ‘Ajax-driven’ interface is kick-ass but your customers don’t care. Leave it out.

Trim your sentences to get your message across in the quickest way possible. Adding more words doesn’t make you sound clever and it certainly doesn’t make your app better so again leave them out. A couple of examples of this are:

What you write - What you should write

At the present time - Now
Provided that - If
Owing to the fact that - Because
In order to - To
The majority of - Most
Accordingly - So
Facilitate - Help
Frequently - Often
Commence - Start
Nonetheless - But
In conjunction with - And

And you can pretty much delete the following words from your copy altogether because they don’t mean anything:

at the end of the day
basically
by and large
currently
simply
well

If you want to learn more about writing tight, snappy copy then try reading ‘English for Journalists’ by Wynford Hicks.

Your copy doesn’t have to be in a highly-polished state to hand over to your designer. But it does need to have the main messages in place. You also need to prioritize the information so that your designer can see what’s important and what is less so.

Like this article? Digg it!