8 ms·

The Same User Interface Mistakes Over and Over

119 points by panic 11y ago

peter303 11y ago
Mobile offered a bit hope. First, the screens were to small to clutter with complicated GUIs. Second, you could substitute some visual controls with touch.
- hyperpape 11y ago
  The piece by Maciej (http://idlewords.com/talks/website_obesity.htm http://idlewords.com/talks/website_obesity.htm) on page weight points out that a lot of sites have responded by developing desktop sites as if people are using them with touchscreens. I'm not sure that's a good idea.
- TheOtherHobbes 11y ago
  I recently tried to get my mobile provider to set up data roaming while I was away from home. (You can't set up data roaming from home, for reasons that remain mysterious and unexplained.) The fact I was using a mobile device didn't stop my provider's site from asking three times if I wanted to take part in a survey, or from displaying a floating "Would you like to chat?" dialog that was so big it literally covered a quarter of the mobile screen - and which moved to the same position whenever I try to scroll it out of the way. It also didn't help my provider provide the right links to the right content. Eventually I gave up. My gf already had data working, so we used her phone for everything. The experience was impressively terrible. Unfortunately if you don't have UI clue, mobile is just another way to get stuff wrong.
  - lmm 11y ago
    Try using an iphone (or spoofing your user agent as one). Often they don't test or care about any other phones, but iphone users get the VIP treatment.
collinglass 11y ago
was hoping you were going to give a standard resource where I can find alternatives for common bad designs
- hyperpape 11y ago
  Ditto. Sadly, this got posted three times to HN already and hit my twitter feed without seeing anyone say "you're wrong, there's a book everyone should read!" At this point, my hopes are low.
  - iolothebard 11y ago
    http://www.amazon.com/Designing-Web-Usability-Jakob-Nielsen/dp/156205810X http://www.amazon.com/Designing-Web-Usability-Jakob-Nielsen/...
- musha68k 11y ago
  Check out "About Face" by Alan Cooper et al. A well respected interaction designer was so kind to give me her 1st edition many years ago and I still find myself coming back to it regularly. New and updated 4th edition: https://en.wikipedia.org/wiki/Special:BookSources/9781118766576 https://en.wikipedia.org/wiki/Special:BookSources/9781118766...
  - rpeden 11y ago
    I'll second this recommendation. I picked up the 4th edition a few months ago. It's a great book, but also a very long read. As a developer who is interested in developing usable apps, but not in being a full-time UX designer, I've found that I've been able to pick and choose the bits of the book that are relevant to the tasks I'm working on. It helps if you've read the introductory bits, but later on it has sections about web, desktop, mobile, etc. that are useful on their own. It's almost like having several books in one.
  - vram22 11y ago
    I had bought and read the 1st edition of About Face years ago. Thought it good generally. Might not have understood everything in it at the time. I remember him talking about "affordances". One point I thought was good, was his idea for a scroll bar with both the arrow heads at the same end of the bar, instead of at opposite ends. This saves you from having to move your mouse from one end of the bar to the other, to reverse scroll direction (since you have to click on either the up/left or down/right heads). Like this (for a horizontal scroll bar): <||> ============================= instead of this: <|==============================|> Cool. Later I heard from someone that some OS/GUI platform actually has his improved version - I forget which.
mmatants 11y ago
If you decide to study how to build bridges, you will start out with calculus, build a background in science of materials and then a guided tour of approaches to structure-building. In addition, you have to learn typical environmental factors. And, of course, there are workflow patterns and human factors involved in actually constructing a typical bridge. Oh, and sure, there will be a bit of CAD. Let's apply this metaphor to programmers working on UIs: a huge chunk of practitioners right now get by via simply having learned a bit of CAD (i.e. HTML/CSS/JS). And also, yeah, they have walked over a bridge once/seen a panoramic postcard, so there's that. Very ad-hoc, very disorganized, full of gaps. Of course the impact of mistakes is magnitudes different between designing bridges and building UIs. Except for when that UI drives medical automation. Or finance (one of my faves is an anecdote about how a bad input form field cost a fund management company literally in the 8 digits of money). Our industry is of course very young, and so I think this education gap is simply a temporary issue. I am looking forward to (and am personally investing into) a day when there will be a more systematic and comprehensive education on how what a good UI looks, behaves and feels like, not just how to code buttons and boxes on a screen.
- analog31 11y ago
  I work in product development for things that have mechanical and electronic bits, etc. There are disciplined processes for designing things, typically applied to life support systems such as bridges and jet planes. Or, hi-reliability components like hard drives. But outside of life support products, I would guess that the majority of product development is only as disciplined as it needs to be, for what's being made. A lot of stuff is designed by seat-of-pants, by people sitting at CAD stations who mostly have engineering degrees but don't engage in engineering and have forgotten all of their math and theory. The level of organization and discipline needed to do things like design airplanes is done by the segment of engineers who enjoy that discipline and gravitate towards those industries. People who prefer to do seat-of-pants design find their own niche as well. At my workplace, I can't count the number of times I've heard: "But we don't design airplanes here." Our stuff works when it gets to the customer, but if you scrutinize our designs the way we've all been trained to scrutinize UI's, you'd be horrified.
1971genocide 11y ago
"Set of Standard Resources" Check out Material Design by google - its been a lifesaver to me who is from a very technical background. Best part is with very little work you can really impress your bosses ! Good Luck
- gameboy24 11y ago
  Material design is great but I see apps that don't need it implement it a lot. Not every app needs a FAB, or a card ui.
- Jach 11y ago
  Material Design is just like Apple's guidelines. It's great for helping to create something that looks uniformly designed and not a hodge podge of UI gimmicks, helping design-ignorant coders create something that looks nice, and as you say it's easy to get management buy in, but is it actually good? Will following it actually reduce your count of UI mistakes? Personally I don't like it at all, and I've had many complaints, both functional and from personal preference, with Google's design changes over the last few years.
  - 1971genocide 11y ago
    I agree. But I do not have the time to go back and do another degree on design. Try convincing people with money to shell out extra for someone with good design experience. I guess once we have millions of customers we might have to think about it - but small companies without much resources its hard to justify spending a lot of resources on good design.
    - dflock 11y ago
      Good design == lower churn, higher LTV.
RoboErectus 11y ago
I always thought "Don't make me think" was a bit of a UI reference that everyone should read.
- macintux 11y ago
  I got a lot of grief from fellow software developers at Progeny (RIP Ian) for having that book lying around.
  - sdoering 11y ago
    May I ask why? Is there anything wrong with that book from a developer's point of view?
    - fit2rule 11y ago
      It makes them think.
      - ufuk 11y ago
        Well, somebody's got to do the thinking...
Nutmog 11y ago
I think everyone knows that non-modal dialogs, live previews and obvious icons are better, but they're also harder to do.
euske 11y ago
I tend to think that making a good UI is like writing a good technical document or good presentation slides. We should think UI as a kind of natural language. There could be some subjective guidelines, but I don't think there will ever be a definitive standard.
teyc 11y ago
Does anyone have enough experience with Tk and REBOL why these should be exemplar as far as UI and layout is concerned?
- DonHopkins 11y ago
  I implemented a gui for SimCity in Tk, and at the time (~1993) it was the best user interface toolkit for X11 available, but only because the competition was Motif and its ilk. The reason it was relatively good in that context is that it had a built-in scripting language: TCL. (So did WINTERP, but that was XLisp + Motif, so Motif made it suck a hell of a lot more than XLisp made it win.) As a scripting language, TCL is terribly designed (but beautifully implemented). But all that mattered at the time was that there was a scripting language that was present at the time the GUI tooklit, Tk, was designed (so they did not overlap and squabble about what they were trying to do) -- not that the scripting language itself was any good. (Personally, I'd MUCH rather be programming GUIs in PostScript than TCL, which is what I did before, for the previous port of SimCity to NeWS.) The fact that TCL was an integral part of the design of Tk from day 1 made it possible to use the scripting language for what it was good for, instead of Tk trying to do that in a half-assed non-turing-complete way: to glue everything together and do all the dynamic symbolic stuff, binding events to handlers, creating objects, naming them, plugging them together. All with wonderfully flexible simplicity and generality. Instead of trying to wrap the X Toolkit Intrinsic's and Motif's lame overlapping and incoherent attempts at object oriented programming, configuration, skinning and event handling in C and .XDefaults files. Here's a typical TCL file that creates an instance of a SimCity editor window (it's more complex than a typical less dynamic TCL gui, since it's capable of creating any number of independent editor window instances, which is why it uses a $win prefix for everything it creates): https://github.com/SimHacker/micropolis/blob/master/micropolis-activity/res/weditor.tcl https://github.com/SimHacker/micropolis/blob/master/micropol... No matter how much you love Lisp, WINTERP was still just using it to wrap Motif, even though Motif was suffering from a terminal case of Greenspun's tenth rule, and contained its own ad hoc, informally-specified, bug-ridden, slow implementation of half of Common Lisp. Here's WINTERP: http://nielsmayer.com/winterp/ http://nielsmayer.com/winterp/
  - 11y ago
dman 11y ago
Request to all designers - please stop building nested scroll and drag interactions. Common pet peeve for me recently is embedded map widgets in web pages. A user scrolling the page will find at some point that their mouse has come over a map which is now eating the scroll events and they are now scrolling the map instead. Only choice at that point is to move the mouse over and start scrolling over. Bonus annoyance - In many cases it is non trivial to reset the map to its default setting before the unwanted scroll interacted with it. Hovering over an item is a very weak commitment from the user that they want to interact with the element. Please do not use the hover to infer that the user means to interact with the element, at the very least put in some kind of timer and enable the interaction only on sustained hovers.
- rsync 11y ago
  "A user scrolling the page will find at some point that their mouse has come over a map which is now eating the scroll events and they are now scrolling the map instead." This annoyance has been widely extant for ten years or more - I think I first experienced it with google maps as I believe they were the first to zoom with scroll ... Seems easy to fix - sub window elements in the browser cannot zoom until clicked on ? It's amazing that behavior made it through one browser version iteration.
  - nothrabannosir 11y ago
    As long as you also track "going out of focus" , to disable the scroll capturing again.
- agumonkey 11y ago
  Courseware MOOC platform nests things it's so amazingly bad. I forgot how bad it was.
yakult 11y ago
>>It's also not clear that the model of background apps requesting the user's attention works. How many iPhones have you seen with a red circle containing "23" on the home screen, indicating that 23 apps need updating...and it's been there for months? I would argue this is working as intended. The advantage of background notification rather than modal is that the user gets a choice. The user could very well decide that your EXTRA SUPER URGENT notification is, in fact, unimportant, and this right here is a perfect example. No, I don't care if your bullshit app that I've opened a grand total of twice needs a 200 MB update. If anything, there should be an option to force old notification circles to go away after two weeks or so except for legitimately important apps like email and messaging.
- prawn 11y ago
  Agree. I avoid updating apps that are working satisfactorily because many later add ads or other annoying functions.
  - rpgmaker 11y ago
    Or remove functions, or change the UI needlessly and for the worse. I honestly don't know how people can update their apps without having a backup to go back to. I probably would not do it if I didn't have one of my backups around. The different app stores should offer the user a way of going back to a previous version (if you already had it installed) but it seems that none of them do so...
    - schrodinger 11y ago
      As an app developer, I understand the frustration but you've got to see the other side too. There's a huge cost to maintaining legacy server side API end points. I think the sibling commenter makes a great point about the difference between standalone apps and apps that are a client to a web service. It's also very frustrating when I see a crash keep happening in my error logs that I know is fixed in a later update :(
    - newscracker 11y ago
srinivedantam 11y ago
I'd say bootstrap and the likes are killing the need for a fresh look at design by offering templates. For me the savior has been Basecamp's design. Always made sense and looked great.
jtolmar 11y ago
Looking back through time for all the horrible UI sins cataloged in the opening paragraph, I'm pretty sure all of those were much more common in the past than they are now. Somehow, we actually have made those pieces of progress. Except for cryptic icons, those seem on the rise again.
DonHopkins 11y ago
The review of the QuickTime 4.0 player [1] at the User Interface Hall of Shame [2] should be required reading for user interface designers. Apple can't even follow their own guidelines, and keeps making the same mistakes (and worse), even today. [1] http://hallofshame.gp.co.at/qtime.htm http://hallofshame.gp.co.at/qtime.htm [2] http://hallofshame.gp.co.at/index.php?mode=original http://hallofshame.gp.co.at/index.php?mode=original
- J_Darnley 11y ago
  Thanks. A real trip into history. (I was about to say "memory lane" but I think most of these predate the point where I stared using computers a lot.)
rsync 11y ago
Can we talk about search dialogs that are not actually dialog boxes ? I first saw it at netflix - instead of a search box in the upper right, there is a picture of the word search and if you click on that picture of the word search it becomes a textbox[1] that you can type into. As if that's not bad enough, the word "search" can turn into a textbox faster than it takes to fully load the control, which means you get the textbox but cannot type into it for another few moments. How much of an unimaginable asshole do you have to be to pervert a basic web UI component like this ? [1] No, of course not a real textbox - some 50 kilobyte control from some web-authoring toolkit that masquerades as a textbox.
- frik 11y ago
  That's what Netflix got from using Reactjs. Facebook people search on mobile page version uses React too. It worked very well as a traditional AJAX search. Then they changed to to use React and now it takes a second or two to initialize and load the page (even it is in cache). And the search textbox doesn't feel like a native textbox, it's very laggy and shows inputs way too many milliseconds later. And on top of this the search result adds another delay. So searching for "Joe doe" means a laggy delay for every character as you try to type it in. Why? It tries to guess the person after every keyboard change event. Something that worked fine with the original AJAX version (Facebook optimized that version a lot an blogged about it / wrote a paper). Sadly with the React rewrite the forgot to read their own blog and probably React is an overkill for such a type of page and consumes to much CPU cycles on mobile devices. If you have to refresh 90% of the search results page anyway, why use React? Building and diffing a VirtualDOM isn't cheap (and ShadowDOM isn't supported), and it would be a lot faster to simply overwrite the DIV with innerHTML and traditional vanilla Javascript AJAX. Use the right tool, don't use a hammer for everything.
  - coldtea 11y ago
    >That's what Netflix got from using Reactjs. ...for using Reactjs badly. IFTFW. First, they could have had the item as a search box from the start, no need to make a label that when clicked turns into a search box. >* If you have to refresh 90% of the search results page anyway, why use React? Building and diffing a VirtualDOM isn't cheap* Actually it can be as cheap as directly changing the DOM with JS. And diffing can be just a single op e.g. when using an immutable data structure for their always changing part of the data. It's just a change done crudely, not even non-optimized, because it doesn't need that much optimization anyway.
SonicSoul 11y ago
This really grinds my gears: I was just on pluralsight but seems like 90% of websites have this problem where existing members are treated as 2nd class citizens. I executed a search for "UX" and found a class I waned to see. After clicking int it I was given 2 options "sign up" and "cancel". So as an existing paid customer my only options are "login" on upper right which then puts me on main member screen so I can perform that search again. or go through login process, and then hit the back button exact # of times to put me back a that search results page. Then if they didn't fuck that up i'd be able to go to that course and see it. And believe me, some websites manage to fuck that up too. Other versions of this UX antipattern is where you try to get to the content and 99% of the screen is about signing up while 1% is the tiny "sign in" hyperlink. It causes much anxiety to actually locate it.
- SonicSoul 11y ago
  close cousin to this problem is lack of clear login area. Take Evernote for example, home screen has all of it's homepage taken with big photo, plan explanations, sign up form. But for existing users ? there's a tiny hamburger icon up top which you have to click to reveal the "sign in" link which will then finally give you the login form. This is so frustrating my only possible understanding is "f existing users since we already have their money"
lazyjones 11y ago
The most annoying "focus stealing" for me is what (some?) browsers do when actions initiated earlier on (like clicking on a bookmark that doesn't appear to load) finish while I'm typing in the address bar: they just overwrite what I typed with the new URL, or cause focus loss on the address bar so I suddenly type "nowhere". So frustrating...
- douche 11y ago
  IM clients that steal focus when a new conversation begins are fantastic about this. More than a few times a coworker has gotten half a line of random code as a response when they try to ask me a question over Sametime.
SixSigma 11y ago
The fact that those are the faults you think are the worst shows how entrenched bad UX is. E.g. drop down menus are a fail. If you read Raskin's "The Humane Interface" you can see a whole host more. Raskin, Jef 2000.The Humane Interface, Addison-Wesley ISBN 0-201-37937-6
- coldtea 11y ago
  >If you read Raskin's "The Humane Interface" you can see a whole host more Well, Raskin also has some bizarro ideas about what a good UI should be, and his later attempts of realizing one is not anything most people would want to use.
  - SixSigma 11y ago
    I use Acme text editor which uses some of Raskin's ideas It is the best I have ever used https://en.wikipedia.org/wiki/Acme_%28text_editor%29 https://en.wikipedia.org/wiki/Acme_%28text_editor%29
    - coldtea 11y ago
      You, Rob Pike and 10 other people.
      - SixSigma 11y ago
        mind yourself on that edge or not everyone can drive a Ferrari
hendekagon 11y ago
Focus-stealing annoys me the most. Applications should never steal focus & should always open in the background.
HankB99 11y ago
IANAUIE (guess what that stands for. ;) ) Yet I am primarily responsible for the UI on the product on which I'm writing code. I started out with a bland and crappy interface expecting the client to look at that and provide their branding and suggestions for how it should work. Most UI elements are their default colors. Style? Please, I'm an engineer! I thought at some point they would provide a detailed list of requirements to provide a decent UI. I thought wrong. I have done what I could to provide an easy to use intuitive interface. Unfortunately what is intuitive for me is not going to be intuitive to others. Eventually I did receive some usability suggestions. I'm not sure they were carefully thought out. One point I would have suggested aligned with a marketing video on their web site but did not match their requirement. Until producers of products of products care about the appearance and usability of their products, these things are not likely to get better. As for my own feelings about UI, there are a few beliefs I hold deeply. If a UI can model some sort of physical reality, it is going to be easier to use. If not a physical reality, at the least a consistent model. I hate UIs that change depending on state. Disappearing menu items or screen elements drive me nuts. Think of shifting sands. Discoverability is something that concerns me. Much of the S/W I work with has options or key shortcuts that I never know about because I'm too lazy to read through the manual. I do not know the solution to this, but I do know the problem.
TimJYoung 11y ago
My biggest complaint is regarding web sites/applications that basically ignore the existence of keyboards. Some of this comes from the UI toolkit that they're using, but it's pretty egregious. For just "brochure" web sites, it's not that big of a deal, but some are really, really bad about tabbing order, or tabbing at all, and certain controls don't work correctly without the mouse/touch.

119 points by panic 11y ago

Mobile offered a bit hope. First, the screens were to small to clutter with complicated GUIs. Second, you could substitute some visual controls with touch.

hyperpape 11y ago
The piece by Maciej (http://idlewords.com/talks/website_obesity.htm http://idlewords.com/talks/website_obesity.htm) on page weight points out that a lot of sites have responded by developing desktop sites as if people are using them with touchscreens. I'm not sure that's a good idea.
TheOtherHobbes 11y ago
I recently tried to get my mobile provider to set up data roaming while I was away from home. (You can't set up data roaming from home, for reasons that remain mysterious and unexplained.) The fact I was using a mobile device didn't stop my provider's site from asking three times if I wanted to take part in a survey, or from displaying a floating "Would you like to chat?" dialog that was so big it literally covered a quarter of the mobile screen - and which moved to the same position whenever I try to scroll it out of the way. It also didn't help my provider provide the right links to the right content. Eventually I gave up. My gf already had data working, so we used her phone for everything. The experience was impressively terrible. Unfortunately if you don't have UI clue, mobile is just another way to get stuff wrong.
- lmm 11y ago
  Try using an iphone (or spoofing your user agent as one). Often they don't test or care about any other phones, but iphone users get the VIP treatment.

collinglass 11y ago

was hoping you were going to give a standard resource where I can find alternatives for common bad designs

hyperpape 11y ago
Ditto. Sadly, this got posted three times to HN already and hit my twitter feed without seeing anyone say "you're wrong, there's a book everyone should read!" At this point, my hopes are low.
- iolothebard 11y ago
  http://www.amazon.com/Designing-Web-Usability-Jakob-Nielsen/dp/156205810X http://www.amazon.com/Designing-Web-Usability-Jakob-Nielsen/...
musha68k 11y ago
Check out "About Face" by Alan Cooper et al. A well respected interaction designer was so kind to give me her 1st edition many years ago and I still find myself coming back to it regularly. New and updated 4th edition: https://en.wikipedia.org/wiki/Special:BookSources/9781118766576 https://en.wikipedia.org/wiki/Special:BookSources/9781118766...
- rpeden 11y ago
  I'll second this recommendation. I picked up the 4th edition a few months ago. It's a great book, but also a very long read. As a developer who is interested in developing usable apps, but not in being a full-time UX designer, I've found that I've been able to pick and choose the bits of the book that are relevant to the tasks I'm working on. It helps if you've read the introductory bits, but later on it has sections about web, desktop, mobile, etc. that are useful on their own. It's almost like having several books in one.
- vram22 11y ago
  I had bought and read the 1st edition of About Face years ago. Thought it good generally. Might not have understood everything in it at the time. I remember him talking about "affordances". One point I thought was good, was his idea for a scroll bar with both the arrow heads at the same end of the bar, instead of at opposite ends. This saves you from having to move your mouse from one end of the bar to the other, to reverse scroll direction (since you have to click on either the up/left or down/right heads). Like this (for a horizontal scroll bar): <||> ============================= instead of this: <|==============================|> Cool. Later I heard from someone that some OS/GUI platform actually has his improved version - I forget which.

mmatants 11y ago

If you decide to study how to build bridges, you will start out with calculus, build a background in science of materials and then a guided tour of approaches to structure-building. In addition, you have to learn typical environmental factors. And, of course, there are workflow patterns and human factors involved in actually constructing a typical bridge. Oh, and sure, there will be a bit of CAD. Let's apply this metaphor to programmers working on UIs: a huge chunk of practitioners right now get by via simply having learned a bit of CAD (i.e. HTML/CSS/JS). And also, yeah, they have walked over a bridge once/seen a panoramic postcard, so there's that. Very ad-hoc, very disorganized, full of gaps. Of course the impact of mistakes is magnitudes different between designing bridges and building UIs. Except for when that UI drives medical automation. Or finance (one of my faves is an anecdote about how a bad input form field cost a fund management company literally in the 8 digits of money). Our industry is of course very young, and so I think this education gap is simply a temporary issue. I am looking forward to (and am personally investing into) a day when there will be a more systematic and comprehensive education on how what a good UI looks, behaves and feels like, not just how to code buttons and boxes on a screen.

analog31 11y ago
I work in product development for things that have mechanical and electronic bits, etc. There are disciplined processes for designing things, typically applied to life support systems such as bridges and jet planes. Or, hi-reliability components like hard drives. But outside of life support products, I would guess that the majority of product development is only as disciplined as it needs to be, for what's being made. A lot of stuff is designed by seat-of-pants, by people sitting at CAD stations who mostly have engineering degrees but don't engage in engineering and have forgotten all of their math and theory. The level of organization and discipline needed to do things like design airplanes is done by the segment of engineers who enjoy that discipline and gravitate towards those industries. People who prefer to do seat-of-pants design find their own niche as well. At my workplace, I can't count the number of times I've heard: "But we don't design airplanes here." Our stuff works when it gets to the customer, but if you scrutinize our designs the way we've all been trained to scrutinize UI's, you'd be horrified.

1971genocide 11y ago

"Set of Standard Resources" Check out Material Design by google - its been a lifesaver to me who is from a very technical background. Best part is with very little work you can really impress your bosses ! Good Luck

gameboy24 11y ago
Material design is great but I see apps that don't need it implement it a lot. Not every app needs a FAB, or a card ui.
Jach 11y ago
Material Design is just like Apple's guidelines. It's great for helping to create something that looks uniformly designed and not a hodge podge of UI gimmicks, helping design-ignorant coders create something that looks nice, and as you say it's easy to get management buy in, but is it actually good? Will following it actually reduce your count of UI mistakes? Personally I don't like it at all, and I've had many complaints, both functional and from personal preference, with Google's design changes over the last few years.
- 1971genocide 11y ago
  I agree. But I do not have the time to go back and do another degree on design. Try convincing people with money to shell out extra for someone with good design experience. I guess once we have millions of customers we might have to think about it - but small companies without much resources its hard to justify spending a lot of resources on good design.
  - dflock 11y ago
    Good design == lower churn, higher LTV.

RoboErectus 11y ago

I always thought "Don't make me think" was a bit of a UI reference that everyone should read.

macintux 11y ago
I got a lot of grief from fellow software developers at Progeny (RIP Ian) for having that book lying around.
- sdoering 11y ago
  May I ask why? Is there anything wrong with that book from a developer's point of view?
  - fit2rule 11y ago
    It makes them think.
    - ufuk 11y ago
      Well, somebody's got to do the thinking...

Nutmog 11y ago

I think everyone knows that non-modal dialogs, live previews and obvious icons are better, but they're also harder to do.

euske 11y ago

I tend to think that making a good UI is like writing a good technical document or good presentation slides. We should think UI as a kind of natural language. There could be some subjective guidelines, but I don't think there will ever be a definitive standard.

teyc 11y ago

Does anyone have enough experience with Tk and REBOL why these should be exemplar as far as UI and layout is concerned?

DonHopkins 11y ago
I implemented a gui for SimCity in Tk, and at the time (~1993) it was the best user interface toolkit for X11 available, but only because the competition was Motif and its ilk. The reason it was relatively good in that context is that it had a built-in scripting language: TCL. (So did WINTERP, but that was XLisp + Motif, so Motif made it suck a hell of a lot more than XLisp made it win.) As a scripting language, TCL is terribly designed (but beautifully implemented). But all that mattered at the time was that there was a scripting language that was present at the time the GUI tooklit, Tk, was designed (so they did not overlap and squabble about what they were trying to do) -- not that the scripting language itself was any good. (Personally, I'd MUCH rather be programming GUIs in PostScript than TCL, which is what I did before, for the previous port of SimCity to NeWS.) The fact that TCL was an integral part of the design of Tk from day 1 made it possible to use the scripting language for what it was good for, instead of Tk trying to do that in a half-assed non-turing-complete way: to glue everything together and do all the dynamic symbolic stuff, binding events to handlers, creating objects, naming them, plugging them together. All with wonderfully flexible simplicity and generality. Instead of trying to wrap the X Toolkit Intrinsic's and Motif's lame overlapping and incoherent attempts at object oriented programming, configuration, skinning and event handling in C and .XDefaults files. Here's a typical TCL file that creates an instance of a SimCity editor window (it's more complex than a typical less dynamic TCL gui, since it's capable of creating any number of independent editor window instances, which is why it uses a $win prefix for everything it creates): https://github.com/SimHacker/micropolis/blob/master/micropolis-activity/res/weditor.tcl https://github.com/SimHacker/micropolis/blob/master/micropol... No matter how much you love Lisp, WINTERP was still just using it to wrap Motif, even though Motif was suffering from a terminal case of Greenspun's tenth rule, and contained its own ad hoc, informally-specified, bug-ridden, slow implementation of half of Common Lisp. Here's WINTERP: http://nielsmayer.com/winterp/ http://nielsmayer.com/winterp/
- 11y ago

dman 11y ago

Request to all designers - please stop building nested scroll and drag interactions. Common pet peeve for me recently is embedded map widgets in web pages. A user scrolling the page will find at some point that their mouse has come over a map which is now eating the scroll events and they are now scrolling the map instead. Only choice at that point is to move the mouse over and start scrolling over. Bonus annoyance - In many cases it is non trivial to reset the map to its default setting before the unwanted scroll interacted with it. Hovering over an item is a very weak commitment from the user that they want to interact with the element. Please do not use the hover to infer that the user means to interact with the element, at the very least put in some kind of timer and enable the interaction only on sustained hovers.

rsync 11y ago
"A user scrolling the page will find at some point that their mouse has come over a map which is now eating the scroll events and they are now scrolling the map instead." This annoyance has been widely extant for ten years or more - I think I first experienced it with google maps as I believe they were the first to zoom with scroll ... Seems easy to fix - sub window elements in the browser cannot zoom until clicked on ? It's amazing that behavior made it through one browser version iteration.
- nothrabannosir 11y ago
  As long as you also track "going out of focus" , to disable the scroll capturing again.
agumonkey 11y ago
Courseware MOOC platform nests things it's so amazingly bad. I forgot how bad it was.

yakult 11y ago

>>It's also not clear that the model of background apps requesting the user's attention works. How many iPhones have you seen with a red circle containing "23" on the home screen, indicating that 23 apps need updating...and it's been there for months? I would argue this is working as intended. The advantage of background notification rather than modal is that the user gets a choice. The user could very well decide that your EXTRA SUPER URGENT notification is, in fact, unimportant, and this right here is a perfect example. No, I don't care if your bullshit app that I've opened a grand total of twice needs a 200 MB update. If anything, there should be an option to force old notification circles to go away after two weeks or so except for legitimately important apps like email and messaging.

prawn 11y ago
Agree. I avoid updating apps that are working satisfactorily because many later add ads or other annoying functions.
- rpgmaker 11y ago
  Or remove functions, or change the UI needlessly and for the worse. I honestly don't know how people can update their apps without having a backup to go back to. I probably would not do it if I didn't have one of my backups around. The different app stores should offer the user a way of going back to a previous version (if you already had it installed) but it seems that none of them do so...
  - schrodinger 11y ago
    As an app developer, I understand the frustration but you've got to see the other side too. There's a huge cost to maintaining legacy server side API end points. I think the sibling commenter makes a great point about the difference between standalone apps and apps that are a client to a web service. It's also very frustrating when I see a crash keep happening in my error logs that I know is fixed in a later update :(
  - newscracker 11y ago

srinivedantam 11y ago

I'd say bootstrap and the likes are killing the need for a fresh look at design by offering templates. For me the savior has been Basecamp's design. Always made sense and looked great.

jtolmar 11y ago

Looking back through time for all the horrible UI sins cataloged in the opening paragraph, I'm pretty sure all of those were much more common in the past than they are now. Somehow, we actually have made those pieces of progress. Except for cryptic icons, those seem on the rise again.

DonHopkins 11y ago

The review of the QuickTime 4.0 player [1] at the User Interface Hall of Shame [2] should be required reading for user interface designers. Apple can't even follow their own guidelines, and keeps making the same mistakes (and worse), even today. [1] http://hallofshame.gp.co.at/qtime.htm http://hallofshame.gp.co.at/qtime.htm [2] http://hallofshame.gp.co.at/index.php?mode=original http://hallofshame.gp.co.at/index.php?mode=original

J_Darnley 11y ago
Thanks. A real trip into history. (I was about to say "memory lane" but I think most of these predate the point where I stared using computers a lot.)

rsync 11y ago

Can we talk about search dialogs that are not actually dialog boxes ? I first saw it at netflix - instead of a search box in the upper right, there is a picture of the word search and if you click on that picture of the word search it becomes a textbox[1] that you can type into. As if that's not bad enough, the word "search" can turn into a textbox faster than it takes to fully load the control, which means you get the textbox but cannot type into it for another few moments. How much of an unimaginable asshole do you have to be to pervert a basic web UI component like this ? [1] No, of course not a real textbox - some 50 kilobyte control from some web-authoring toolkit that masquerades as a textbox.

frik 11y ago
That's what Netflix got from using Reactjs. Facebook people search on mobile page version uses React too. It worked very well as a traditional AJAX search. Then they changed to to use React and now it takes a second or two to initialize and load the page (even it is in cache). And the search textbox doesn't feel like a native textbox, it's very laggy and shows inputs way too many milliseconds later. And on top of this the search result adds another delay. So searching for "Joe doe" means a laggy delay for every character as you try to type it in. Why? It tries to guess the person after every keyboard change event. Something that worked fine with the original AJAX version (Facebook optimized that version a lot an blogged about it / wrote a paper). Sadly with the React rewrite the forgot to read their own blog and probably React is an overkill for such a type of page and consumes to much CPU cycles on mobile devices. If you have to refresh 90% of the search results page anyway, why use React? Building and diffing a VirtualDOM isn't cheap (and ShadowDOM isn't supported), and it would be a lot faster to simply overwrite the DIV with innerHTML and traditional vanilla Javascript AJAX. Use the right tool, don't use a hammer for everything.
- coldtea 11y ago
  >That's what Netflix got from using Reactjs. ...for using Reactjs badly. IFTFW. First, they could have had the item as a search box from the start, no need to make a label that when clicked turns into a search box. >* If you have to refresh 90% of the search results page anyway, why use React? Building and diffing a VirtualDOM isn't cheap* Actually it can be as cheap as directly changing the DOM with JS. And diffing can be just a single op e.g. when using an immutable data structure for their always changing part of the data. It's just a change done crudely, not even non-optimized, because it doesn't need that much optimization anyway.

SonicSoul 11y ago

This really grinds my gears: I was just on pluralsight but seems like 90% of websites have this problem where existing members are treated as 2nd class citizens. I executed a search for "UX" and found a class I waned to see. After clicking int it I was given 2 options "sign up" and "cancel". So as an existing paid customer my only options are "login" on upper right which then puts me on main member screen so I can perform that search again. or go through login process, and then hit the back button exact # of times to put me back a that search results page. Then if they didn't fuck that up i'd be able to go to that course and see it. And believe me, some websites manage to fuck that up too. Other versions of this UX antipattern is where you try to get to the content and 99% of the screen is about signing up while 1% is the tiny "sign in" hyperlink. It causes much anxiety to actually locate it.

SonicSoul 11y ago
close cousin to this problem is lack of clear login area. Take Evernote for example, home screen has all of it's homepage taken with big photo, plan explanations, sign up form. But for existing users ? there's a tiny hamburger icon up top which you have to click to reveal the "sign in" link which will then finally give you the login form. This is so frustrating my only possible understanding is "f existing users since we already have their money"

lazyjones 11y ago

The most annoying "focus stealing" for me is what (some?) browsers do when actions initiated earlier on (like clicking on a bookmark that doesn't appear to load) finish while I'm typing in the address bar: they just overwrite what I typed with the new URL, or cause focus loss on the address bar so I suddenly type "nowhere". So frustrating...

douche 11y ago
IM clients that steal focus when a new conversation begins are fantastic about this. More than a few times a coworker has gotten half a line of random code as a response when they try to ask me a question over Sametime.

SixSigma 11y ago

The fact that those are the faults you think are the worst shows how entrenched bad UX is. E.g. drop down menus are a fail. If you read Raskin's "The Humane Interface" you can see a whole host more. Raskin, Jef 2000.The Humane Interface, Addison-Wesley ISBN 0-201-37937-6

coldtea 11y ago
>If you read Raskin's "The Humane Interface" you can see a whole host more Well, Raskin also has some bizarro ideas about what a good UI should be, and his later attempts of realizing one is not anything most people would want to use.
- SixSigma 11y ago
  I use Acme text editor which uses some of Raskin's ideas It is the best I have ever used https://en.wikipedia.org/wiki/Acme_%28text_editor%29 https://en.wikipedia.org/wiki/Acme_%28text_editor%29
  - coldtea 11y ago
    You, Rob Pike and 10 other people.
    - SixSigma 11y ago
      mind yourself on that edge or not everyone can drive a Ferrari

hendekagon 11y ago

Focus-stealing annoys me the most. Applications should never steal focus & should always open in the background.

HankB99 11y ago

IANAUIE (guess what that stands for. ;) ) Yet I am primarily responsible for the UI on the product on which I'm writing code. I started out with a bland and crappy interface expecting the client to look at that and provide their branding and suggestions for how it should work. Most UI elements are their default colors. Style? Please, I'm an engineer! I thought at some point they would provide a detailed list of requirements to provide a decent UI. I thought wrong. I have done what I could to provide an easy to use intuitive interface. Unfortunately what is intuitive for me is not going to be intuitive to others. Eventually I did receive some usability suggestions. I'm not sure they were carefully thought out. One point I would have suggested aligned with a marketing video on their web site but did not match their requirement. Until producers of products of products care about the appearance and usability of their products, these things are not likely to get better. As for my own feelings about UI, there are a few beliefs I hold deeply. If a UI can model some sort of physical reality, it is going to be easier to use. If not a physical reality, at the least a consistent model. I hate UIs that change depending on state. Disappearing menu items or screen elements drive me nuts. Think of shifting sands. Discoverability is something that concerns me. Much of the S/W I work with has options or key shortcuts that I never know about because I'm too lazy to read through the manual. I do not know the solution to this, but I do know the problem.

TimJYoung 11y ago

My biggest complaint is regarding web sites/applications that basically ignore the existence of keyboards. Some of this comes from the UI toolkit that they're using, but it's pretty egregious. For just "brochure" web sites, it's not that big of a deal, but some are really, really bad about tabbing order, or tabbing at all, and certain controls don't work correctly without the mouse/touch.