The mistake that makes your UX process scary expensive

Obviously a designer needs to start sketching early in the UX process. But can you sketch the text? Absolutely. Proto-content is the best way to avoid breaking the project budget and time plan.

The UX design process starts with simple sketches, first by hand and then in the form of wireframes. Sketching is an excellent way to test ideas, discover problems — and make sure that the work is moving along the right path. Often, the design starts without knowing which words or what content will be included.

But the ultimate aim is text and design in harmony. They go together like peanut butter and jelly. They build a whole. As Lorraine S Green puts it:

“Design is the chicken and content is the egg.”

What comes first? The answer: they are born at the same time, and grow together.

The problems with Lorem ipsum

“Bzzz, bzzz”. It often seems to be at the last minute when the UX writer or copywriter gets a call about “pouring texts” into an app or a website for launch in 14 days. Until now, the site or app was filled with Lorem ipsum texts. But this type of content makes it difficult to see how things connect on the site/app, and there’s a gap between the form and the text. So the writer’s workflow gets really backed up — with all content needing to be produced in a short time and late in the process.

Here are a few more things that are wrong with Lorem ipsum texts (or no text at all):

• The UX process becomes unnecessarily expensive, as once the real text arrives, it’s clear that the design needs to be changed. For example, the headings can be too long for the design and the content too different. And (re)doing it until you get it right costs money.
• The risk that important parts of the approved text are unclear, as the content may need to adapt to the design. That’s often too late to fix, and would cost a lot to do.
• All being well the text arrives, but the words don’t match the brand’s tone of voice, as they are thrown together at the last moment. Text takes time. If the worst happens, the text isn’t available when it’s time to launch, and the whole project stops. Instead of becoming a money machine, the app/site continues to bleed money.

Prototype content — a crash-text dummy

Here’s proto-content to the rescue and it lets the design and the text go hand in hand throughout the process. It can also be called dummy content or sketch content, but let’s continue to call it proto-content. Note that proto-content is “a sketch in text form” — it doesn’t have to be perfect. It’s just so much better than filler text, “A good, fun headline here” or Lorem ipsum.

Advantages of using proto-content early

There are many advantages to knowing at an early stage in the UX process what content and which keywords, headings and key texts should be included:

• You can tweak the design early
• You can change the time plan and budget early (to have the time and money to create the best possible user experience)
• You can test and evaluate the text and design together early

Successful UX writing process

Producing proto-content turns the process into forward progress for your UX writer. The heavy work takes place early, and then it is about adjusting, refining and double-checking. With proto-content, your UX designer can work using “real” content, and not have to go back later and redo their sketches when the content demands it. The project will drive forward when both the text and the design are on the same page from the start.

Proto-content — what and how?

Let’s start with the what. Already at the sketch stage in the process, it’s possible to write:

• Headlines for pages and sections
• Keywords (both verbs and nouns)
• Button texts and link texts

Don’t try to be clever and creative. Focus instead on choosing the right word. Should it say “Search” or “Filter”? Should it be “Save”, “Send” or “Publish”? Consider how many product benefits or price packages you want to present, as it dictates the design.

Write the proto-content as realistic as possible, and see it as “a great first draft”. Names and times and dates should be real. And it’s a good idea to use an ugly font for sketch content to make it clear that it is Work-In-Progress (yes, I’m looking at you, Comic Sans). You can also make the text magenta, so you clearly see what you need to review or change before the app or site is launched.

Three ways to write proto-content

Let’s get to the how. When it comes to longer texts, there are several ways to use or create proto-content. Here are the most common:

• Use your own existing content. It gives you something to work with. You can change or delete it later, and the advantage is that this type of text has relevant content and a realistic scope.
• Use the competitor’s content. It’s more useful than Lorem ipsum (if you don’t have your own existing content). These texts are relevant because they have a similar content and are aimed at the same target group. But … make sure your app or site isn’t launched with the competitor’s words!
• Use fresh content. It takes a lot of time, but creates texts that are realistic and very useful in the work to come. The texts may well be “rough”, and don’t have to be perfect.