UI Expression

Every entry answers one question, namely how physical a button or a surface on a screen ought to look, and the answers keep swinging between adding material and stripping it off.

Dictionary entry

  1. Web Brutalism 2014– / Style

    Puts the browser's default rendering straight on screen and refuses the finished look of templates. The bare structure of the HTML becomes the style itself.

  2. Skeuomorphism 2000s–2010s / Style

    Borrows cues from real materials and tools to make unknown interactions understandable. It names the principle, so Aqua and Brushed Metal are what the principle looked like when one company shipped it.

  3. Neumorphism late 2010s– / Style

    Makes background and controls one material, showing relief through soft shadow alone.

  4. Glassmorphism 2020s / Style

    Shows depth and hierarchy through translucent layers, floating information lightly.

  5. Neubrutalism 2010s– / Style

    Rebels warmly against the over-polished web with thick borders and blunt color.

  6. Flat Design / Vector Minimalism 2010s– / Style

    Reduces information to plain planes and color, portable across screens and media.

  7. Glitch digital / Style

    Refuses to hide error and corruption, exposing the fragility of the digital medium itself.

  8. Claymorphism 2020s / Style

    Makes digital components soft and playable with rounded, clay-like volume.

  9. Metalheart 1995–2004 / Style

    Early 3D software gave this fin-de-millénaire style its chrome, liquid metal, aggressive bevels and lens flare. Dressed in techno and science-fiction imagery, it ruled rave flyers and games magazines around Y2K.

  10. Terminal UI 1970s– / Style

    The terminal look: monospaced phosphor characters on black. The VT100's green afterglow became the primal image of the computer's face, repeated from hacker cinema to modern CLI tools.

  11. FUI (Fantasy User Interface) 1997– / Style

    The name that stuck to the craft of making the screens that appear inside films. It spread around the work of Mark Coleran, who says he is given credit for the term without being sure he can take it, and who describes these screens as illustration and a storytelling device that was never designed to be used. He works with light, shape, form, movement and sound so that each film screen has one thing the audience is meant to read.

  12. Diegetic UI 2009– / Technique

    A name for the corner of game interface design where an element belongs both to the fiction and to the three dimensional world. A 2009 master's thesis at Chalmers University of Technology, written with EA DICE, mapped game UI on those two axes and reserved the word for that corner. Health glowing on the hero's own suit is the type case.

  13. 1-Bit Icon Design 1982–1990s / Technique

    The way of drawing icons in nothing but black and white that Susan Kare established for the Macintosh. She worked each design out on graph paper with one square standing for one pixel, and restated commands as ordinary objects, a pair of scissors for cutting and a bin for deleting, so the set could be read without a caption in any country. Her sketchbook now sits in a museum collection.

  14. Solarized 2011– / Style

    Solarized is a sixteen colour scheme for terminal and GUI applications published by Ethan Schoonover with every value in the open, eight monotones and eight accents. The monotones hold symmetric CIELAB lightness differences, so moving between the light and the dark background keeps the same perceived contrast. It lowers brightness contrast on purpose and lets hue relations, not brightness, separate one token from the next.

  15. Skeleton Screen 2013– / Technique

    A loading treatment that drops the spinner and shows a blank version of the page instead, then fills information into it as the data arrives. Luke Wroblewski named the technique in 2013, writing about his own app Polar, where a spinner had made testers report that the app felt slower than the previous version. The aim is to show advance toward the goal rather than the act of waiting.

Back to index position