Say what happened: buttons, errors, empty screens

This article was written on 6 November 2026.

AI tools change fast. The duty to say what happened does not. A button, a link, a label, an error, a toast, a skeleton, an empty state, a tooltip — these are how a page answers a person. Icon fashions will move. Read this as a rule of honesty, not as a widget tour.

Series cover: Basic terms for vibe coding, 4 of 5, Say what happened.

A page that never reports is a page people press twice. They press twice because nothing told them the first press landed. Models are good at drawing the press and bad at drawing the reply, unless you ask for the reply as its own part. The reply is not decoration. It is the difference between a form that collects a booking and a form that only looks like one.

A button does a job. A link goes somewhere.

A button changes something here: send, save, book, delete. A link goes to another place: tomorrow’s page, the map, a policy. When a model paints every phrase as a button, the person cannot tell travel from action. When it paints every action as a link, “delete” looks like a page and sometimes is one, which is worse. In the brief, name the verb as a button and the destination as a link. One primary button on a screen is enough. The rest can be quieter. Two primary buttons is an argument the page refused to settle.

A solid Book button beside underlined words Map and Hours.

Write the button as a verb the person can check later. “Book visit” can be confirmed. “Continue” cannot. “OK” cannot. If your readers are not reading English, the visible verb is in their language. The part name you paste — button, link — stays English.

A form is a set of labeled questions

A form is not a stack of gray boxes. Each box is an input. Each input needs a label that stays visible, not a placeholder that vanishes when typing starts. Placeholder text inside the box is a hint, and a hint is not a name. People forget what the box was. Translators cannot see a name that disappeared. Say: every input has a visible label above it, in the reader’s language.

An error sits by the input it belongs to, in words, and it also sits in a summary at the top if several failed. Color alone is not an error. Red and green are invisible to many eyes, and they are the first thing a model uses. Say “words, next to the field, not color alone.”

Required is a condition you state, not a star you hope is universal. Say which fields can be empty. A phone number required in one country is optional in another. That fact belongs in your language under the English brief.

A simple form with a label above each field and a written error beside one field.

News that leaves, news that stays, news that is missing

A toast (sometimes called a snackbar) is a short note, often at the bottom, that appears after an action and leaves on its own. “Saved.” “Copied.” Three seconds is plenty. It must not be the only record of a failure. Failures stay, next to the field or at the top of the form, until the person fixes them. A toast that says “could not book” and then vanishes is a lost conversation.

A skeleton is the gray shape of the page while the real text is still arriving. It is better than a blank white wait, and better than a spinner that explains nothing. Use it when a list is loading. Do not use it as a permanent design. If the data never comes, the skeleton must give up and become an empty state.

An empty state is the page when there is nothing to show yet: no bookings, no classes this week, no search hits. It names the emptiness and offers one next action. A blank table is not an empty state. It is a page that shrugged. This is the screen small organizations forget, and the screen their visitors meet on the first day, when the list is honestly empty.

A tooltip is a few words on hover or keyboard focus, for an icon that would otherwise be a secret. It is not a place for a policy, and it does not exist on many phones in any reliable way. If the words matter, they are visible text. A tooltip is a spare label, not a document.

A phone page with a short note at the bottom that is separate from the form above it.

The second tap

A parent booked a class from a phone on the way home. The button said Continue. Nothing else happened that they could see, so they tapped again. Two bookings arrived. The desk called it a user error. It was a missing reply. Continue is not a verb you can check, and a silent page is not a confirmation.

The page that works has dull parts. The button says Request this class, in the parent’s language. Each field has a label that does not vanish. If the phone number is empty, the words appear beside that field and stay. If the request lands, a toast says it landed and then leaves, and the form itself also changes to a short receipt the parent can scroll back to. If the class list is empty because the term has not been posted, the empty state says so and offers one button, not a blank table that looks broken. None of this is a visual style. It is the page refusing to make the parent guess.

When you brief this, keep the part names in English — button, label, error, toast, empty state — and write every sentence a human reads in the local language. A model that receives only English labels will publish English labels. That is a different failure from a missing toast, and it is just as common. The shape is shared so the behavior is right. The words are local so the person knows what they just did.

One brief

Build a booking form. Each input has a visible label. Errors are written beside the field in words, not by color alone. After a successful send, show a toast that says the visit is requested and leaves after a few seconds. If sending fails, keep the error on the form. If there are no visits yet, show an empty state with one button to add the first.

Then write the labels and the error sentences in the reader’s language. The English above is the shape. The sentences underneath are the care. A model will not know how a clinic in your city apologizes. You do. The next article is about motion, and about the decorations that can wait until these replies exist.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top