Live data from Hacker News

Golden Rules of Interface Design (2013)

cs.umd.edu

51–60 of 173 posts

Re: Golden Rules of Interface Design (2013)

#51
post #7

A designer I worked with years ago had a great explanation for why consistency is important. It’s not about a limited colour palette or a careful selection of fonts no one will ever notice. Chasing the specifics makes horrible software. Some people equate less diversity in their UI to more consistency. It’s about letting someone become an expert in your software. Microsoft office was always his example. People pride…

It's possibly one of the reasons why so many people were bent out of shape when MS introduced the adaptive ribbon shenanigans that tried to 'help' by only showing the most likely options. Really knocked my ability to find stuff

I still hate ribbons.

MS Office UI peeked around versions 97-2003 or so. Everything in a menu, actions grouped / categorized so they were easier to discover. QUICKLY accessible by underlined keyboard combinations (alt+menu letter THEN item in menu letter) and with any actions that had a direct keyboard shortcut annotated. Everything easily discoverable.

Ribbons, I've no idea how the categorize what's popular or not, but 'related' things seem weaker to me, and the context switch price is much higher. Plus there's a need to hunt and kill with a mouse instead of direct with the keyboard.

Re: Golden Rules of Interface Design (2013)

#53

Although not really part of a UI's "design", performance is often overlooked as well. A poorly performing UI violates every single one of these design rules. My sony android smart TV looks amazing but the UI is so slow as to be unusable. An unstable UI that is always changing also violates most of these principles. Smart TVs seem to be exceptionally bad in this area too, with the home screen layout and app icons freq…

Performance is part of design! The best designers will have conversations with developers about the performance implications of the UI they’re proposing, and will help negotiate trade-offs as engineering makes user-facing technical decisions.

Re: Golden Rules of Interface Design (2013)

#54

"For example, users should not have to retype an entire name-address form if they enter an invalid zip code but rather should be guided to repair only the faulty part." This is my biggest pet peeve, and I still see it. It should also be true for multi-page forms if you are going back and forth between form pages. "Erroneous actions should leave the interface state unchanged, or the interface should give instructions…

Annoying as shit. If I'm trying to log into something with an E-mail address (already a fail, but that's another topic) and password, and I click "forgot password," don't take me to a form where I have to re-enter the goddamned E-mail address I JUST ENTERED.

Or its twin cousin: forcing me to login after updating my password.

Re: Golden Rules of Interface Design (2013)

#55

Where are the apps shipped by umn.edu?

What does the University of Minnesota Twin Cities have to do with this discussion? And why do you care which apps a university research lab shipped? ;)

If you want to know about what contributions Ben Shneiderman and his University of Maryland Human Computer Interaction Lab have made, you can read my other post:

https://news.ycombinator.com/item?id=38920423

Or wikipedia:

https://en.wikipedia.org/wiki/Ben_Shneiderman

https://en.wikipedia.org/wiki/University_of_Maryland_Human%E...

Or Ben Shneiderman's home page:

https://www.cs.umd.edu/users/ben/

One app that the UMD Human Computer Interaction Lab shipped in several versions was HyperTIES, which was used to implement “Hypertext on Hypertext” that ACM distributed with the articles from the July 1987 Hypertext conference, which influenced Tim Berners-Lee to make hypertext links blue:

The Interactive Encyclopedia System:

https://en.wikipedia.org/wiki/The_Interactive_Encyclopedia_S...

HyperTIES Discussions from Hacker News:

https://donhopkins.medium.com/hyperties-discussions-from-hac...

>Don Hopkins sent the following message at 10:07 AM, AUG 28, 2021

>Why are hyperlinks blue?

>Hello Elise. Here is some information about why hyperlinks are blue, from Ben Shneiderman’s answer to a question I asked him about the origin of the term “hyperlink”. I think your belief that HyperTIES was not the first instance of blue hyperlinks because it used cyan links is splitting hairs, and a “No Blue Scotsman” argument, especially since Tim Berners-Lee told Ben Sheniderman at the time that he was influenced by Ben’s design as he saw it in the HyperTIES-based “Hypertext on Hypertext” that ACM distributed with the articles from the July 1987 Hypertext conference at the University of North Carolina. Ben describes the color as “light blue”, which he chose from the limited palette available on PCs at the time, based on controlled experiments he and his students performed comparing user comprehension and recollection.

https://news.ycombinator.com/item?id=28317104

HI Don (and Jack Gilmore),

Thanks for including me in this conversation.

I do not have a claim for the term “hyperlinks” and don’t know when it came into use. My claim is for the visual interface for showing highlighted selectable links embedded in paragraphs. This is what we called embedded menu items in that I think is an influential paper on the topic, which was peer-reviewed and published in the CACM in April 1986.

https://dl.acm.org/doi/10.1145/5684.5687

http://www.cs.umd.edu/~ben/papers/Koved1986Embedded.pdf

While Engelbart had shown a list that could be selected by pointing and clicking in 1968, I claim the idea of embedded highlighted selectable text in paragraphs. This was implemented by grad student Daniel Ostroff and described in:

Ewing J, Mehrabanzad S, Sheck S, Ostroff D and Shneiderman B (1986), "An experimental comparison of a mouse and arrow-jump keys for an interactive encyclopedia", International Journal of Man-Machine Studies, Jan., 1986, Vol 24, pp. 29-45.

[Abstract] [BibTeX] [DOI]

Ostroff D and Shneiderman B (1988), "Selection devices for users of an electronic encyclopedia: an empirical comparison of four possibilities", Information Processing and Management, Nov., 1988, Vol 24(6), pp. 665-680.

[Abstract] [BibTeX] [DOI]

I think the 1988 paper was the earlier study, but the publication took a while.

My students conducted more than a dozen experiments (unpublished) on different ways of highlighting and selection using current screens, e.g. green screens only permitted, bold, underscore, blinking, and I think italic(???). When we had a color screen we tried different color highlighted links. While red made the links easier to spot, user comprehension and recollection of the content declined. We chose the light blue, which Tim adopted.

His systems with embedded menus (or hot spots), where a significant user interface improvement over early systems such as Gopher. But Tim told me at the time that he was influenced by our design as he saw it in the Hypertext on Hypertext project that we used Hyperties to build for the July 1988 CACM that held the articles from the July 1987 Hypertext conference at the University of North Carolina. The ACM sold 4000 copies of our Hypertext on Hypertext disks.

Our history is here:

https://www.cs.umd.edu/hcil/hyperties/

and the video is very helpful in showing the design we used, which is what I think Tim built on for his WWW prototypes.

https://www.youtube.com/watch?v=29b4O2xxeqg

So in summary, I don’t know who coined hypertext, but I do think our work visual and interaction design was influential.

Our Hyperties system was picked up by Cognetics Corporation (around 1987) who made a modestly successful commercial run with it, doing dozens of corporate projects, most notably the Hewlett-Packard user manual for their Laserjet 4 was distributed as a Hyperties disk.

Hyperties was the name we shifted to after we got a stop and desist order from a lawyer because our TIES (The Interactive Encyclopedia System) conflicted with an existing product. By then “hyper” was a growing term.

Let me know if this helps, and what other questions you have…. Ben

----

HCIL also shipped various treemapping applications:

https://en.wikipedia.org/wiki/Treemapping

>Area-based visualizations have existed for decades. For example, mosaic plots (also known as Marimekko diagrams) use rectangular tilings to show joint distributions (i.e., most commonly they are essentially stacked column plots where the columns are of different widths). The main distinguishing feature of a treemap, however, is the recursive construction that allows it to be extended to hierarchical data with any number of levels. This idea was invented by professor Ben Shneiderman at the University of Maryland Human – Computer Interaction Lab in the early 1990s. [21][22] Shneiderman and his collaborators then deepened the idea by introducing a variety of interactive techniques for filtering and adjusting treemaps.

https://www.cs.umd.edu/~ben/papers/Johnson1991Tree.pdf

https://treemapart.wordpress.com/

Re: Golden Rules of Interface Design (2013)

#56
post #7

A designer I worked with years ago had a great explanation for why consistency is important. It’s not about a limited colour palette or a careful selection of fonts no one will ever notice. Chasing the specifics makes horrible software. Some people equate less diversity in their UI to more consistency. It’s about letting someone become an expert in your software. Microsoft office was always his example. People pride…

I worked with Ben Shneiderman at the UMD Human Computer Interaction Lab developing pie menus, and one of the important principles of pie menus, especially in comparison to both traditional linear menus, and invisible gestures as used by the iPad and mobile apps, is that they smoothly TRAIN novice users to become experts by using "rehearsal". Pie menus can lead, follow, or get out of the way. The way a novice uses the…

Do you know of any work about how to combine pie menus and keyboard usage? Mousing is very uncomfortable for me, but if a pie menu could be used with a keyboard-attached joystick, it might be a really quick way to work.

Re: Golden Rules of Interface Design (2013)

#57

Although not really part of a UI's "design", performance is often overlooked as well. A poorly performing UI violates every single one of these design rules. My sony android smart TV looks amazing but the UI is so slow as to be unusable. An unstable UI that is always changing also violates most of these principles. Smart TVs seem to be exceptionally bad in this area too, with the home screen layout and app icons freq…

Ever since Snapchat exploded in popularity I’ve decided bad UI is a gen z feature. They flock to difficult to use interfaces that become an insider feature for young folks to keep their parents out.

Very interesting. Yeah I think bad UI could be a way to gatekeep. 4chan for example has its mostly-unchanged now old-school interface, with its own quote/reply system, which some call an IQ barrier. That plus all the lingo. It typically gives out outsiders (journalists, govt agents, new users etc)

Re: Golden Rules of Interface Design (2013)

#59
post #51

Earlier quoted context omitted.

It's possibly one of the reasons why so many people were bent out of shape when MS introduced the adaptive ribbon shenanigans that tried to 'help' by only showing the most likely options. Really knocked my ability to find stuff

I still hate ribbons. MS Office UI peeked around versions 97-2003 or so. Everything in a menu, actions grouped / categorized so they were easier to discover. QUICKLY accessible by underlined keyboard combinations (alt+menu letter THEN item in menu letter) and with any actions that had a direct keyboard shortcut annotated. Everything easily discoverable. Ribbons, I've no idea how the categorize what's popular or not,…

My first job was on a particularly verbose set if software that's hard to learn. But, everyone that uses it does so daily and quickly become experts in their workflows.

Number of clicks was the #1 metric because a "pretty" UI would generally add steps and slow everyone down.

Verbose UIs are hard to learn but once learned have much better end-to-end workflows with fewer steps. Simple UIs hide information behind interactive (i.e. slow) workflows and universally hated by customers.

Re: Golden Rules of Interface Design (2013)

#60
post #7

A designer I worked with years ago had a great explanation for why consistency is important. It’s not about a limited colour palette or a careful selection of fonts no one will ever notice. Chasing the specifics makes horrible software. Some people equate less diversity in their UI to more consistency. It’s about letting someone become an expert in your software. Microsoft office was always his example. People pride…

I agree with the importance of consistency, but disagree with "Office and (Neo)Vim aren’t exceptional examples of UI, but they are uniquely stable." Office is not stable, at least over the long term. The hated "ribbon" marked a sad departure from the "stable" and efficient Word UI, and Microsoft's clueless regressions across the Windows platform have compounded the problem. For example, the deletion of the menu bar f…

We are about a year or 2 from the Ribbon interface existing in Office longer than the pre-Ribbon interface.

I will agree that the Ribbon and what you can customize or use in it/looks has changed drastically since 2007.

But the Ribbon “paradigm” will soon have existed longer than the non-Ribbon “stable and efficient” interface so it is more “stable” in one way.

Post reply on HN