2 Meta-Principles for UI Writing

Olga Kouzina
Quandoo
Published in
5 min readMay 3, 2019

There are some voices that urge to pay more attention to texts in user interfaces. I completely agree with Jonas Downey of Signal vs. Noise who wrote the article “On Writing Interfaces Well”. Jonas argues that much attention is paid to graphic designs, while UI writing is neglected. Give me the shining armor and I’ll join the army of the UI writers clashing with the graphic designers! However, there’s something more in this crusade against the overrated importance of the graphical bells and whistles, than emphasizing the challenges of writing for UI. Those who’ve been in this work know that UI texts/blurbs are the hardest to wordsmith, so I came up with 2 basic meta-principles for UI writing. These principles are not only for the writers. It’s UI designers who allow space for words, or make text bubbles removable, OR design smart action flows that do not require much UI writing. And, well, when an user action flow is not well thought out, or not “smart” as they put it, then a caring UI writer will feel like they have to compensate the flows inherent in design by means of text.

Previously I shared my thoughts on how people learn to use apps/products classifying new users as Explorers, the Confiding, and Give-Me-Someone-Live’s. A software product does not exist in a vacuum. The time when people are trying out a product or an app is the most crucial time of all. It can be compared to a mating ritual. If a product does manage to woo a new user, then they will marry and live happily together. But if the app/product will not do the woo, then all its great features will remain obscure and therefore unused. What can be more frustrating than working hard on a product feature only to find out that people do not actually use it because:

a) they don’t see why they might need it;

b) they don’t know how they are supposed to use it.

That’s where we get to the first meta-principle for writing user interfaces. Since people are always free to go away from a new software, and since most of them are Explorers, as per my classification, the screens need to allow space for a few words as to the “why”. Those words could be put into the blurbs which a user might choose to hide forever (the “I don’t want to see this anymore” kind of thing).

Principle #1. If a user is new to a product, “why” overrules “how to”

A short note with “why” has to be right in the screen. Here’s an example of the screen that lacks “why”. The 3 filters marked by purple arrows can do a lot, but this is not evident right away.

The screens here are those of a work management app for which I did some UI writing previously.

There are question marks on the screen, which a user might click hoping to get a clue on the “why”, but this action only opens up a bubble with technical how-to’s:

A possible solution here would be to insert removable quick tips that state why those filters are helpful, and why people might want to use them.

On to the second principle. Product/app creators tend to be so immersed in their app, that they become blind to the flaws obvious to outsiders, or to some insiders who are not that soaped up. The creators often assume that their user interface is intuitive and hence requires no written instructions at all. That’s the case when the “why” is obvious but the “how to” is not explicit.

Principle #2. If all’s OK with “why”, give a clear “how to” right in the screen

The screen below has a clear “why” (the looks of a card and how it appears on a board are customized based on personal preferences), and an explanation of the card sizes, but the how-to is missing. Nothing is said on how one is supposed to put together a custom layout for a user story/feature/bug card:

As an insider, I know that this is done by drag-and-drop, and someone who is exploring a screen with their mouse will likely have figured that out, too. But it’s psychologically more comforting, and less tiring to read a note that says something like: “Use this box to search for the card elements. The list is too long to scroll. Then drag-and-drop these units to the card layout. Mind the sizes”. Then a shortcut will point to the info on which card size is recommended for what.

An example where “why”, “what for” and “how to” are balanced is shown in the next screen. The “why” is clear, because a user will want to configure her Prioritization settings for a board, and the radio buttons come with brief explanatory texts:

All the other principles, techniques and how-to’s can be deduced from these 2 meta-principles. UI writing implies a combination of writing skills and empathy with the users, intermixed with the feel for design, and sky is the limit when one sets out to tell all about the nuances of UI writing. However, no writing will save a product/app feature with an inconsistent “why” message and a cumbersome actions flow.

This story is based on an earlier article.

--

--

Olga Kouzina
Quandoo
Writer for

A Big Picture pragmatist; an advocate for humanity and human speak in technology and in everything. My full profile: https://www.linkedin.com/in/olgakouzina/