Skip to the page
Tactile UI Kit

Ticket toast

A toast issued like a numbered ticket from a dispenser. A short slip of thermal paper with a number, a line of words and, if it needs one, an action key slides out of a slot at the edge of the screen. Several fan a little. Tear one off with a swipe or its close key, or leave it and it retracts by itself, on a timer that stops while you are reading it.

Press a key: a ticket comes out of the slot at the foot of the panel. Hover it and the timer stops. Swipe it away, or press its cross.

  • Each ticket is a live region of its own: role="status", read after the current sentence, or role="alert" for red, read at once. A screen reader gets “Error.” or “Warning.” before the words. The lamp is a second signal.
  • The time belongs to the reader. The timer stops while the pointer is over a ticket or focus is inside it, and starts again with whatever was left. A red ticket has no timer.
  • Tearing off is never the only way out. The close key is a real button named “Tear off ticket 042”, and Escape does the same from anywhere in the ticket. The swipe is the quick way.
  • Focus is not dropped when a ticket goes. If it was inside, it moves to the close key of the next ticket, or back to where it was before the ticket came.
  • The action key is a real button named by its own words. Keep them to the act: “Undo”, “Open runbook”.
  • Keys sit on paper, which is light in both finishes, so their focus ring and printing use the paper’s ink, not the finish’s.
  • With reduced motion tickets appear and leave at once: no sliding, leaning or tearing. The timers still run and everything is still said.
Tactile UI Kit
Get the Founder Pass