Slashdot Mirror
Ask Slashdot: A Point of Contention - Modern User Interfaces
Reader Artem Tashkinov writes: Here are the staples of the modern user interface (in varying degree apply to modern web/and most operating systems such as Windows 10, iOS and even Android):
- Too much white space, huge margins, too little information
- Text is indistinguishable from controls
- Text in full-CAPS
- Certain controls cannot be easily understood (like on/off states for check boxes or elements like tabs)
- Everything presented in shades of gray or using a severely and artificially limited palette
- Often awful fonts suitable only for HiDPI devices (Windows 10 modern apps are a prime example)
- Cannot be controlled by keyboard
- Very little customizability if any
How would Slashdotters explain the proliferation and existance of such unusable user interfaces and design choices? And also, do you agree?
How would Slashdotters explain the proliferation and existance of such unusable user interfaces and design choices?
Phones and tablets.
New generations always rebel against the ways of the previous generation. It's human nature.
During the Renaissance we had visually brilliant works of art created. Later generations shunned this and decided that a canvas painted a solid color had just as much merit. Which is "right"? Neither. They just are.
And so it goes for UI design. From my perspective, we had a very consistent standard for UIs for a good 20 or so years. This was in part driven by technological limitations, but it worked well. The barriers are gone now, anything can be done. Therefore anything will be done. I've actually worked with people who are "UX Specialists" and completely disagreed with what they thought was intuitive. I also regularly have to look up how to do things on modern gadgets because they don't include manuals anymore and they most certainly are NOT intuitive. To me. I'm probably just old. And so is the submitter. :-)
Its arrogant designers who think they know better than the generation before, want to be seen to be different and "edgy" and "new" and so chuck out all the lessons learned and fuck things up royally. So we end up with an OS in 2017 that looks more primitive than Win3.0.
Hate:
White text on a bight yellow background, on Galaxy Note 3 Android.
Where the fuck have the icons gone? Windows.
Why can't I cut an paste information from your dialog.
Why are things still not resolution independent. Adobe, and most music production applications.
Don't think you need files and folders? Think again, and the includes you Firefox mobile bookmarks.
The creator of "material design" need to be shot. There's a difference between not being limited by the physical world, and needlessly disconnect us from what we have already learned.
In the battle between KDE, Gnome, and Unity, Cinnamon won.
Love:
Rounded corners rule!
Shadows show us what's on top!
Maxims:
Just because Apple did it, doesn't make it right. Remember, they had a bad year last year.
People need to work, more than you need to masturbate over your own art work.
Most serious file management takes place in two windows.
Clean means that you are too lazy to update the functionality in your program, so you are leaving useful stuff off.
Those who think that the command line and a GUI cannot coexist have never seen a 3D CAD or design program.
https://www.youtube.com/c/BrendaEM
Scott Meyers calls this the The Keyhole Problem and has a paper with a bunch of good examples.
My "favorite" modern example of the problem is Chrome's omnibox auto-completion, you get six results at maximum, they don't even give you a scroll bar or a "Show more" link, six results only. There used to be a command line option to increase it, but they removed it some years ago, it's now a hardcoded constant in the source code.
You're right about people's motor and vision skills are not what they used to be, but I find that primarily to be because it's not the same people.
Things have been dumbed down for about a decade now, and young users expect things to be simplified, not having experience with anything else.
40-70 year olds have computer experience, and handle cascading menus, middle mouse buttons and overlapping windows just fine - it's the young generation that requires a single application on the screen with simplified controls. And not too many words they have to read.
tl;dr: It's dumbing down for a dumber generation.
The problem is that there's a glut of "UX" designers convinced that if someone else has successful, and you copy the superficial hallmarks of their design, you'll be successful too. Take Facebook's "infinitely scrolling" page design for example - suddenly you have every damn app and website using an infinitely scrolling layout, even things like weather apps where the information is finite and is best presented using another paradigm such as tabs. Combine this with the prevailing attitude that if less is more, then even less must be even more, and you get the current mess we're in now.
This is not only the case with the current "flat" design epidemic ("Apple went flat and look at how successful they are! If we go flat we'll look modern and we'll be successful too!") but in many other elements that have been taken to an extreme at the cost of usability and accessibility:
- The use of razor thin fonts
- White text on monochrome, pastel backgrounds
- The loss of critical UI elements like scroll bars and button outlines, because apparently they just clutter things up
- The use of "hamburger" mystery meat menus
- Loss of status bars (which attempted to at least give some idea of percentage completion of a task) in favor of things like dots that twirl, spin, and dance in circles
You mean on paper? Huh... why would someone do that?
Looks like you have a promising future in web design!
... and every idiot in the world thinks he's an artist.
People associate lots of white space with "modern" and "clean", but in fact the key is to use white space intelligently to help guide the user's attention. The question isn't whether you have a lot or a little, the question is how much mental work does it take for a user to accomplish his task?
It's easy to ape interfaces that work well, but that's cargo-cult design. Design should be as much evidence-driven as it is fashion-driven. First (design) principles are only a starting point.
Recently I was using a smart TV app and when the content I requested took too long to buffer I decided to quit the app. I was presented with a dialog warning me that I was leaving the app, and asking me whether I wanted to "cancel" or "continue". This gave me a moment's pause, because I didn't want to "continue" waiting for the content to load. However as a developer myself I understood the programmer's mindset: "cancel" and "continue" referred to the event the dialog was responding to: a request to exit the app.
This division of responsibilities is backwards: the user shouldn't have to get into the mind of the designer, the designer needs to get into the mind of the user. And that's hard. UI guidelines help, but there's no substitute for watching actual users struggle with your design. Any time you find something that makes them pause, even for a moment, you should file that bump down. That'd catch problems like confusion between text and controls, or inscrutable state widgets.
Post may contain irony: discontinue use if experiencing mood swings, nausea or elevated blood pressure.
Developers traditionally make efficient, functional, ugly interfaces. They did this by using standardized UI controls. They were largely constrained. Today, without those constraints, those same developers make inefficient, semi-functional, pretty interfaces. And with the focus on form over function, they are pushed in this direction by management. (Thanks Apple, for telling me that I want to get rid of all the jacks in my laptop so that it can be be 0.00001 inches thinner.)
A good UX person -- not the kind of BS "UX" that I see lambasted here -- but a real one -- can improve the look and feel of an application, optimize the workflow, and make it pretty too. I work with a UX engineer who uses statistics on the average hand size of our target demographic, and can quote the average size and resolution of the displays they are using. On touch-screen apps, our UX team optimizes for right handedness, and organized the screen so your hand doesn't cover the things you are looking at and so you make minimal movements. A few years ago we even created a mock-up, and had actual users go through a workflow and timed them, counted number of clicks, etc. This is good UX. It's human factors engineering + graphic design.
A sad anecdote: A few years ago I had the pain of designing a UI with a bunch of managers. It was a screen to add/edit/delete users who had access to an account. I drew-up a typical text box with a list, and then an add/edit/delete button at the bottom. You could fit 50 users on a typical screen, quite readably. They HATED it. Their design fit about 10 users on the screen. Big margins all around. Each row had a separate add, edit, and delete button, a large single-color icon of a person. All the icons were the same, so they communicated nothing. The text was so large that long names needed an ellipsis to fit. The add/edit/delete buttons were tiny icons without text. It was pretty, wasteful, and slow. They loved it.
On another project, which was an industrial machine, they wanted icon buttons. Their previous version used 16-color EGA graphics so it needed an update. So I used actual 3D renderings of the parts as icons. Initially everyone loved it because it was clear what the icons did. 3 years later, it laughed-at because it is too "realistic." So on the next project they replaced the realistic icons with single-color conceptual representational icons. Unless you were on the project, you had no idea what the icon meant. The customers came-up with names for the icons: the "one-eyed cat" let you search. The "disney castle" was to load a tray into the device. The "laser broom" was the barcode scanner. This interface is loved by development because it is so pretty, and is the new standard moving forward. The customers (and training department) complain that unless someone uses the device regularly, they forget if they should start the workflow by clicking the "one-eyed cat" or the "laser broom."
At with the next project, they are using text under the icons again, so users know what they are.
"Responsive" doesn't mean take a design and make it work on all devices, it means
Unfortunately that IS what the term currently means among that group. Generally they (wrongly) believe they control all aspects of the web page display, that all devices are equally powerful and can run an unbounded amount of scripting, they often see no difference between a picture of text versus actual text, and don't bother to learn anything about the media they are designing for.
Aside: More than once I've had to convince a web designer that their pictures of text were the biggest reasons things weren't showing up to search engines, they kept claiming the hidden meta tags, text recognition, and image search would handle all that. Frighteningly some were never convinced, even after showing them with Google's own tools how Google interpreted their pages. Some were absolutely convinced that Google reads all text on all images and indexes pages based on image content. They could not fathom how there was a difference between text and fancy-rendered images of text.
Many wrongly assume the web browser displays the same thing on all screens, no matter what. Often they design for a few patterns they think are common, 1024x768 or 1080p, and try to force it on everyone else.
Got a Super HD display showing 7680x4320? Too bad, we'll just upscale the fonts and add some whitespace.
Got an old smartphone with a 480x640 portrait screen? We'll downscale and do an ENORMOUS amount of JavaScript processing on these devices least suited for the processing.
It seems these are the same designers with the first-world problems of their disposable $800 smart phone is more than 18 months old, and their $2000 macbook is more than three years old and ready for replacement.
//TODO: Think of witty sig statement
Some of this is web design (I use the word "design" very loosely) and some is application design:
o the "designer" mindset has gifted us with extreme low contrast backdrops and fonts - STOP THAT
o bloody pop-up/over dialogs that were not asked for are constantly used - THIS IS HOW TO MAKE ME GO AWAY
o menus drop without being requested because mouse went over them - WAIT FOR A BLOODY CLICK!
o Videos autoplay just because I've arrived, or because the mouse pointer went over them. Ever think *I* might want to control what damned noise comes out of my computer, or what data I want to stream on my phone? You should. Because while I'm desperately trying to figure out how to shut up / stop your video abortion, I am hating on you and everything you represent, and vowing to NEVER come back to your site, which I promptly implement via my hosts file because you SUCK.
o Do NOT change the web or application UI: NEVER make a modal UI. Present a consistent interface that can be learned and incorporated into muscle memory. Enable/disable elements as appropriate. IOW, if a document isn't NEW or Loaded, Save should be disabled - not GONE. This is so everything in the interface remains where it was. We want to work, not read your damn interface over and over and over and over just to see where we're at.
o Make ALL keyboard commands configurable. In some apps, some of the things I do most often have no shortcuts and no way to add one. How annoying. How stupid.
I swear, there are days when I'd like to hunt down these so-called "designers" and yell at them until my voice gave out.
All of the above is effete nonsense that designers engage in an attempt (which is actually abject failure) to justify their title; stop all that, and just do it right. Don't even try to be "fancy" unless you're writing a game.
Also, if you say "UX", I just want you to know you've made me work to suppress an urge to slap your face. Hard.
I've fallen off your lawn, and I can't get up.
For me, the #1 modern UI sin, which wasn't included in the list here -- Non-discoverable interfaces. Interfaces based on some "gesture" which is never explained, and for which one cannot find an explanation (unless you already know the gesture to get there, if it exists). Pinch-zoom, hover in a magic corner, drag from edge, press screen for short vs. long time, invisible menu bars, etc., etc. In the 1984-2010 era I could follow the words in the menus and discover new features in any piece of software (and so could anyone, assuming they weren't illiterate). The last few years have brought my first experiences with software that I just couldn't begin to figure out how to do anything with.
We know where leadership by an anti-intellectual "strongman" who scapegoats minorities and likes boisterous rallies goes
"Mobile first" is partly to blame, but lazy/cheap teams are more so.
Take a look at what's popular in trendy web app design today: flat everything, big rectangular colour blocks, lines and rounded corners, text. Look at the boxy, side-by-side layouts, almost invariably collapsing into increasingly linear formats for narrower screens until it's just a single column.
Now look at what you can do easily and portably with CSS. In particular, look at what you can achieve by just slapping Bootstrap or the like on your site, without spending much time or money considering the design and layout, and certainly without hiring any sort of designer or, $DEITY forbid, a digital artist to create custom graphics that fit the style of your product/service and build any sort of distinctive branding.
There was, at the time, some justification for this in that downloading lots of large images on the mobile networks of a few years ago really could significantly slow down loading a page, with resulting poor user experience and app/site performance. But for most of us, our target markets are on faster networks today, and CDNs are much more developed now as well. And certainly you don't get any allowance for this if your site includes megabytes of JS frameworks, ad content, or auto-playing hero video.
Likewise, there is some justification for minimal UI chrome on small screen devices where every pixel is precious, but you don't get any allowance for this if you replace a simple hairline with half an inch of whitespace because your visual style is so generic and unguided that the user can't actually tell how the UI works otherwise.
Frankly, Microsoft, Google and Apple are amateurs when it comes to nerfing design by being flat and bland. Web developers have been moving in this direction for at least as long as smartphones and tablets have been around, and people with actual UI design skills have been criticising them and pointing out the obvious and horrible usability flaws for just as long.
If you disagree, post your argument. (-1, Overrated) isn't your personal censorship tool for views you don't like.
The automobile has gone through quite a few control redesigns which are continuing. If you jumped into a Model T (maybe only early ones), you'd find it hard to figure out. Besides the controls that have been automated away, choke and ignition advance, the parking brake was operated by your left hand, along with ignition advance, throttle by right hand and gears by the pedals along with the brake being the right pedal.
The steering wheel started out as a tiller and as late as 1899 was introduced in America as a wheel. Since various controls have migrated to the wheel or right beside. The turn signal operated by your left hand, which has acquired more and more functionality such as operating the lights, wipers, high beam. On the right, there was the gear shifter for quite a while before mostly migrating to the floor. And all the various controls that can be found on a modern steering wheel. Even my old truck has the cruise control buttons on the wheel. The shifter pattern has also changed at times. Had an early 5 speed where reverse was where 1st usually is.
Speaking of my 25 year old truck, while most of the pedals are standard, on the left there's the parking brake release and the hi-lo headlight dimmer button on the floor. Turn signal only operates the turn signals with a knob on the dash that you pull to turn on the lights and turn to dim the dash lights and turn on the interior light. The wiper switch is besides it, turn one way for normal wiper operation, further for high speed, turn the other way for intermittent operation, push for squirting cleaner (still have to turn the wipers on manually).
Another set of controls that seemed somewhat standardized for a long time and now are in flux are the climate controls and radio/sound system where automakers keep screwing around with stupid touch controls. Stupid due to breaking the paradigm that the driver should be able to operate everything by feel while watching the road.
It took close to 50 years to standardize just the pedals on the car UI, while the modern computer UI is at the most 30 yrs old. Hopefully in another 100 yrs, things will have mostly settled down, but as the automobile has shown, new tech such as touch screens, still puts basic interface into flux, often with stupid design decisions such as trading easy to feel buttons for hard to use, changeable, touch screen.
https://en.wikipedia.org/wiki/Inverted_totalitarianism
Our screens are way bigger than they were back in the old days, so we have plenty of room for things like menus and toolbars. Yet the trend in modern UI design is to make things magical and non-discoverable.
Just yesterday I helped my father with a problem: the menus and toolbar from Thunderbird were gone. I was on the phone with him for a while. The task was to find the one magic part of the Thunderbird window where he could right-click and find the context menu with the checkboxes for hiding/displaying the main menu and toolbar. Thank goodness I have him running MATE so every window has a title bar... "find the blue bar at the top that says 'Inbox - Mozilla Thunderbird' Now right-click in the dark grey area underneat that, to the right of the tab that says 'Inbox'..." "It didn't work" I'll spare you the back-and-forth, he had multiple tabs and was clicking in a tab to the right of "Inbox". Once I got him over to the correct magic spot, he found the context menu and restored his menu and toolbar. (The stupid hamburger menu is part of the toolbar, and hides with the toolbar... which means it's possible to hide all the menus! And my dad somehow did so by accident!)
The original UI spec for the Macintosh required menus all the time for every app, and the menus had to be in the same place. And I learned very quickly that I could browse the menu, find the command I wanted, and the keyboard shortcut was documented right there in the menu. Hidden menus are far too magical, and if you are going to have them, the very least you should do is to make every context menu have the ability to unhide them, rather than requiring the mouse pointer to be hovering over a particular magical few pixels of your screen.
I also remember the 45 minutes it took to help my dad un-mute YouTube videos. First I had him use the MATE sound preferences dialog to test his speakers, which just took a couple of minutes. Then I had to walk him through moving the mouse pointer over the YouTube video window to make the controls un-hide... (he wasn't full-screen, why do the controls hide when there is plenty of screen real estate available?) Then he had to move the mouse pointer to touch the audio control (and a slider pops out when you get it right) and click to un-mute... and when it's un-muted it says "MUTE". Because when it's un-muted the button becomes the "MUTE" button, and when it's muted the same button becomes the "Un-mute" button. The old-school solution would be a checkbox labelled "MUTE" that's checked when it's muted; the newer way would be a GUI toggle that slides left for un-mute and slides right for mute. There's plenty of screen real estate for either of these.
I know, I know, on mobile devices these magical hiding tricks are not so pointless because screens are smaller. But desktops are not mobile devices and trying to treat them the same is a bad idea.
My dad is not stupid and I don't want to sound like I'm making fun of him. I'm just annoyed over the modern trend in UI design where everything is so magical that it's tricky and weird.
lf(1): it's like ls(1) but sorts filenames by extension, tersely