Written by: Tiffany Duening
H-E-B Digital Senior Content Design Manager
Imagine walking into a grocery store, but there are no employees in sight. There’s no one to greet you, help you find products, slice your deli meat, or check you out. Or maybe there is an employee—but they’re exceptionally rude. Or they won’t stop cracking jokes. Maybe they don’t even speak your language.
You probably wouldn’t shop there again.
In digital experiences, you have to rely on written words in place of conversations with actual people. If the words aren’t right, the whole experience is ruined.
As a content designer, it’s my job to ensure every online conversation we have with customers is as effective and enjoyable as shopping in an H-E-B store. People love our stores for the friendliness, unique offerings, community-centered ethos, and proud Texan vibes. Well, that, and the ice cream.
What is “Content Design”?
Content designers at H-E-B Digital are responsible for nearly all the words in our digital experiences. We collaborate with researchers, designers, product managers, and engineers to create digital interfaces that balance our four key content principles: useful, clear, concise, and consistent.
Still fuzzy? Compare content design with copywriting. Copywriters use romantic language to inspire an emotional response and get users to buy something. Content designers use simple language to help users understand their experience and help them accomplish something. As content designers, we solve problems and shape experiences through content.
Write simple. That means it’s easy, right? Not exactly. Because words are the source of truth, content designers need to be experts in all the ways a product functions, often sitting with engineers to turn complex ideas into something useful. And because no one likes to read (it’s okay, we get it), the copy usually needs to be short. And it needs to sound like a human, not a robot. And don’t forget it needs to go through user testing to make sure it actually works. So what does simple look like? It’s spending 30 minutes writing a single error message, coming up with 35 versions of a single headline, or asking anyone within earshot if they understand what the word “biometric” means.Simple is hard, y’all.
The new My H-E-B app
When I joined the H-E-B Digital team, our brand new H-E-B app was already full steam ahead. We had to build the car as we drove it, so to speak. While collaborating with designers to craft content for each screen, we were also documenting guidelines, researching and learning about our customers, and trying to understand and define our brand voice for the digital space.
To get up to speed, we audited what existed in our stores and online, talked with H-E-B Partners, and even worked as a personal shopper for a few hours (and wow, that’s not easy). We used these learnings to ensure our writing matched our customers’ mental models and honored our larger brand voice. For the app, we focused on making our voice sound conversational and upbeat without being too casual or overly playful.
To make sure we were being consistent, we also drafted a style guide, documenting use cases as they came up. This style guide sets rules around things like punctuation, capitalization, and word choice. This guide will likely always be changing as we evolve.
While keeping the big picture in mind, we also got deep into the details. Thinking back to our handy metaphor: you wouldn’t want to be halfway through checkout in a store, only to have your cashier tell you they were unable to add the item to your cart and ask you to leave. That shouldn’t happen in the app either. Every piece of content was crafted to reflect the type of experience you’d want in a real store, whether things are going well or not.
Content design in action
Let’s see what that looks like: Here’s some of the content we wrote for the My H-E-B app so you can see the difference a few words can make.
Information gathering
Often called a “permissions primer,” this dialog shows up when your phone needs approval to access information, for example, to use your location to find your nearest store. Sharing data can be a little scary so we use primers like this to let customers know what data we need and why.
The copy in the first image below sounds impersonal and doesn’t help the user understand why sharing their data would be helpful. Rewritten, it sounds more like something a real person would say to you. And details like button copy matter too: “Continue” gives the user a hint that there’s another step, and “Not now” lets them know they can always change it later.
