hella days

When does copywriting happen in your team’s process? Some people say you should design with real content. They’re not wrong. But real copy in your wireframes will lead to unproductive conversations. So… when should you add your real copy to the process?

There are lots of advocates for designing with real content. “Content-first” design, they call it. Those people preach the idea of using real content in your wireframes and prototypes, rather than “lorem ipsum” text.

That’s a smart suggestion (you thought I was going to disagree, didn’t you?). Although sometimes it is easier said than done.

And “content-first” people know it is easier said than done. That’s why they preach it: it’s easier to ignore the content, but it’s dangerous. Sometimes the best way to do things isn’t the easiest way.

However, if you just say “design with real content” we have over-simplified the whole process, we have made copywriting the most important step, and we are going to delay everything else in production so we can create all of our content first, without knowing what design the content will fit into.

That doesn’t seem right either.

So… when is the best time to include copywriting? 

Well, that depends on what type of copy we’re talking about…

****

There are two types of copywriting: brand and UX.

It’s an important difference.

As a UX designer, you want to be as direct, as simple, and as clear as possible. No poetry, no clever phrasing, or expressions that a non-native speaker might not understand. Unlike a poet or an author, every word is expensive for a UX designer. 

Our goal is to get the user to click, or understand what they have to do, so they can get to the next page or complete their task, or whatever.

That doesn’t mean that clever, funny, poetic, beautiful, emotional brand copy doesn’t affect the user’s experience — that’s not the point at all — but UX copy (text that a UX designer should write) is not that copy.

The difference between brand copy and UX copy matters to us because those types of copy need to happen at different times in the design process.

****

Design for real life, not ideal life. 

Let’s get back to this idea of “content-first” design. It’s a good idea, and a good habit for you to get into, but it’s not because copywriting is the most important part of your UX process. 

“Content-first” design actually has nothing to do with copywriting!

Brand copy, for example, can actually happen really late in the process, from a UX designer’s perspective. You can make 100% of your wireframes without having any idea what the exact phrasing is going to be, or what the details of the creative concept will be, or which photos will be used.

Side note: this is where UI designers can really shine. A relatively simple wireframe can become a magical experience in the hands of a talented UI designer, without changing anything fundamental, UX-wise.

As UX designers, our job is to create spaces or containers or opportunities  or structure for content. Not necessarily the content itself. If your design breaks when the content changes, it’s probably a bad design.

Ironically, that is EXACTLY why you should start your design process with content!

Hold the phone… what?!

Yes! You should get a few realistic examples of content and use them in your wireframing and ideation process, because if you don’t, things can get complicated. But it doesn’t matter what that content actually says.

****

Make your process inconvenient to make your designs better.

Most designers (and I am especially looking at UI designers now…) like to choose short button labels, and short headlines, and short user names, and perfectly symmetrical paragraphs, and articles that fit perfectly into one screen, and profile photos of beautiful faces looking straight at the camera, and they like to position those perfect headlines on perfect photos that have exact layout and color to be perfectly readable.

I have bad news: that doesn’t happen very often in real life. 

I have worse news: if your users get to create the content, it almost never happens in real life.

Even when your employees get to write and choose the copy and content themselves, it’s only a matter of time before you see your design with a button label like…

“Click here now to win your dream vacation to Mallorca!”

…and a three-line, poorly punctuated headline like…

“You’re not going to believe this list of 10 beautiful cafés—that only people from Philadelphia will appreciate—#4 blew our minds!”

…and a user name like Count Remington Von Oppenheimer-McGillicuddy…

…and an article written like the one you’re reading now, with a lot of short lines, and a few longer paragraphs, and some random italics and user-created section dividers (wait, did I just insult myself?)…

Then the profile photo will be a dog’s whole body, aligned in the top left corner, which ruins your circular profile photo design, and it will be overlaid on top of a low-res vacation photo that Count Oppenheimer-McGillicuddy took in the dark, and the one bright part of the photo will be directly under your white headlines, making them unreadable.

And your design will look like absolute shit, because you made your own design process too convenient.

Yes. Count Oppenheimer-McGillicuddy’s terrible sense of design is your fault!

To be a good UX designer, you need to constantly ask yourself: “What is the worst thing that someone could do with this?”

And that is why you should design with some realistic content. So it looks realistic! A shitty photo should not have a major impact on your design, aside from the fact that you don’t like it. A long article should be business-as-usual. A dog’s ass in a profile photo should be just as nice as a human face. Ish.

If you don’t have any realistic content to work with, you can even write some terrible, but real, content yourself. As long as you can give it to someone and say “is this easy to read?” you’re fine. It doesn’t have to be the final copy, or the final creative photography, and you don’t really have to know much about the final content… you just have to know the requirements of real life.

And remember: as the UX designer you can create some of those boundaries, by telling the developers how many characters are allowed in the headline, or what the maximum width of a text column should be in your responsive design, or whatever.

Make your life inconvenient so the users’ lives will be convenient.

****

So… when does copy happen?

UX copywriting: should start early, but the purpose of starting early is to make sure that your wireframes and prototypes are designed for real life. Your main concern should be realistic copy and realistic content… not the final, exact wording.

Brand copy: final brand copy isn’t needed until very late in the process. Basically the end. Design your interfaces so they will gracefully accept any text, and then give your copywriters the freedom to do what they do best. That being said, it is often helpful to get a rough idea about what the UI designers, copywriters, photographers, and art directors have in mind. If your project is more of a one-time site, like an ad campaign, or a start-up one-pager, or a beautiful-yet-epic, fully-animated, parallax-heavy memorial site for your recently deceased hamster, “Sir Nicholas Cage” —the requirements might be more flexible (because the content won’t change).

And A/B test your copy! Nothing is easier to change, update, and test than text. Headlines can make a big difference in conversion, and you can start experimenting with that copy today. Especially if you have already launched your site!

One exception: you might not think that developers need to know about copywriting, but you might be wrong! Developers can be a wild card in the copy process. If there is any text that needs to be generated by the code (or the coders) like error messages or text that includes calculated numbers like “You have {number} new followers!” — the developers need the exact copy as early as possible.

Copy that is used programmatically (i.e. - it’s in the code) is not as easy to change as most other copy, and it’s annoying for developers to go through their code to make tiny little tweaks… so do them a favor: write down all of the text you need, for all of the situations that might happen, and provide the right text the first time, in a format they can use easily. They will appreciate it. :)

Fous de L'Île Kombucha by Eli Horn / Fivethousand Fingers