Using AI to evangelize content design

Ben Davies-Romano
Ben Davies-Romano
October 10, 2024

I’m sure you can relate to the journey my team has been on with AI. First, we questioned whether ChatGPT would replace us and reduce our craft. Then, we quietly tested the tools and realized they were pretty limited. And that’s where we started to get irritated by all the hype.

We could put a lot of work into designing prompts that generate good enough output, but it takes longer than just doing the work without AI. And the reality is that we’re a small number of content designers supporting a large suite of products. There are more teams in need of content design resources than we can support — our time is valuable.

This was a lightbulb moment for us: there is a way to incorporate AI into our existing UX toolbox. We realized we can use it to empower other teams to create better content and to evangelize our approach to the work. Here are some of the prompt engineering techniques we’ve found most useful for spreading good content design across our organization.

Technique 1: The Message-Context-Goal framework

When ChatGPT first took off, many of our colleagues found it hard to generate acceptable UX content. When we looked at their prompts, it was clear why. Here’s an example of the kinds of prompts we were seeing:

<div class="prompt-style"><div>Prompt: Write a short sentence telling users that their bank account couldn't be linked.</div><div>Output: We were unable to link your bank account at this time.</div></div>

This generated text communicates the issue, but it doesn’t say what caused it. Why? That wasn’t specified in the prompt. It’s surface-level, focusing only on the message to be generated. When we design content, we have a lot more context in mind — for example, where in the user flow it’s being shown, and how to address users in an on-brand way. Why should it be different for prompting AI?

Some folks overcorrected by including all context possible in their prompts, like our entire 35,000-word style guide:

<div class="prompt-style"><div>Prompt: ...Best practice Present You get a discount for QuickBooks Review your transactions Avoid Present You’re getting a discount. (present progressive) You’ve gotten a discount since January. (present perfect) You’ve been getting a discount since January. (present perfect progressive) Best practice Future You’ll get a discount for QuickBooks Avoid Future You’ll be getting a discount next year. (future progressive) You’ll have gotten a discount all year. (future perfect) You’ll have been getting a discount for months when you unsubscribe. (future perfect progressive)</div><div>Output: We couldn’t link your bank account at the moment. Please try again shortly.</div></div>

The result doesn’t solve the vagueness problem we had when the prompt had no context at all. Including a style guide in a prompt isn’t going to teach the AI to write like a content designer. 

Inspired by Beth Dunn’s book Cultivating Content Design, our team developed a prompt framework that incorporates the thinking behind our content decisions and gives ChatGPT just enough context to generate a productive output. The framework consists of three parts: Message, Context, and Goal.

  • Message: What is the meaning that you need to get across?some text
    • Where does the message appear on the screen and in the flow? 
    • How might the user be feeling? 
    • How should we address them? 
    • Which tone is appropriate? 
    • What limitations are there?
  • Goal: What action should the user take from reading this screen? What must they understand?

Here’s how it looks in practice:

<div class="prompt-style"><div>Prompt: [Message] Write a title for a screen explaining that the user's bank account could not be linked.</div><div>[Context] This screen is shown after the user has attempted to link their bank account, which involves verifying their identity and account details in their banking app. It is shown when they are redirected to our app. This usually happens due to technical errors during the verification process.</div><div>Users are often frustrated when they see this screen but appreciate being told what the issue is concisely and directly.</div><div>As this is a title for a screen, it should concisely communicate the problem in less than 100 characters.</div><div>[Goal] After reading this string, users should quickly understand that linking wasn't successful and that this is due to technical errors.</div><div>Output: Unable to Link Your Bank Account Due to Technical Issues</div></div>

(Note that we don't label each part of the framework in the actual prompt.)

This output feels much more appropriate as a title for an error screen. It’s concise, straightforward, and communicates the context behind the error. Yes, this still needs editing, but it’s much closer to what we would write.

Using the Message-Context-Goal format gives us a structured way to document all the learnings and decisions behind each string and results in an output that we can easily iterate on. It also gives our non-content partners insight into some of the nuances that go into crafting UX content — both with or without AI assistance. It guides them through what’s needed (beyond just the words) and makes it clear when relevant information is missing.

Subscribe to the Button newsletter!

Get more valuable content design articles like this one delivered right to your inbox.

Thanks! Check your inbox to confirm your subscription.
Oops! Something went wrong while submitting the form.

Technique 2: Chaining and stacking

In conversational text generation tools such as ChatGPT, weird things happen when you stay in one conversation for too long:

<div class="prompt-style"><div>Prompt 1: Describe the business model of Headspace in 2 sentences</div><div>Output 1: Headspace operates on a subscription-based business model, offering users access to guided meditation and mindfulness content through monthly or annual subscriptions. The revenue is generated primarily through subscription fees, providing users with a comprehensive platform for mental well-being.</div></div>

<div class="prompt-style"><div>Prompt 2: Give me a bullet point list of 4 different kinds of cake</div><div>Output 2: Happy chocolate fudge cake, joyful red velvet cake, smiling carrot cake with creamy cheese frosting, cheerful lemon blueberry pound cake.</div></div>

Previously in this conversation, I had been generating example content about Headspace for a workshop. When I changed the topic to cake abruptly (for professional reasons, of course), I ended up getting Headspace-branded confectionery.

The previous content in a conversation influences whatever comes next — it’s all one long conversational chain. When you mix in unrelated topics, you can get hallucinations and overall poorer quality output. That means for one idea, stick to one conversation.

This got us thinking about chaining — the practice of refining the same output over multiple prompts.

We can use chaining strategically to influence three aspects of the content: tone, length, and reading level. 

Tone

Chaining makes it easy to iterate on the tone of a text:

<div class="prompt-style"><div>Prompt 1: Write a short description explaining to users that they can change their shopping preferences under Settings in the app.</div><div>Output 1: You can easily customize your shopping experience by adjusting your preferences in the app. Just head over to Settings and update your preferences to match your needs. Whether it's adjusting your preferred payment methods, selecting your favorite stores, or managing notifications, you have full control over how you shop. Make sure to explore the options and tailor your experience today!</div></div>

<div class="prompt-style"><div>Prompt 2: Make it less promotional in tone.</div><div>Output 2: You can change your shopping preferences anytime by going to Settings in the app. Here, you can update things like payment methods, favorite stores, and notification preferences to better suit your needs.</div></div>

Refining tone through chaining is a useful tactic for content designers and non-content folks alike. We’ve found that it helps develop a vocabulary around tone, encouraging collaborators to be more specific in critiquing and describing desired tone. That means more specific and focused feedback, which helps us when iterating on designs — less “Make it sound more fun,” and more “Can this be rephrased more concisely and confidently?”

As a bonus, since we usually talk about tone in relation to user sentiment, a better understanding of tone has given product managers another lens through which they can reflect on users’ needs and whether or not our designs are meeting them.

Length

Chaining can be used to adjust the length of a message, enabling teams to fix character count without having to consult our busy team whenever a string is too long:

<div class="prompt-style"><div>Prompt 1: Write a one-sentence description of BNPL in plain language, aimed at someone who has never heard of it before.</div><div>Output 1: "Buy Now, Pay Later" (BNPL) is a payment option that lets you purchase something immediately and pay for it over time, usually in smaller, interest-free installments.</div></div>

<div class="prompt-style"><div>Prompt 2: Make it shorter.</div><div>Output 2: BNPL lets you buy now and pay later in small, often interest-free installments.</div></div>

We’ve learned that comparative commands like “shorter” or “longer” are better than giving concrete character counts because these tools often can’t count. They’re language models, not calculators. (And this basic limitation reminds folks that this technology isn’t a miracle solution.)

Reading level

Finally, we’ve found success with chaining for reading level as a way of simplifying language and improving comprehensibility:

<div class="prompt-style"><div>Prompt 1: Write a short explanation of how making a bigger down payment can increase the total amount of credit you may qualify for.</div><div>Output 1: Making a bigger down payment can increase the total amount of credit you may qualify for because it reduces the lender's risk. When you put down a larger initial payment, you lower the loan-to-value (LTV) ratio, meaning you're borrowing a smaller percentage of the property's value. This makes you a less risky borrower, which can encourage lenders to offer you a larger loan amount. Additionally, a bigger down payment can lead to better loan terms, such as lower interest rates, further increasing the overall credit available to you.</div></div>

<div class="prompt-style"><div>Prompt 2: Rewrite this to have a grade 6 reading level.</div><div>Output 2: Making a bigger down payment can help you get a larger loan because it shows the lender that you're less risky. When you pay more upfront, you don't need to borrow as much money compared to the value of the property. This makes the lender more likely to trust you and give you a bigger loan. Plus, a larger down payment can lead to better deals, like lower interest rates, which means you might qualify for more credit overall.</div></div>

For many of our collaborators, the concept of reading level as a measure of comprehension is new, so this has been a great opportunity for education and experimentation. It’s not uncommon in our organization for product managers and designers to now reference reading levels when discussing optimizations with us, and it’s opened the door to conversations about content accessibility more generally.

As a bonus, chaining nicely highlights how content design is an iterative process, even outside of AI.

Technique 3: Few-shots

Shot” is AI-speak for example. If a prompt is zero-shot, it doesn’t contain examples. Few-shot prompts contain several examples. Introducing shots gives you more consistent output in terms of style, tone, and format. Showing how something is done is often easier than explaining it, for humans and for AI. 

Here’s a zero-shot prompt:

<div class="prompt-style"><div>Prompt: Write a concise error message in one sentence to explain that the user's payment preferences couldn't be loaded due to technical issues.</div><div>Output: Your payment preferences could not be loaded because of technical issues; please try again later.</div></div>

Although the output meets the prompt, it falls short in terms of tone, and… that semicolon? *Shudders*

Now let’s add a few existing well-crafted errors to the basic prompt:

<div class="prompt-style"><div>Prompt: Write a concise error message in one sentence to explain that the user's payment preferences couldn't be loaded due to technical issues.</div><div>Use the following as references for tone and style:</div><div>"We couldn't load your saved cards due to a technical error. Try again later."</div><div>"We can't show your deliveries currently due to a technical error. Try again later."</div><div>"We couldn't find a page matching that URL. Check that it's correct, and try again."</div><div>"Your password needs to include at least 1 number and 1 special symbol, such as ! or ?. Update it to meet these criteria."</div><div>Output: "We couldn't load your payment preferences due to a technical error. Please try again later."</div></div>

The output much more closely matches the tone and style of my existing errors. It uses first-person and active voice and avoids advanced punctuation. Even if my shots are for different error states, they give me more control over the tone and style of the output. 

We’ve found that even including one shot has a large impact on the output, but ideally, aim for three to five.

Educating our partners about shots has been a great way to scale what we do. Teams can use our existing content design-approved text as shots to generate higher-quality content infused with our style and tone. We’re even working on a formal library of microcopy shots and a custom GPT!

Democratizing content design

While it’s often quicker to design content without AI, our team has found value in how these tools have helped us evangelize good content design across our organization. Don’t get me wrong — we’ve invested a lot of time educating those we work with about content design without AI. The techniques in this post don’t highlight new lessons in content design, either. 

AI tools are incredibly easy to use, provide opportunities to test principles, and allow non-content designers to see impact immediately. For us, it’s been one of the most effective ways we’ve found to showcase our approach and all we do beyond the surface level.

Teams that we cannot support directly now have more resources and knowledge to produce higher-quality product copy. As a bonus, it helps others speak our language — for example, enhancing understanding of tone and reading comprehension — which helps us collaborate more efficiently.

Don’t get bogged down by all the hype around AI. Keep experimenting, and explore how it could help you in your mission to design exceptional product content and spread good practice.

Button 2024 is only a few days away!

Don’t miss everyone’s favorite content design conference...

Share this post
Ben Davies-Romano

Ben is currently the Head of Content Design at Klarna. He has worked in start-ups across Berlin, Madrid, and London on language learning apps, meditation courses, navigation systems, and most recently, shopping and finance. With a background in product management and UX, he’s particularly focused on empowering non-writers to understand the power of content design. Outside of work, you’ll find him learning Tongan, bopping around to trashy 90s pop, and making edible balloons out of mozzarella.

Find out how you can write for the Button blog.

Sign up for Button email!

Subscribe for content design resources, event announcements, and special offers just for you.

Thanks! Check your inbox to confirm your subscription.
👉 IMPORTANT: Firewalls and spam filters can block us. Add “hello@buttonconf.com” to your email contacts so they don’t!
Oops! Something went wrong while submitting the form.