Posts in Design (20 found)
Unsung Today

“Nemo? That’s a nice name.”

Do you know those “Are you still here” screens? In some cases – like banking – they are ostensibly there to improve security. In public transit ticket or similar machines, on the other hand, they exist just so the machine can easily reset itself ahead of a future customer. Resetting to default state happens on your phone, too. I’ve been thinking about it this past week and found a few examples. The Google Search app comes back how you left it, except if you abandon it for longer than 45 minutes. If that‘s the case, it returns to a pristine, deterministic homepage. (You can always come back to the previous session, though.) When you pause a podcast or music, at least in my setup, it will be on the home screen for 5 subsequent minutes – you can then resume it by simply tapping on your AirPods. But leave it dormant for longer than that, and the home screen forgets about it and resuming is impossible: = 3x)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/3-framed.1600w.avif" type="image/avif"> = 3x)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/4-framed.1600w.avif" type="image/avif"> My favourite: if you swipe through the apps back and forth on the iPhone in a touch UI equivalent of command-tabbing, there needs to be a specific moment where the app you switch to becomes the “current” app. On desktop, it’s easy – you can reset the state at the next invocation of ⌘⇥. But there is no such obvious moment on mobile. When there is no obvious moment, timeout can be a great answer. And so it is here, and it seems to be set at about 5–6 seconds: I understand the Google Search and the app switching examples. But I am not sure I know why a podcast resets so soon. A challenge when talking about this without seeing the code – as it is with many things on Unsung – is that I don’t know if this is carelessness, a technical limitation, a design consideration I’m unaware of, or just something that’s intentional, but I happen to disagree with. Even testing this has been hard if the delays are longer than seconds. The extra challenge for Google Search, as it is for many other apps, is that they also reset when iOS itself purges it to make room for other apps. This isn’t great, and can be avoided if you care; we talked before about Bear and how it remembers its precise state even after the system evicts it from its memory. Whether you want your app to remember you forever, or whether you want some deliberate forgetfulness, it could be important to take ownership of that. My go-to example of a miss in this category is Google Maps, which completely throws away its current trip-in-progress status whenever the iOS kicks it to the metaphorical curb – and returning to that status later again as a user is a really complicated sequence of steps including rewinding back the time, on top of travel already being stressful. = 3x)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/6-framed.1600w.avif" type="image/avif"> = 3x)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/7-framed.1600w.avif" type="image/avif"> By the way, I can think of fewer examples on the desktop, but that makes sense given desktop apps are less tactical, and given that ⌘Q exists. But Spotlight does freshen itself up after about 7 or 8 minutes… = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/8.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/8.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/9.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/9.1600w.avif" type="image/avif"> …and Raycast actually offers an option to set its short-term memory from between 0 seconds and three minutes, with the default being 90 seconds: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/10.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/nemo-thats-a-nice-name/10.1600w.avif" type="image/avif"> #details #google #interface design #raycast

0 views
Unsung Yesterday

Shift & ⌥ & Splat & ⎋ Escape

The biggest smallest GUI design schism between Apple’s platforms and Windows isn’t the black vs. white cursor or where to put the menu bar. It’s the presentation of keyboard shortcuts. On a Mac, the shortcuts are iconographic. Command is ⌘. Option is ⌥. Shift is ⇧. Control is ⌃. Fn is 🌐 . There are also icons for all the other non-printing keys, from the relatively well-known Tab (⇥), through the perennially confusable End and PgDn (⤓ and ⇟), to the absolutely cryptic Esc (⎋). On Windows, the keyboard legends are mostly text. PC lost the icon battle in the early 1980s – IBM had them on their 1970s computers, worldwide, but apparently American users of the early IBM PC hated them – and the names are spelled out (Shift and Enter and Home), or close to it (Ctrl, Esc, PgDn, Prt Sc). Why did Apple go this way? My speculation is the revered Braun and generally hi-fi hardware: a lot of stuff sold in Europe defaults to iconography in part because that makes exporting easier. Icons are also more compact – putting ⇧⌘C in a menu or a tooltip takes up a lot less space than Shift+Ctrl+C – and more beautiful when done well. Here’s Figma’s right click menu on Mac and Windows: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/1.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/1.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/2.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/2.1600w.avif" type="image/avif"> But there are also challenges, as icons are more cryptic and confusing. “Command” tells you something about itself out of the box, but “⌘” is completely abstract. (Arguably, only arrow keys and symbols like ⇥ and ↵ explain themselves visually.) The attendant issue is that icons are hard to talk about if you don’t know their names, hence tons of jargon like “propeller,” “splat,” or “beanie” for ⌘, for example. It’s a hard situation. Here is one of Mac’s own menus being thoroughly inconsistent, and an example of CleanShot using both the icon and the label to be sure: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/3.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/3.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/4.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/4.1600w.avif" type="image/avif"> “Why not both” seems to be the best way in places you can afford it. Apple started doing that on the keyboards too, but it took them decades to get there for modifier keys alone. Even on the 2026 computers, many other keys like Esc and Tab are still single-legended: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/5.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/5.1600w.avif" type="image/avif"> With all that in mind, I want to show you what I saw the other day in Google Docs, on my Mac: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/6.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/shift-and-option-and-splat-and-escape/6.1600w.avif" type="image/avif"> This is one of those cryptic things that I would love to understand the thinking behind. Because, on the surface, this breaks so many rules: There is also a visual argument that cannot be ignored. We’ve been there once before ; if in your menu keyboard shortcuts start overwhelming the commands themselves, you are probably doing something wrong. The only explanation for this I can think of off the top of my head is this: these were invented somewhere else (Word?) and inherited by Docs to respect motor memory of the users transition from the older app. That still doesn’t cover the presentation, plus there is a way for Docs to redesign the shortcuts to be better for people who are starting anew. Ultimately, I think all of this also breaks a cardinal rule: it makes keyboard operation feel more scary and intimidating than it needs to be. Shortcuts are scary enough on their own, and they don’t need any help in this area. #google #iconography #keyboard #mac os A strange hybrid of Mac and Windows styling: some modifier keys are spelled out, and the others are iconographic. (It’s very strange to see ⌘ conjoined with others using a plus!) Complex and generally uncommon dual key shortcuts – to collapse the sidebar, you really need to press ⌃⌘A and then press ⌃⌘H, in sequence. Three-modifier-shortcuts are in general really unpleasant and Google Docs does not seem complicated enough to warrant them. (You can’t see that, but they’re also unreliable! ⌃⌘A ⌃⌘H doesn’t always work and seems to depend on where the focus is.)

0 views
Unsung 5 days ago

Within or without

In Figma, when choosing a font, you can filter down a list of fonts from “all” to specific categories or e.g. only fonts present in the current file. But when you type into the search field, the search cuts across all fonts again, ignoring the applied filter. The search effectively lives outside the filter. In Keyboard Maestro, when adding an action, you can click in the nav to filter down to a specific category. And when you search, the current filter remains active, so you search inside the filter. Which one is better? I don’t have a universal rule here, because it will depend both on the UI treatment, and the specific filters and searches people do. But I think here, my recommendation for Keyboard Maestro here would be to do the same thing as Figma does. I designed that flow in Figma, so I might be biased, but my reasons are: On that last note, I find it’s good to look around what you’ve designed once in a while and consider not what the UI set out to be, but what it became – there might be more examples of that around you. #flow #interface design There aren’t really a lot of options in each category, so you don’t benefit a lot from double filtering. But the most important thing: For both Figma and Keyboard Maestro, the text field might smell like a text filter and as such expected to be multiplexed with the category filter, but I think this field is actually something else: It’s quick keyboard access, like ⌘F or Spotlight or Raycast. And if you think about it this way, it’s important for it to be deterministic – I can always type “Output Sans,” no matter what state am I in, and get to the font.

0 views
Unsung 6 days ago

A few interesting modern pixel fonts

Andrew Gleeson designed Analog Mono , “fixing the crimes of VCR OSD Mono.” There used to be this classic pixel font that you’d see everywhere in the 1990s on hi-fi equipment: VCRs, TVs, camcorders, etc. One of its challenges was a low baseline which resulted in all the letters with descenders pulled up, for example: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/1.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/1.1600w.avif" type="image/avif"> Analog Mono fixes that problem: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/2.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/2.1600w.avif" type="image/avif"> Elsewhere, Kumiko Yoshida made Coral Pixels (also on Google Fonts ), a color font that comes with the 1990s and 2000s colorful fringing baked in. The fringing was once an artifact of subpixel rendering, but now it is meant to evoke nostalgia or just as an interesting visual element in and of itself. (Perhaps adjacent to chromatic aberration?) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/3.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/3.1600w.avif" type="image/avif"> Lastly, here’s Two Slice by Joseph Fatula – a font that’s only 2 pixels tall, “and somewhat readable.” = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/4.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/4.1600w.avif" type="image/avif"> Of course, these are all vector fonts – e.g. ready to be installed on a modern operating system – pretending to be pixel fonts. That’s maybe a separate post altogether, but it leads us to the last font, Geist Pixel from Vercel : = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/5.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/a-few-interesting-modern-pixel-fonts/5.1600w.avif" type="image/avif"> The copy introducing the font is a little pretentious/​spicy, but it touches upon something important: Geist Pixel isn’t a novelty font. It’s a system extension. [… It] was designed with real usage in mind, not as a visual gimmick, but as a functional tool within a broader typographic system. […] This matters because pixel fonts often break in production. They don’t scale properly across viewports, their metrics conflict with existing typography, or they’re purely decorative. Geist Pixel was built to solve these problems, maintaining the visual texture teams want while preserving the typographic rigor products require. There are definitely fonts whose Achilles’ heel is not the letterforms, but the invisible hard work put into everything that surrounds them: the kerning, the metadata, the extra glyphs, the vertical metrics. It seems that the team being Geist Pixel is proud of especially that last part. #typography

0 views
Unsung 6 days ago

Google Docs shortcut onboarding

A nice, but unpolished onboarding callout directing people towards a more useful shortcut, in Google Docs. I’m holding arrow keys without ⇧ here first, then with ⇧: To improve it, I would add some sort of small celebratory “completed!” state, and auto-hide it afterwards; right now, it seems that it hides on a delay, likely regardless of what happens. (Testing onboarding is hard because once it’s invoked it disappears forever. If you are worried about onboarding experiences in a place you work, please insist on easy toggles to bring it back for testing. And no, one-size-fits-all “reset onboarding” is too crude; ideally you can reset each specific one easily through a simple UI.) Thank you to Ezra Spier for the tip. #google #onboarding

0 views
Susam Pal 1 weeks ago

Don't Roll Your Own ...

This is going to be a rant about modern web design practices. But before I get to that, let me begin with a familiar principle from the world of cryptography. Among software developers, and especially among those who work on security-sensitive systems, there is a well-known maxim: Don't roll your own crypto. This does not mean that nobody is allowed to write cryptographic code. Someone has to. It means that, for ordinary production software that protects sensitive data of users, we should not rely on a private, unreviewed implementation that has not been vetted by the wider software development community. We should use established, vetted software packages or tools wherever possible. Fortunately, it is now standard industry practice to avoid rolling your own crypto and instead use cryptographic algorithms and packages that have been peer reviewed and stood the test of time. It wasn't so some twenty years ago. I have seen several flawed home-grown RC4 implementations early in my career, with issues like improper initialisation vectors, predictable keystreams and partial leakage of plaintext into ciphertext, putting sensitive data of users at risk. But today, major e-commerce websites or banks typically do not use home-grown cryptography for its web services. In fact, in regulated domains such as payments, healthcare and personal data processing, doing so could violate requirements for strong cryptography, possibly leading to hefty financial penalties. Website design is obviously not cryptography. A broken scroll bar is not the same kind of failure as a broken encryption scheme. But I wish there were a similar maxim for website design as well. There are many aspects of websites where, I think, developers should not be rolling their own X, especially when X is something browsers already do well and something users depend on every day. Here I present a list of such X. Of course, there are valid scenarios where you may need to roll your own X. But here I want to focus on the cases where you should not roll your own X, and how doing so can lead to a worse user experience, at least in my experience. I am not saying that nobody should ever build anything themselves. As someone who does a lot of creative computing myself and develops fun tools from time to time, I am a big proponent of developing your own stuff. But when it comes to developing user interface features for serious websites that people need to use to get their work done, I wish the software development community were more conservative in deciding what fancy feature goes into a website and what is left out. Do keep in mind that I am no expert in user experience. Far from it. So none of what I am saying here should be taken as a recommendation. But I am a user of the Web, and as a user, I have found some modern web design patterns to be frustrating. This post is a lament from one user of the Web, not a design guide. Of all the things I mentioned above, the one that bothers me the most is custom scroll behaviour on websites. I am used to how page scrolling responds to my mouse, touchpad or keyboard input. When you override the default scrolling behaviour of the web browser with your own implementation, it 'breaks' the page for me. The page now moves too slowly or too quickly when I scroll. Keyboard scrolling may or may not work. You take something I am so familiar with that I don't even think about it, and turn it into something unfamiliar that I now have to think about. Custom link navigation is another pet peeve of mine. Web browsers can already handle links very well. You could say that this is the whole reason web browsers even exist. Following links is their bread and butter. You shouldn't have to mess with that behaviour at all. If you think you need to, reconsider what you are trying to achieve and whether it is really so important as to disrupt normal link navigation. The worst offender I have found here is GitHub. When you click on a link on GitHub, say, a file link or an issue link, it triggers a massive piece of functionality implemented in JavaScript that handles the link click for you. If you don't believe me, visit your favourite project on GitHub using Firefox or Chrome, type F12 to open the browser's developer tools, then go to the 'Debugger' or 'Sources' tab, find 'Event Listener Breakpoints' on the right sidebar, expand 'Mouse' and select 'click'. Then click on a link on GitHub and see what happens. I'm sure I am not the only one who has noticed that, on GitHub, a clicked link sometimes takes too long to load. Ironically, it is often faster to open the link in a new tab than to wait for GitHub's JavaScript code to handle the navigation in the current tab. A custom password input field is another such hazard. Fortunately, custom password input fields have become rarer over the years. The password input field that comes with the web browser is generally well equipped to handle passwords. It can offer to save passwords, fill them in later and generate strong passwords for new accounts. It can also warn when a password is submitted over an insecure HTTP connection, work well with password managers and autofill, and cooperate with mobile keyboards and accessibility tools. If you replace the browser's password field with your own fake version, you may break all of that. You may also end up using an ordinary text field and masking it yourself, in which case the password may be treated by the browser, the operating system or assistive tools as ordinary visible text rather than as a password, thereby exposing the password in ways you did not intend. Custom date pickers are another common annoyance. I know that does not help you select a date range. But that is okay. You can provide two date input fields, one for the start date and one for the end date. I am willing to pay the small price of using two different inputs to select a date range if that means I can use my favourite web browser to navigate the calendar and select dates the same way everywhere. What I am less inclined to do is to learn ten different ways of using the date selector in ten different implementations across ten different websites. Right now the implementations of date selector are all over the place. Some require you to zoom out of the month view to enter a year view, where you can select years. While you are there, you cannot change the month again until you return to the month view. Some require you to click the previous-year button literally forty times to select your year of birth if you are old enough. Some do not let you type the date at all. No. I do not want to learn your calendar widget. I just want to use the date picker in my favourite browser, which is quite sane. Saner than your custom implementation. If you need to have a calendar widget to support browsers with inadequate native date-picker support, perhaps that support can be added alongside the native date picker rather than as a replacement for it. For example, the ordinary element could be left intact, with a custom widget provided in addition to it so that users can manipulate the same field. In general, just stop messing with the form controls. They almost always introduce new problems while solving some existing ones. And while you are at it, don't keep changing your website layout and interface every few months! I may adapt to the new design, but my ageing relatives cannot. For them, every time you change the user interface, it amounts to learning a whole new tool. If every website keeps doing this every few months, they have to spend a significant amount of time relearning familiar things for no functional benefit. Please just let them enjoy their retirement. Imagine how you would feel if a Linux distribution decided to redesign all its core commands and their command-line options every few months. Or imagine how you would feel if the buttons of your washing machine were rearranged every morning. It wouldn't be pleasant! Read on website | #web | #technology Don't roll your own page scrolling. Don't roll your own link navigation. Don't roll your own text selection. Don't roll your own context menu. Don't roll your own copy and paste. Don't roll your own password field. Don't roll your own date picker.

0 views
Unsung 1 weeks ago

Lisa’s copy (and cut, and paste)

I love looking at origins of obvious things, because of two things: I’ve been emulating the Apple Lisa recently, and I was struck by how many of its UI strings were slightly or wholly different than what we’re used to. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/1.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/1.1600w.avif" type="image/avif"> It makes sense. Lisa came out in 1983 as Mac’s predecessor and really the first GUI that is directly linked to what we’re using today. Even though it borrowed things from work done at Xerox , tons of conventions were not established yet. So, I thought it would be fun to actually take a closer look. For context, Lisa was as slow as it was expensive, and generally considered a failure. It was basically abandoned by 1985. Not much third-party software has ever been written, but Lisa shipped with 7 impressive office apps with fantastic names: LisaWrite, LisaCalc, LisaDraw, LisaGraph, LisaList, LisaProject, and LisaTerminal. The screenshots below come from an emulator and from manuals (this links to the 1984 version, but each manual also includes a link to the original 1983 edition). The emulator is pretty harrowing; please upvote the idea of Lisa in Infinite Mac if you would want to see it! = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/2.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/2.1600w.avif" type="image/avif"> As Lisa powers up, we see the appearance of the “wait” dialog box. We’ll encounter more symbols like this triangle, inspired by traditional flowcharts. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/3.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/3.1600w.avif" type="image/avif"> Let’s start with menus, as these really were the treasure map to the whole system. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/4.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/4.1600w.avif" type="image/avif"> The Desk menu is basically the equivalent of the dock today. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/5.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/5.1600w.avif" type="image/avif"> The File menu has Print appended to it, indicating how important printing was still then; a truly “paperless office” won’t really be possible for two more decades (and seemingly still hasn’t fully arrived ). There is no Window menu yet, so the menu also contains some of that burgeoning functionality. Set Aside is what we would call Minimize today. Save & Continue is basically a contemporary Save, and Save & Put Away a hypothetical Save & Close. Revert to Previous Version is the same as today’s Revert. By the way, in the Revert dialog I appreciated the nice gesture of telling the user how much time passed since the last save, and a warning about undo (we’ll get back to this): = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/6.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/6.1600w.avif" type="image/avif"> Print Current Selection would today be just Print Selection. Print As Is is basically Print… but skipping the setup dialog with number of copies, etc. It was added later in Lisa’s life, and today, we’d probably call it Print Again? If you’re noticing a pattern already, it is more wordiness compared to what we see these days. It makes sense. Our growing familiarity with these concepts is what will allow these strings to become tighter over time. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/7.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/7.1600w.avif" type="image/avif"> This is that Print… dialog, by the way, with beautiful “while you wait” and “while you work” verbiage (although usually I do not condone strings getting so close to each other). The manual explains : “You can have the Lisa use most of its attention to print your document while you wait. A document will print more quickly if you choose While You Wait, but you won’t be able to use the Lisa for any other tasks.” The other strings feel less typical. Format For Printer… is Page Setup, but with a lot of quirks. Printers were not usually yet WYSIWYG , able to mirror stuff exactly on the screen. They often came with their own fonts, so some matching was necessary: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/8.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/8.1600w.avif" type="image/avif"> The manual had an entire section called “When Settings Don’t Match a Printer,” and there were I imagine god knows how many error cases that had to be covered, including: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/9.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/9.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/10.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/10.1600w.avif" type="image/avif"> And Monitor The Printer… is today’s Print Center: a way to see the real-time printing status. Note a lot of writing here elaborates further on the “while you wait/​while you work” dichotomy: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/11.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/11.1600w.avif" type="image/avif"> Monitor The Printer was important, by the way, since the manual warned you your printer might occasionally become haunted: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/12.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/12.1600w.avif" type="image/avif"> But, let’s go back to the File/​Print menu. I actually found a version of this menu that comes from a 1982 pre-release Lisa , never launched to the public. Let me show them side by side: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/13.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/13.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/14.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/14.1600w.avif" type="image/avif"> It’s fun to see designers figuring it all out. You will notice the lack of dividers and ellipses actually touching the work-in-progress strings. 1983’s Set Aside is 1982’s very modern Close. Save & Put Away is Put Back. And, at the bottom, it seems the team didn’t yet figure out that the menu options need to consistently use verbs for commands, and adjectives or nouns for toggles – so we see Intended for Printer… (rather than Format For Printer…) and Printing in Progress… (rather than Monitor The Printer…). = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/15.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/15.1600w.avif" type="image/avif"> Lastly, in a released version of LisaList, this menu would come bearing a harrowing Fix Damaged Document command. Not only it doesn’t even have an ellipsis, but the manual also says “there is always the chance that the recovery process will make things worse instead of better.” Vaya con dios, I suppose. Let’s move on to the Edit menu. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/16.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/16.1600w.avif" type="image/avif"> Today’s Select All is a verbose Select All Of Document, and since this is the first public appearance of undo, that feature is also more descriptive, appearing as Undo Last Change. But otherwise the menu feels surprisingly modern, shortcuts and all. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/17.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/17.1600w.avif" type="image/avif"> Unsurprisingly, the first undo wasn’t as developed. We saw earlier in this post “Once you click OK, you will not be able to change your mind, even with Undo,” which today would probably say “This is not undoable.” You could also see a frightening error message arriving without any further clarification, like above. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/18.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/18.1600w.avif" type="image/avif"> Sometimes, the app would warn you undo doesn’t have your back. We’ve seen this before, and here’s another example. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/19.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/19.1600w.avif" type="image/avif"> Since undo only had one step, LisaCalc and LisaList also had Restore Previous Entry for when you changed your mind after editing a cell in the spreadsheet. You had to employ this strategically, as you did the already-mentioned Revert to Previous Version. “You can even undo Undo!” bragged the manual, and I imagine there must have been interfaces where undo came without a matching redo. But the eventual solution, of course, was bidirectional undo/​redo with many steps. This basically only needed more memory, still very expensive in 1983. Above we also see Clear Entries that would just be called Clear today. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/20.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/20.1600w.avif" type="image/avif"> Elsewhere in Edit menu, Clear Lines Off Top would appear in LisaTerminal only, and was a charming (and I would argue better) way of saying Clear Scrollback. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/21.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/21.1600w.avif" type="image/avif"> The next menu, Type Style, would be called Font today. “Type” is typewriter nomenclature – Lisa was meant to be a typewriter replacement. The point/​pitch convention for font sizes and letter spacing also comes from typewriters, and in an older version of that menu even font names arrive from that universe (PS = Proportionally Spaced!): = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/22.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/22.1600w.avif" type="image/avif"> Otherwise, notable is the deterministic Plain Text reset with a P shortcut that would in time lose to printing. I miss this sometimes, this “reset” idea, as I think it would nicely compliment Paste And Match Style. (By the way, Lisa was the last computer to use Apple logo as a modifier key .) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/23.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/23.1600w.avif" type="image/avif"> While Type Style is for selection, Format ¶ is all about paragraphs – HTML people know this distinction as “inline vs. block.” (The pilcrow symbol means “paragraph,” although I did not expect it to be common use even then.) The flyout menus with their convoluted mechanics weren’t invented yet, but in some sense there was no need for them as the options were very limited. It is interesting to see Margin/Tab Ruler as two options with deterministic shortcuts ([ and ]). But the most unbelievable shortcut must be Same As On Clipboard. It reformats the current selection to match what you have in the clipboard – an early salvo in an endless battle that later brought us Paste Special, Paste And Match Style, Paste And Retain Style, Copy/​Paste Properties, Paint Format and so on, and so on. And it was given S, rather than spending it on Save (& Continue). Otherwise Left Flush and Right Flush would be called aligning today, and the ¶ pilcrow symbol would be replaced by a simple Paragraph Spacing. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/24.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/24.1600w.avif" type="image/avif"> In LisaCalc, Format is missing the ¶ because, well, there are no paragraphs in spreadsheets! I love Words Left/Nos. Right, and empathize with trying to align the digits. But it wasn’t even close , was it. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/25.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/25.1600w.avif" type="image/avif"> Page Layout shows that we’ve had UI boolean problems from day one. Show Page Ruler and Hide Page Ruler do it deterministically, with one always disabled, and without checkmarks. Preview Pages and Don’t Preview Pages do the checkmark, but introduce a dreaded double negative. (These last options, by the way, is the “pages/​pageless format” showing page margins and dividers, that bother us so much about Google Docs.) Today, these would all be in the View menu that doesn’t exist yet. And speaking of boolean challenges, here are some top-level menus from LisaList with even more conventions: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/26.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/26.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/27.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/27.1600w.avif" type="image/avif"> But, back to the Page Layout Menu. Insert Page Mark would be Insert Page Break today. I really love Allow To Cross Pages as the opposite of Keep On Same Page, and the incredible O and Q shortcuts. In LisaCalc, this particular menu comes with a beautifully named For Your Information (sentence capped, for some reason)… = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/28.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/28.1600w.avif" type="image/avif"> …throwing up a sheet-like window showing basic stats. Today, that window would have a more boring name and probably land in the File menu: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/29.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/29.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/30.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/30.1600w.avif" type="image/avif"> The Search menu is fascinating – why wasn’t it called Find like its items are? I am particularly enjoying W keyed off of Find What (today: Find), while F is taken by Find Next Occurrence (today: Find Again). There is some mnemonic sense to it all, but I like today’s proximity of ⌘F/G better. What we know as Replace is Change here, and I am particularly loving Cases Must Agree and Cases Need Not Agree (today usually called “case sensitivity.”) Hide Dialog Box is a string with surprising to me amount of UI jargon. The H shortcut was added later in Lisa’s life, presumably at users’ behest. It’s strange today to see a shortcut like this to hide one specific floating dialog box. Similarly, Insert Wild Card with a confusing ellipsis allows you to insert a symbol in your find dialog that stands for “match anything here” – top-level menu options reaching inside specific dialog boxes were not uncommon in early years of GUIs, but I think fell out of favor over time as the idea can be conceptually confusing. The menu below is from LisaWrite, and I like how comparing it with other apps makes us see the team trying to settle on a convention. In LisaList there are no ellipsis, but question marks! = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/31.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/31.1600w.avif" type="image/avif"> And in LisaCalc, there are… both: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/32.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/32.1600w.avif" type="image/avif"> You can notice that it wasn’t clear where one would put Find-related commands and their today’s presence in Edit menu doesn’t really make a lot of sense, either. We just got used to it. (Also note the “occurence” typo.) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/33.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/33.1600w.avif" type="image/avif"> Spelling menu has a bunch of fun options and conventions, and an extremely generous use of keyboard shortcuts: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/34.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/34.1600w.avif" type="image/avif"> LisaDraw sports the Arrangement menu, which will look very familiar to anyone using Illustrator, Sketch, Figma, and so on. This is where Bring To Front and Send To Back started! With a tiny bit of editing (Arrangement is now Arrange, and some of the Objects nouns would be omitted), this would feel pretty modern. I love these visual menus, and I think we lost that kind of stuff along the way: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/35.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/35.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/36.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/36.1600w.avif" type="image/avif"> Okay, let’s move on from menus. The system also relied a lot of dialogs. Let’s look at some of them: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/37.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/37.1600w.avif" type="image/avif"> This wordy dialog would become a small loading state today. The verbose “To terminate the operation, hold down the Apple key while you type a period” probably felt necessary because other than Shift on a typewriter, people were not familiar with modifier keys. Lisa doesn’t have the Esc key, and Mac still respects the ⌘. convention in many places in 2026. (By the way, why would you want to stop saving? Presumably because it could take quite a while.) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/38.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/38.1600w.avif" type="image/avif"> In this similar dialog, you can see a reference to a “micro diskette.” Even though Lisa’s “Twiggy” disks seem gargantuan today, they were smaller compared to the original, 8″ floppy disk . (In a similar way, Lisa and other machines of the era were called “microcomputers.”) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/39.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/39.1600w.avif" type="image/avif"> Lisa had some proprioception : In this dialog, the disk put in the first drive is called an “upper diskette.” (Also note: more undo education.) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/40.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/40.1600w.avif" type="image/avif"> Disks were not large, so sometimes you had to deal with this kind of horror. It’s interesting how the dialog plain sends you to the manual – an early equivalent to eventual Learn More links. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/41.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/41.1600w.avif" type="image/avif"> This is another example of a rather verbose set of instructions. On one hand, this is better than “Error 456” and nothing else. On the other hand, it feels like a lot of stuff to memorize. Also of note, the beautiful Housekeeping menu. I actually forgot about the Finder (or, in Lisa’s parlance, Desktop), so here’s a screenshot of it also: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/42.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/42.1600w.avif" type="image/avif"> Housekeeping was basically the junk drawer – on the Mac a year later, this will be named Special. It also has some stuff that today would be in the View menu. (This later version of Lisa calls Trash the same as the Mac. Earlier on, you would see it named a Wastebasket instead.) = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/43.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/43.1600w.avif" type="image/avif"> Of note elsewhere in Desktop is the use of the term Stationery, roughly meaning “template,” but with extra sprinkling of desktop-metaphor skeuomorphism. Also, Attributes Of is an early version of Get Info. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/44.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/44.1600w.avif" type="image/avif"> Another verbose dialog (compare with Abort/​Retry/Ignore from around the same time). This is before we invented hint text that we’d just put under the buttons themselves. In case you haven’t noticed by now, Lisa’s strings all have two spaces after a full stop! = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/45.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/45.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/46.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/46.1600w.avif" type="image/avif"> = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/47.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/47.1600w.avif" type="image/avif"> There was lot of “you cannot” dialogs, walking you through some recovery steps. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/48.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/48.1600w.avif" type="image/avif"> Plug and play didn’t yet exist (this would all happen in the 1990s), so that had to be explained also. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/49.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/49.1600w.avif" type="image/avif"> I also love the anthropomorphic phrasing “Preferences has been told,” which I don’t believe you see anywhere today. And I think we can round up this post with a few small delightful language details like this one. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/50.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/50.1600w.avif" type="image/avif"> As a huge fan of the slightly pretentious “presently” over “currently,” I smiled seeing this next to the printing status. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/51.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/51.1600w.avif" type="image/avif"> “Just a moment, please…” feels so old-fashioned, somehow. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/52.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/52.1600w.avif" type="image/avif"> And I want to end on a pre-release version of the Edit menu we’ve already seen. You can spot here Select Entire Document (instead of eventual Select All Of Document), but of course the best thing is the Copy, Cut, & Paste with an ampersand! I find it so, so charming. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/53.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/lisas-copy-and-cut-and-paste/53.1600w.avif" type="image/avif"> I hope you enjoyed this tour. It was interesting to me to see how many of these became the standard back there and then, how many were tweaked a little bit, and which ones had to be redone more thoroughly. Now, excuse me as I have to go deal with my whistling printer. #history #interface design #writing They help me get unstuck. If you go far enough, you will find out that even the most ossified conventions that are older than you haven’t always been this way. They put me in the mood of “what of the things that feel normal today that deserve to feel dated, obsolete, or awkward?” Find Next Misspelling (you don’t often see that word!) Suggest Corrections + Paste Guess (this is just replacing the word with the suggestion – interesting use of the clipboard metaphor) Put In Dictionary (today: Learn Spelling)

0 views
JSLegendDev 1 weeks ago

The Trick to Designing Highly Replayable Arcade and Linear Games

I recently finished a prototype for a game called HARVEST MOVE based on an arcade style game of the same name that I developed 3 years ago. In the original version, the player moves on a grid and needs to collect as many crops as possible while avoiding enemies. If they get hit, the player is presented with their current score, their best score and the ability to play again. A screenshot of my HARVEST MOVE prototype However, while remaking it, I took a few design decisions that altered massively the replayability of the game. I’d like to share what I did. First, I structured the game into configuration of enemies (I’ll start using the term level rather than configuration to make things clearer) that determined what enemy types and how many where to be placed on the grid. I then, tied those levels to specific score thresholds. Therefore, once a player reached a threshold they would be seamlessly moved to the next level. Secondly, I turned the player’s score into a currency. When they had a game over, they could spend the wealth accumulated to unlock more valuable crops that would start spawning in their next attempt. Even though players always replayed the game starting from the first level, they could accumulate wealth much faster which translated to faster progress through levels they had previously played. Additionally, the more crops they unlocked, the more likely they were to reach late game levels locked behind higher score thresholds because they simply earned more. Now, why does this structure seemingly works in making an arcade/linear game more replayable? I have a few hypothesis to present which are listed below. There is now a sense of permanent progression which mitigates the feeling of loss you experience after losing in a score based game. This makes you more likely to try again. Replaying previous levels while being more powerful/quicker gives the player a very satisfying feeling of power which feeds into an innate power fantasy of some sort. If your game has upgrades that meaningfully alter the gameplay experience, then you tap into a novelty effect that will make the game more enjoyable for longer. For example, having unique items/weapons the player can unlock or alternative pathways in a level or an alternative level. I don’t think so. Roguelikes usually rely on procedural generation and randomization to keep things fresh. There is less emphasis on level design and more emphasis on making builds and testing them out. Rather, I would estimate this structure to be more similar to time loop based games like The Legend of Zelda Majora’s Mask. In Majora’s Mask, you play through the same handcrafted environment over and over and progressively unlock things in the game allowing you to access things you couldn’t before. However, that doesn’t mean procedural generation can’t be used. In fact, I used it in my game, but I don’t believe in it being a core aspect. Considering I accidently discovered this through experimentation, I still think there is room for fine tuning. However, this makes me excited to test this structure again in future projects. I wonder how this would fit with an RPG or a platformer, etc… That said, it would be nice if I could get your feedback on my game. To make things as convenient as possible, here is a google form (link to the game is inside the form) for you to provide your feedback so you don’t have to create an account to be able to comment. Anyway, if you’re interested in all things related to programming, game development and game design I recommend subscribing to not miss out on future posts. Subscribe now A screenshot of my HARVEST MOVE prototype However, while remaking it, I took a few design decisions that altered massively the replayability of the game. I’d like to share what I did. First, I structured the game into configuration of enemies (I’ll start using the term level rather than configuration to make things clearer) that determined what enemy types and how many where to be placed on the grid. I then, tied those levels to specific score thresholds. Therefore, once a player reached a threshold they would be seamlessly moved to the next level. Secondly, I turned the player’s score into a currency. When they had a game over, they could spend the wealth accumulated to unlock more valuable crops that would start spawning in their next attempt. Even though players always replayed the game starting from the first level, they could accumulate wealth much faster which translated to faster progress through levels they had previously played. Additionally, the more crops they unlocked, the more likely they were to reach late game levels locked behind higher score thresholds because they simply earned more. Now, why does this structure seemingly works in making an arcade/linear game more replayable? I have a few hypothesis to present which are listed below. There is now a sense of permanent progression which mitigates the feeling of loss you experience after losing in a score based game. This makes you more likely to try again. Replaying previous levels while being more powerful/quicker gives the player a very satisfying feeling of power which feeds into an innate power fantasy of some sort. If your game has upgrades that meaningfully alter the gameplay experience, then you tap into a novelty effect that will make the game more enjoyable for longer. For example, having unique items/weapons the player can unlock or alternative pathways in a level or an alternative level.

0 views
Unsung 1 weeks ago

“This is a common tell in web apps, and we did a lot of work to eliminate it.”

I have mixed feelings about Raycast announcing their move from the native interface to one powered by web tech (this is the same thing that made Photoshop’s dialogs so bad ), but their blog post announcing the change has at least a useful list of some details that separate good native apps from bad web ones. I think it’s worth checking out that list and internalizing it even if you’re nowhere near that kind of a decision, because some of these are universal requirements for a better-feeling interface: There is more in the blog post , and a lot more still left unsaid. Let me add one that I see all the time: accidental text selection. Web makes all text selectable by default, regardless of whether it makes sense for that text to be selected. On top of that, text selection heuristics on complex layouts are not that great. That means that surprisingly often you will see half a text on the page being selected in response to an accidental click or drag. Here’s an example from YouTube I just spotted, where dragging a sidebar selects everything inside it: It’s all solvable via the use of event cancellation and , but requires someone to think about it happening. Yes, there are moments where GUIs allow you to select text for a reason… …but it’s always been a tricky proposition given the scarcity of affordances. It might be better to employ a pretty common “copy to clipboard” pattern instead. #interface design #web No on interactive controls. Desktop apps don’t do this. It’s small, but it immediately signals “this is a website.” No hover highlights on most controls. On macOS, buttons and list items don’t highlight on hover the way they do on the web. Settings open in a separate native window, not a modal or a side panel. Popovers and tooltips render as native windows, not as DOM elements inside the WebView. They can extend beyond the window bounds, just like native popovers do. On macOS Tahoe, we adopted Apple’s new Liquid Glass material so Raycast blends with the system’s updated visual language from day one. No flickering when views appear or transition. This is a common tell in web apps, and we did a lot of work to eliminate it.

0 views
Unsung 1 weeks ago

Shallow breathing

Turns out that the breathing light survives, sort of, not really, in an Apple product today: The AirPods Pro case does this when charging – right at the start, or when you tap it later. But it disappears after a while, the pace is now 28 breaths a second (over twice as fast as the original iteration), and the light is orange. Is it still the same thing, reflecting on how smaller organisms breathe faster? Or is it mostly an unrelated idea, with the light fading in and out indicating activity rather than lack of it? My money is on the latter – the light turns white when pairing, too, and it cycles even faster then – but it was nice to imagine the return of the old feature for a second or two… or 2.1, to be precise. #apple #details #hardware #motion design

0 views
Daniel De Laney 1 weeks ago

The Fourth Era of Computing

The polarity of hard and easy in computing is inverting. Raw configuration files, exposed APIs, terminal-first applications; these have all become easy. They are the hooks agents want, and we don’t have to think about them. Polished GUIs are now becoming the hard path by comparison, because we have to use them ourselves. This change has sparked the fourth era in the evolution of computing. By describing it and how we got here, I will overturn most of the things I’ve ever said about user interface design. I’ve always advocated for simple GUIs that normal people can use, but that argument is losing its potency. Ugly exposed wiring is exactly what makes something the right choice now. In the first era of computing, everything was hard. You memorized a specialized language and you typed it at a prompt. If you hadn’t read the fine manual, the computer was entirely opaque to you. In the second era, we defended ourselves from the inhumanity of the CLI with the GUI. Functionality was behind discoverable buttons rather than typed commands. This was progress for humans. It was also a step toward an evolutionary dead end. In the third era, designers got involved. Principles of user-centered design entered the public consciousness. Software competed on the experience of using it. Many of the most beloved software companies built their reputations on human-centered GUIs. This is widely understood as progress, and in a sense it was. Software became more accessible to humans. But the better software got for humans, the more it was adapted only to humans. At the time, that was fine. There was nothing else to operate it. I recently rebuilt my home theater PC. Linux, Jellyfin, Caddy, a few other pieces. Five years ago this would have meant a weekend I wasn’t looking forward to. Partitioning my hard drive by hand. Hand-editing config files. Debugging error codes. I did none of that. I described the outcome I wanted, and an agent got to work issuing commands and editing config files. To say that 2026 is the year of the Linux desktop for me isn’t quite right. I’m not exactly using “the Linux desktop.” I’m using an agent. The agent uses the desktop on my behalf. The reason I picked Linux is that an agent can drive it. Every meaningful thing on the system is a file or a daemon or a command. The historical weaknesses of these tools are now their advantages: config-file-heavy, terminal-first. Anything I can pipe into another command is something an agent can operate on my behalf. The macOS Settings app, by contrast, is closer to what we’ve historically regarded as good design. And the only way to use it is for me, a human, to open it and click on things. I hate doing this now. Beautiful, human-centered design has become a wall my agent can’t climb, which turns me into my agent’s errand boy. The choice is no longer “easy for me to use” versus “hard for me to use.” The choice is: Do I want a computer that’s easy to use, or a computer I don’t have to use because something else uses it for me? This is what the Fourth Era means. The terminal most people ran from has come back, but not for them. It’s where their agents live. Users: Pick the stack with hooks. Pick Linux. Pick the open-source thing with the ugly config file over the polished SaaS. Five years ago this was the difficult path. Today it’s the easy one, because you don’t have to use it. Builders: If you’re shipping something that’s GUI-only, the era your users are from is ending. Pick something. CLI, config file, REST API, MCP, anything. The software that survives will be whatever people don’t have to operate by hand. The terminal is back on top.

0 views
JSLegendDev 1 weeks ago

How I Accidentally Made a Game for No One

I initially set out to make an arcade game, then I tried turning it into an incremental. Finally, I ended up with a game that’s neither an arcade game, neither an incremental and on top of that, it looks like a puzzle game. In this video, I explain how I ended up making a game that appeals to no one!

0 views
Jim Nielsen 1 weeks ago

Something’s Rotten in the State of macOS Icon Design

This is an iconic observation : If you put the Apple icons in reverse it looks like the portfolio of someone getting really really good at icon design This isn’t, however, just the story of Apple’s Creator Studio icons. It’s the unfolding story of icon design across the entire macOS platform. For example, take a look at some of Apple’s other apps like iMovie : Or Remote Desktop : Apple sets the standard (and the rules) for how icons look on the Mac. Wherever they go, so goes the ecosystem — and they’re taking the entire ecosystem along down with them. It’s fast becoming the case that if you put any Mac app’s icons in reverse, it looks like the portfolio of someone getting really, really good at icon design. Even Microsoft — not exactly a bastion of design — starts to look pretty decent with their icons the further back you go. For example, with OneNote , the app icon’s progression looks like it went something like this: Some 3rd-party apps continue to fight a good fight, even as Apple’s definition of what an icon should be — or what’s even possible — shrinks all around them. Apps like Capo (remember, these are reverse chronological ): Or BBEdit : Or Fantastical : Or Cot Editor : Everyone’s being put in a box squircle. The imposition is real. I don’t blame any of the 3rd-party app makers. Their designs have to play by Apple’s rules (or end up in icon jail ). World-class designers like Matthew Skiles or The Iconfactory are still out there striving for excellence, even as they’re hamstrung by the Mac’s latest rules. When it comes to icon design on the Mac, the sky is no longer the limit: Apple’s icon design sensibilities are. They set the examples of what world-class icon design should look like, but what do you do when the examples are no longer exemplary? Reply via: Email · Mastodon · Bluesky “I made this with AI” “I tried to make the AI one, but by hand myself” “I don’t need to be constrained by this squircle” “Hey, I’m getting better at this”

0 views
Zak Knill 1 weeks ago

Generations of AI applications: conversational, delegative, and collaborative

Walk into most product reviews, board decks, or “AI strategy” docs and the mental model on display is still the one from November 2022: a chat window, a back-and-forth, an LLM replying in prose. That model is two generations out of date, and teams building against it are solving the wrong problems. The conversational generation of AI applications came first. ChatGPT launched in November 2022, and through the first half of 2023 the Chat product category evolved. In early 2024 Google Gemini joined the race, and the Claude 3 family of models launched. These products are all part of the conversational generation of AI applications. It’s this generation of AI apps that still matches most people’s mental models. The core interaction of a conversational app is a text box at the bottom of the screen, you type a question or instruction, and the AI replies in the same window, in prose. This is also the design of most AI library examples. This is the design that uses HTTP request/response and SSE streamed responses. It’s the design that fits well into companies’ existing technologies and architectures. This mental model is closer to instant messaging than anything else, which is why some of the first areas of disruption were the areas where users were already interacting with a chat-box. Customer support, and search. In the conversational generation of AI applications, there’s no sense that the AI is doing anything for you. You are consulting the AI and it’s responding to you; answering your questions, asking you questions. Most people’s workflows operated on copy-pasting information in and out of the conversation. The AI’s response is essentially the whole product in the first generation of AI applications.

0 views
David Bushell 1 weeks ago

Web whetstones

How do you stay sharp as a web developer and/or designer? I’ll share my advice below. I’m also looking for front-end folk to advise me too. What are your whetstones? That is to say: sources of news and knowledge to level up professionally. Does that metaphor work? We’re sharpening our minds, and I suppose the web too with our minds… are minds the whetstone here? Moving swiftly on, in rough order of preference: People love to declare “RSS is dead” because they’ve chosen the likes of Google to gate-keep their web access. Interesting choice, but RSS remains alive and well. When I discover a new blog and like what I read, I’ll subscribe. There’s a good chance that person will write something useful again one day! Funny how that works. I don’t flood my reader with big sites that exist to generate content. I collect personal blogs that may only post once a year. That’s still plenty of unique insights as the list grows. I won’t share my list because I feel for RSS to work you have to curate it yourself. Shop Talk Show has been number one forever. Syntax remains a decent source if you’re deft with the fast-forward button (it’s a little ‘sloppy’ these days.) Igalia Chats is packed with wisdom. For a Better Web is Bruce Lawson in your ears. Wonders of Web Weaving from James is new and hopefully a regular listen. I’ve unsubscribed from too many podcasts that pivoted to AI servitude which is disheartening. I’m not adverse to such discussion but the level of mindless platitudes and gigglefests about what their wacky chat boxes said ain’t my cup of tea. Mastodon and Bluesky is where I follow folk in the web industry. Socials can be a great whetstone if you manage your follow list carefully. Everyone uses these platforms for different reasons which can be difficult to balance. Personally I stick to shop talk and mute politics for example. I follow individuals and rarely organisations to avoid “brand engagement”. Email newsletters are useful to catch stuff I’ve missed. Many exist in RSS form too. My favourites are typically link dumps with a side of commentary. Current favourites: Sidebar still has the odd gem if I care to sift through the “AI” links. Newsletters are a declining category for me. Perhaps because I keep getting unsubscribed by those with failed tracking pixels. Email costs money to send so I’ll accept my loss. Lobste.rs , Hacker News , Reddit (e.g. web dev , experienced devs , frontend etc). Does dev.to have any humans left? These forums are a good source of links — if you can filter the bot spam and avoid the cesspit of comments. Toxicity spreads and it’s all too easy to get dragged in. Sometimes you just have to let people be wrong on the internet. I’ve heard these still happen! I only leave my house now to scavenge for essentials so I don’t have much to say. Clearleft events are guaranteed value if you’re in the UK. Some conferences have online tickets but I find the in-person socialising to be the main benefit. Everything listed above is (or has) a website. I’m poor at organising and utilising bookmarks. I’ll manually visit bigger blogs like CSS-Tricks and Smashing Magazine once a month to see if anything interests me. I bookmark a handful of YouTube channels like Kevin Powell because I have no Google account to “smash that subscribe button” . YouTube isn’t my thing though. I have an allergic reaction to algorithm driven content. I don’t use Discord but I hear it get promoted often. Are these communities lively or are they a ghost town? That’s my problem with Discord. It’s a blackhole for information; antithetical to an open web! Am I missing out? Not sure I care. For no particular reason I’ll end with this quote from Seth Rogen. “I don’t understand what it’s supposed to do. Every time I see a video on Instagram that’s like, ‘Hollywood is cooked,’ what follows is, like, the most stupid dog shit I’ve ever seen in my life,” he said. “And if your instinct is to use AI and not go through that process, you shouldn’t be a writer, because then you’re not writing.” Seth Rogen Says If “Your Instinct Is to Use AI” to Write Scripts, “You Shouldn’t Be a Writer” - The Hollywood Reporter P.S. no more blog posts until June. I’m due a holiday! Thanks for reading! Follow me on Mastodon and Bluesky . Subscribe to my Blog and Notes or Combined feeds. Frontend Focus Design Systems News

0 views
Unsung 1 weeks ago

Less doesn’t need more

A simple rule for overflow logic that will prevent your app looking a bit stupid … = 3x)" srcset="https://unsung.aresluna.org/_media/less-doesnt-need-more/1-framed.1600w.avif" type="image/avif"> = 3x)" srcset="https://unsung.aresluna.org/_media/less-doesnt-need-more/2-framed.1600w.avif" type="image/avif"> …is to avoid “more” expanding to just one item. If the expansion takes up as much room as the UI to show the expansion, why not show it in the first place? #details #interface design

0 views
Unsung 1 weeks ago

“Easy to use,” the hard parts

A reader asked me this, and I thought I will answer here: One bit of challenge with [where I work] is that my audience isn’t already almost-guaranteed to be into design! They’re hopefully interested in making good software in general, though, and probably curious about the app [I’m building] they could be using. I’m also afraid that developers sometimes confuse “easy to use” with “beginner-only, limiting”, which makes it harder to write about streamlining UIs; there’s only so many times you can invoke “reducing mental load.” I love this question because it gets to the core of why I started this blog. I’m perennially unhappy with the conflation of “craft” with “delight,” and the subsequent narrowing of “delight” into “cute strings and slow animations.” In the famous words of Steve Jobs, “Design is not how it looks. Design is how it works. What’s tricky is that they’re sometimes related, and even if you learn how to tell the difference, your exec team probably never will.” I am quoting from memory. Anyway, I hope spending time on Unsung – please like and subscribe – helps with examples of what to talk about and how to talk about them. But, just to list some alternatives to “reduces mental load” for well-made software that come to my mind: There’s more, and I am curious what comes to your mind and how you all connect with developers! But maybe just going through a list like this will provoke some ideas. (Of course, if you cannot honestly claim some of these about software you’re working on, and you think they’re important – I guess you have some work to do.) #storytelling is more efficient gets you home earlier will allow you to spend more time on things you enjoy will allow you to choose which parts of the problem to spend time on reduces tedium understands and practices progressive disclosure understands you speaks your language learns your preferences meets you where you are is made by people like you respects you will make you better at what you do rewards mastery doesn’t dumb things down will teach you concepts helpful in other software never takes control away from you is easy to customize adapts to you doesn’t disobey you will make you look good in front of others respects history and legacy of the space is built well is conceptually/​systemically beautiful is well-considered or thoughtful

0 views
Unsung 2 weeks ago

Safari and system design, pt. 1

To me, “tap anywhere at the top to scroll to the beginning” is an amazing and underappreciated mobile gesture: It not only provides an alternative to desktop‘s Home and ⌘↑ keys, but the student laps the teacher here; it’s actually better than every way to scroll to the top on desktop (do you like pressing ⌘↑? do you even have a Home key?), and it’s an icing on a cake of a regular flick to throw the page to the top already being pretty nice. Tap to return to top is also distinctively mobile in that it allows you to tap just anywhere near the top edge that’s not already a tap target; as far as I can observe, traditional GUIs detest being imprecise in this way, always asking you to click on something specific (although window moving on macOS in the post-title-bar era is also starting to feel similar). The iPhone gesture seemed to work so well that, over the years, more patterns started borrowing from it. In Bluesky and tons of other apps, you can tap on any tab with scrollable content a second time to scroll all the way to the top. (Again, something that’s hard to imagine on desktop, where you pretty much almost never think of clicking on an already-selected item.) It’s not just the top, either. In Podcasts, tapping Home goes back to the left: And in Photos, to the bottom: To me, the whole “tap to return to the beginning” gesture universe feels ascended to be the core property of the interface. In that way, it is similar to scrolling, undo, copy/​paste, arrow keys moving the text cursor, and so on, all inducted to the National Register Of Historic Gestures. Why? Because these gestures can only blossom if they work consistently , everywhere. You need to start trusting them so much they slide into your subconsciousness. Breaking the gesture in one place will make it less trustworthy in other places, too, ejecting it from motor memory back to the level of deliberate effort , and therefore making it a lot less usable. “Does this thing work here or not?” is a death knell of flow. The fact that tapping on tabs is idempotent means there’s also no penalty; if you’re already at the beginning but are not sure, tapping it mindlessly won’t hurt or send you back somewhere else. This is all great. And this is why I’m unhappy Safari started mucking with it. Safari has tabs at the bottom – starting with two (regular set and “private” set), although you can add more. Above is a long list of site cards, with newest at the bottom. It’s exactly the same situation as in Photos, and yet tapping on either tab doesn’t restore the scroll position. Instead, it opens the settings dialog: And, tapping around the buttons does nothing. I would imagine Safari is a pretty important app used by many people, and so this feels like a bad place to introduce an inconsistency that could have a more serious consequences of un-teaching people about tap to scroll to top in the long run. The funny thing is that the solution is already there: you can tap ··· in the upper left corner to get to the same functionality. The long press on the tab also opens the same menu. Messing with a “tap to go back to the beginning” system gesture like this means to me the design team doesn’t fully share the understanding of the value of their own creation, or maybe that stewards of the gesture system are not vigilant… or perhaps the awareness is there, but the caretakers aren’t recognized, rewarded, or empowered enough. It’s similar to the “ no, thanks ” example I shared before, a possible worrisome tragedy of the UX commons in the making if the respective teams do not change course. Because, wedging that sort of an exception in – even if you have a great set of reasons in the moment – creates a precedent . Inevitably, from my experience, the next team that will want to override scroll to top, or misuse “No, thanks,” will now require less of a justification. #definitions #details #flow #interface design #touch

0 views
Unsung 2 weeks ago

Not a radio pharma ad

I like sharing, thinking about, and revisiting basic rules and principles because they really do ladder up to help you with more complex things down the road. I wrote before how a simple rule to give some breathing room to your length-limited edit fields can be upleveled to a more general “let me color outside the lines when I’m editing” principle. This is another example of a similar situation. I am in Buttondown, which is a mailing list software. I created a quick test draft just to check something out in the editor, I didn’t do anything else, and then I proceeded to delete it. Then, I was greeted with this: = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/not-a-radio-pharma-ad/1.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/not-a-radio-pharma-ad/1.1600w.avif" type="image/avif"> This is nothing more than a larger version of the “You have 1 email(s)” problem . There might be a situation when I’m deleting something that has been published and linked to. In that case, it’d be good to know about how any links to that thing will cease working. But this is not that kind of a situation, and the software has all the info to know that. In this moment, it could show me a simpler, much less alarming message more appropriate to my situation. This is not the end of a radio pharma ad where you have to rattle out all the legal disclaimers just in case something could happen. One tiny counterexample from my neck of the woods: in Figma, when you start writing a comment and then exit without posting it, you get a little warning. But you don’t get that warning when you type something that’s <= 8 characters. In this case, the assumption is that retyping a few characters elsewhere (assuming you haven’t just changed your mind altogether) is much easier and faster than cognitively processing and dismissing the warning. = 2x) and (width >= 700px)" srcset="https://unsung.aresluna.org/_media/not-a-radio-pharma-ad/2.2096w.avif" type="image/avif"> = 3x) or (width >= 700px)" srcset="https://unsung.aresluna.org/_media/not-a-radio-pharma-ad/2.1600w.avif" type="image/avif"> The challenge with Buttondown’s dialog is that this is more than just extra cognitive processing and “cheapness.“ Here, the stakes are higher, as we’re talking about something adjacent to data loss; the dialog really does feel a bit scary and makes me think I can do some real damage in a situation no real damage is possible. #interface design #principles #writing

0 views

What Time Is It?

On Palm OS, the interface for picking the start and end time of an event is represented as two columns, hour and minutes. The hours list either starts at 8AM and shows until 7PM (covering a full business day, or it starts at the next hour (if creating an event for today). Minutes are represented for every 5 minute interval, allowing every option to be shown at once. This interface is simple and requires an extremely low cognitive load to use. It's scannable and adaptive to the current situation (today vs another day). It limits options (ie you can't set a time of 12:33) to drive simplicity. If we compare to the time picker on Android, we can see it's significantly more complex. One must first tap the hour, then tap AM/PM, then tap the minutes section and tap the minute they need. While minute intervals of 5 are shown on the screen, the user is able to select specific minutes, if they know how (one must drag the circle to get a specific minute). The interface has many more taps, states and cognitive load. How about iOS? Like Palm OS, iOS limits you to 5-minute intervals. Similar to Android though, an additional interaction is needed to pick AM/PM. Picking hour and minutes is more involved as well, you must scroll the picker to the desired value. The Palm OS UI might not be the prettiest, but it's the fastest for most use-cases. The most common options (business hours and 5-minute intervals) are presented without the need for multiple states or scrolling. Setting the time is 2 taps away!

2 views