Improving UX with Copy and Design

Improving UX with Copy and Design
Samantha Bendernagel
Samantha Bendernagel
Copywriter

Netflix binger and jelly bean enthusiast

A common mistake made by many digital teams is developing a wireframe without content. Something that Syntixi has learned over time is that UX is all about collaboration. Design doesn’t happen in a vacuum—there are a lot of factors that drive UX, and it’s important to consider all of the influential pieces in the beginning stages.

Get on the same page! Develop a strategy as a team.

When given a project, it’s important to establish a shared understanding of what the goals are and what’s expected from each member of the team. Together you must identify the problem, brainstorm solutions and determine an efficient, cost effective process based on everyone’s strengths and skill sets.

Art and Copy Go Hand In Hand

Copy plays a major role in the design process, especially when it comes to web and UX. Some people think of copy as the last step, kind of like a “fill in the blank” after the design has been laid out. However, content happens to be the core element of a well-designed UX. Here’s how you can utilize copy in every step of the design process:

Sketching

  • Create copy for headings, buttons, key nouns and verbs (use actual headings, not scribble lines)

  • Clarify what each button does, specifying its functionality with copy (i.e. ‘submit,’ ‘sign up,’ ‘donate,’ etc.)

  • To determine how much content to sketch, match the design fidelity with the problem you’re trying to solve. If the scope of work is large, you’ll want to keep your content more high level, focusing on the headings of different sections, whereas a smaller scope, like designing a landing page versus an entire website, may require more detailed copy

Wireframes

  • Avoid using ‘Lorem ipsum’ placeholder text to maintain the layout and also communicate your ideas properly

  • Use a font that is clearly not final, something like Comic Sans, to establish that the product is still a work in progress  

  • Map out content elements and determine their hierarchy per page using Excel, Meister or whatever system you prefer to help you get organized (it’s always helpful to work with a developer to make sure you’re not missing any important information)

Low Fidelity Mockups

This stage is more for reviewing high-level flows and structure than copy. However, it’s still useful to:

  • Incorporate real content instead of ‘FPO” to give the client context for what each section is going to focus on and look like

  • All copy should be at a grade 7 reading level (use the Hemingway App to help simplify text)

High Fidelity Mockups

  • Finalize the copy and reduce your sentences to 15–20 words by removing any unnecessary text

  • Read your content out loud to make sure it flows well and will be easy to read for users

Q/A

  • After the front end of the site has been built, Q/A the content for typos, spacing issues, error messages, or anything that doesn’t read or appear correctly

  • Confirm that you’ve stayed consistent in terminology across all product and marketing pages (you can track your terms and other content using Polaris)

Design doesn’t happen in a vacuum—there are a lot of factors that drive UX, and it’s important to consider all of the influential pieces in the beginning stages.


At the end of the day, collaboration is key. Sometimes, you just need to step back and look at things more holistically—Ask yourself, “How or who specifically on the team can make this process better?” Utilizing people’s strengths and determining areas of improvement in a process will make for a more efficient work flow. Case in point, copy and art are often viewed as separate functions, when in reality they motivate each other, making the solution simple: work together.

Samantha Bendernagel
Samantha Bendernagel
Copywriter

Netflix binger and jelly bean enthusiast

Related Articles
Information Architecture—Let's get organized!

Information Architecture—Let's get organized!

If the UX research goes well—meaning you’ve asked the right questions to help achieve your goals—you should end up with an array of information and data that will allow you to design an optimal web experience.

Read more
User Experience Research—The "why" behind design

User Experience Research—The "why" behind design

What would it take to develop your dream house? Well, you would probably start with a blueprint, then build a strong foundation and finally fill it with great amenities.

Read more