5 ms·

So much of modern design is ruined by the existence of touchscreens. People seem to have forgotten that the design of a UI must be guided by the kinds of input

So much of modern design is ruined by the existence of touchscreens. People seem to have forgotten that the design of a UI must be guided by the kinds of input devices it will predominantly be used with. Almost no one is designing for mice and keyboards. These days it's mostly touch UIs with some hotkeys and hover cards thrown in.

k__ 5y ago
But touch screens are the predominantly used input device.
- badsectoracula 5y ago
  On mobiles. On laptops, they are the minority but somewhat common i think. I'd guess trackpads are still way more common. On desktops it is mouse and keyboard. And CSS still seems to be unable to differentiate between these three - or even just between mobile/tablet and laptop/desktop (though there are cases where a 27" desktop monitor is not the same as a 14" laptop monitor), which is one of the reasons things are so awful. So people use hacks like minimum width or whatever as shown here: https://www.w3schools.com/css/css_rwd_mediaqueries.asp https://www.w3schools.com/css/css_rwd_mediaqueries.asp Now it might be w3schools being bad and there is a better way but every single site i see out there that uses responsive design (what a name) does that. Assuming they bother with desktop at all. Not to mention that they assume that all people use browsers in a maximized state. I have a huge monitor so i always keep browsers at around 1000px or less, which often triggers the "oh you are on a mobile, lemme bloat up everything for you" style.
  - grishka 5y ago
    In my personal project, I simply have two sets of templates and which one I use depends on the user agent. It isn't possible to adapt the same exact markup to two input paradigms this different without compromise.
- anthk 5y ago
  And it sucks. Often the controls are non-discoverable. Compared it to Mac OS 6/7. Everything on the menus was everything you could do. Easy, usable. That was a good GUI. https://jcs.org/wallops https://jcs.org/wallops https://jcs.org/system6c https://jcs.org/system6c
  - grishka 5y ago
    Another good part about UIs of the 00s and earlier is that you know what every element does just by looking at it. Revolutionary, I know.
    - anthk 5y ago
      Once Mac OS (and OSX) followed the ulititarian design from Brawn. Now you have "material" (Bauhaus) design... done TOTALLY wrong. The form doesn't follow usability at all. Just a posh design trying to mimic a static format as if the computer screen was a flat magazine cover or an information panel on a building. Zero usability. We need the System 7, Be/Haiku, Windows 9x... design back. Now.
      - grishka 5y ago
        Problem is that in many companies designers are given absolute reign over how the product looks. And another problem I see all the time is that designers often treat the result of their work as an art piece, not as a tool that has the purpose of human-machine communication. So, yes, it looks nice if all you do with it is look at it. Flat design has only one good thing about it: it can be easily done with vector graphics. Which is important for modern high-dpi displays. But I'll gladly go back to using a bunch of bitmaps for every button if that meant the UI would become more intuitive. > We need the System 7, Be/Haiku, Windows 9x... design back. Now. Skeuomorphism (OS X 10.9, Windows 7) was nice too tbh.
- grishka 5y ago
  Among what? Are you telling me that you would design a desktop website with touchscreens in mind despite 99.99% visitors using it with a keyboard and mouse?
  - notreallyserio 5y ago
    Most traffic is mobile these days (presumably mostly using touchscreens). There's various sources for this, like: https://www.statista.com/statistics/277125/share-of-website-traffic-coming-from-mobile-devices/ https://www.statista.com/statistics/277125/share-of-website-... . Specific sites will vary, of course. I'd be curious to hear the ratio on HN.
    - Markoff 5y ago
      And now show stats for most of the input. It's different thing just to consume and different thing to type.
bee_rider 5y ago
Eh, mouse-driven UI was already bad. At least by now the computing universe is bifurcated between consumption-focused touchscreen UI and proper keyboard UI. I haven't hunted through an endless field of tiny icons in ages.
- xg15 5y ago
  What do you consider a "proper keyboard ui"? A shell with the full discoverability of a blinking cursor?
  - anthk 5y ago
    TUI applied to GUIs.
  - bee_rider 5y ago
    That works for most programs, sure.
    - grishka 5y ago
      Just an hour ago I got reminded how user-unfriendly some terminal utilities are. # ln ln: missing file operand Try 'ln --help' for more information. Yeah what a helpful error message. Yes I know it takes two file paths to link one to the other. But for the life of me I can't remember which order it wants them in. I wish there was some sort of "parameter hint" for the terminal, like in an IDE. You type `ln` or `find` or `grep` and it pops up above the cursor and tells you what parameters the command expects.
      - bee_rider 5y ago
        Usually I'd rather not muddle my way through ln, since it can make a mess of things. grep... I dunno, I guess I use it enough to be used to it. find is kind of a pain, I can never remember if the path goes first or second. Honestly I just do something like locate <thing> | grep <path where I expect it to be>
      - 5y ago

k__ 5y ago

But touch screens are the predominantly used input device.

badsectoracula 5y ago
On mobiles. On laptops, they are the minority but somewhat common i think. I'd guess trackpads are still way more common. On desktops it is mouse and keyboard. And CSS still seems to be unable to differentiate between these three - or even just between mobile/tablet and laptop/desktop (though there are cases where a 27" desktop monitor is not the same as a 14" laptop monitor), which is one of the reasons things are so awful. So people use hacks like minimum width or whatever as shown here: https://www.w3schools.com/css/css_rwd_mediaqueries.asp https://www.w3schools.com/css/css_rwd_mediaqueries.asp Now it might be w3schools being bad and there is a better way but every single site i see out there that uses responsive design (what a name) does that. Assuming they bother with desktop at all. Not to mention that they assume that all people use browsers in a maximized state. I have a huge monitor so i always keep browsers at around 1000px or less, which often triggers the "oh you are on a mobile, lemme bloat up everything for you" style.
- grishka 5y ago
  In my personal project, I simply have two sets of templates and which one I use depends on the user agent. It isn't possible to adapt the same exact markup to two input paradigms this different without compromise.
anthk 5y ago
And it sucks. Often the controls are non-discoverable. Compared it to Mac OS 6/7. Everything on the menus was everything you could do. Easy, usable. That was a good GUI. https://jcs.org/wallops https://jcs.org/wallops https://jcs.org/system6c https://jcs.org/system6c
- grishka 5y ago
  Another good part about UIs of the 00s and earlier is that you know what every element does just by looking at it. Revolutionary, I know.
  - anthk 5y ago
    Once Mac OS (and OSX) followed the ulititarian design from Brawn. Now you have "material" (Bauhaus) design... done TOTALLY wrong. The form doesn't follow usability at all. Just a posh design trying to mimic a static format as if the computer screen was a flat magazine cover or an information panel on a building. Zero usability. We need the System 7, Be/Haiku, Windows 9x... design back. Now.
    - grishka 5y ago
      Problem is that in many companies designers are given absolute reign over how the product looks. And another problem I see all the time is that designers often treat the result of their work as an art piece, not as a tool that has the purpose of human-machine communication. So, yes, it looks nice if all you do with it is look at it. Flat design has only one good thing about it: it can be easily done with vector graphics. Which is important for modern high-dpi displays. But I'll gladly go back to using a bunch of bitmaps for every button if that meant the UI would become more intuitive. > We need the System 7, Be/Haiku, Windows 9x... design back. Now. Skeuomorphism (OS X 10.9, Windows 7) was nice too tbh.
grishka 5y ago
Among what? Are you telling me that you would design a desktop website with touchscreens in mind despite 99.99% visitors using it with a keyboard and mouse?
- notreallyserio 5y ago
  Most traffic is mobile these days (presumably mostly using touchscreens). There's various sources for this, like: https://www.statista.com/statistics/277125/share-of-website-traffic-coming-from-mobile-devices/ https://www.statista.com/statistics/277125/share-of-website-... . Specific sites will vary, of course. I'd be curious to hear the ratio on HN.
  - Markoff 5y ago
    And now show stats for most of the input. It's different thing just to consume and different thing to type.

bee_rider 5y ago

Eh, mouse-driven UI was already bad. At least by now the computing universe is bifurcated between consumption-focused touchscreen UI and proper keyboard UI. I haven't hunted through an endless field of tiny icons in ages.

xg15 5y ago
What do you consider a "proper keyboard ui"? A shell with the full discoverability of a blinking cursor?
- anthk 5y ago
  TUI applied to GUIs.
- bee_rider 5y ago
  That works for most programs, sure.
  - grishka 5y ago
    Just an hour ago I got reminded how user-unfriendly some terminal utilities are. # ln ln: missing file operand Try 'ln --help' for more information. Yeah what a helpful error message. Yes I know it takes two file paths to link one to the other. But for the life of me I can't remember which order it wants them in. I wish there was some sort of "parameter hint" for the terminal, like in an IDE. You type `ln` or `find` or `grep` and it pops up above the cursor and tells you what parameters the command expects.
    - bee_rider 5y ago
      Usually I'd rather not muddle my way through ln, since it can make a mess of things. grep... I dunno, I guess I use it enough to be used to it. find is kind of a pain, I can never remember if the path goes first or second. Honestly I just do something like locate <thing> | grep <path where I expect it to be>
    - 5y ago