Write First: The Craft of Content-first Design
Tags: Design, Writing, Ux Writing

Writing is excruciatingly hard to do.

Most adults of a certain generation have written a book report. You may have written an email love letter. Or at least a tweet. You can blunder through writing, or you can study and practice and develop the skill. Even if you never reach artistic heights, you’ve done something hard. The commitment ceremony of words on a screen (or on a page, if you’re old-fashioned) converts ideas into something more than notional. Writing is a fundamental design skill.

Good writing feels like witchcraft. An elegant narrative is a near-rapturous experience that beguiles without the mechanics showing. I love reading and re-reading passages to detect the subtle structure that makes good work land with aplomb. To practice content-first design, you don’t have to be a great writer, but recognizing it in the wild, and understanding the basics of narrative structure, certainly help.

This essay isn’t about creating content, or writing even, it’s about how to design meaningful products by starting with an examination of the contours of your content. It’s also about how content exists only to create meaning for users.

What’s content-first design?

In a product design space, “content” is shorthand for “copy”. But it’s not just that. It’s data, images, video, and user-generated content. It’s broad and borderless when considered as a whole, but the content for a given product or project probably has a discernible shape and texture that will start to inform it’s designed incarnation.

Content doesn’t exist unto itself; it serves a communication need. As product designers, everything you build is, in essence, a conversation between humans and technology. This communication is the basis of interface design, and it’s very reason for being.

2. Speak, write, show

Every UX writer has encountered situations where they’re asked to write for a container that’s ill-suited for the message. We’re either cramming important disclosures into too-small boxes, or filling space with superfluous repetition or editorializing.

As a hybrid writer/designer I get the appeal of the abstracted wireframe where text is represented by boxes or squiggles. However, we do ourselves a disservice by skipping straight to designing interactions without first mapping out the content that’s meant to be communicated.

Living in liminal space is uncomfortable. However, allowing yourself to explore abstraction can help you better articulate your product’s meaning to users. Before committing to mocks, flows, and specific choices, try experimenting with a couple content-first methods.

These methods call for nothing more than skills you’d grasped by elementary school, paired with a willingness to view your work as an opportunity for play and exploration.

3. Speak: Conversational prototyping

One of the silliest things you can do at work is act out a dialog between a user and a product. On occasion, silly things should be compulsory because they help people loosen up a little. We (weirdly, sadly) live in an age where face-to-face conversation is growing scarce. To self-edit, writers are often instructed to read their work out loud. Spoken, run-on sentences reveal themselves in your inability to draw a breath. Or style and rhythm shows its musicality. Talking through an interaction can uncover weak or awkward points, or highlight the good stuff.

Be yourself. But also be your product. (Illustration by Marin Licina.)

My coworker Marin and I had a conversation role-playing the Google Assistant and ourselves, trying to set up to shop for household goods. After some smirking, we stumbled through a conversation, unexpectedly balking when we had to ask for personal stuff, like credit card information and brand or price range preferences. It also let us explore the boundaries of tone — where does casual need to converge with reassuring, and where is authoritative an appropriate tone to ensure trust?

“Conversational prototyping”, as Marin named it, is one of the easiest, fastest ways to prototype a flow. Play acting your product’s character is unexpectedly revealing. We begin to remember that trust is built through subtle gestures like tone, consideration of people’s time, and clear, compassionate explanations for why we’re asking for sensitive information. From this practice, you can begin to explore more formal wireframes, or artifacts like tone maps, too.