3 ms·

This is my understanding of how we ended up with today's flat UIs with less affordances even though many (most?) users dislike them. HN can tell me if I was to

by jasode 11y ago

This is my understanding of how we ended up with today's flat UIs with less affordances even though many (most?) users dislike them. HN can tell me if I was told incorrectly. 1) GUIs in 1980s like MS Windows 1.0/2.0 had flat design[1]. The buttons were flat. No drop shadows. The "flatness" was not a deliberate design intention but simply the first iteration of a graphical UI to supplant text mode DOS console. 2) In 1990s, MS Windows 3.0/3.1 introduced 3-dimensional sculpted buttons. An visible improvement in UI affordances. Windows 95 further extended the 3D look where whole window edges, etc had sculpted look. 3) This era includes the Apple Mac OS X GUI ("Aqua ) that had 3D look and buttons had depth. It includes the Steve Jobs quote, “one of the design goals was when you saw it you wanted to lick it." 4) The zenith of affordances is reached with Windows Vista/7 "Aeroglass" where windows could cast translucent drop shadows on the desktop. Effects like that required heavier computation such as "alpha channels". Hardware-assisted (premium graphics card) was required. Desktop computing power (both cpu and graphics chip) to deliver all this GUI effects was not a big deal. This was the time period before "skeumorphism" became persona non grata. 4) iPhone/Android mobile phones come on the market in 2007/2008 with low-powered CPUs and precious battery life. Now, things like painting 3D heavy UI and rendering translucent drop shadows are seen as a massive extravagance. A waste of cpu & battery power. In 2012 Windows 8 and 2013 iOS 7, everybody removes the last 20 years of 3D GUI affordances and makes everything flat again. 5) To make the GUI consistent between mobile phones and desktops, Microsoft makes the desktops flat as well even though there is abundance of computing power. Therefore Windows 8/8.1 looks like Windows 1.0 again[1]. The Apple Mac OS X is also flatter but at least they kept the windows casting drop shadows. What's interesting is that the marketingspeak from Microsoft/Apple/Google about "flat design" talks about it being "modern", "clean", and "fresh". To me, it seems like it's really all about the current limitations of mobile phone cpus and forcing a UI consistency to the desktop users. Basically, it's punishing the desktop users by enforcing the lowest common denominator across device platforms. Hopefully, we'll get a new trend where everybody will go back to styling GUI elements with some hints of "clickability" without gratuitous skeumorphism. We just need some balance. [1] flat UI in 1985: https://www.google.com/search?q=windows+1.0&source=lnms&tbm=isch https://www.google.com/search?q=windows+1.0&source=lnms&tbm=...

anon4 11y ago
You're right up to about 4). The iPhone had more power than 95-era computers and definitely could render buttons with bezels. It's just a design fad. iPhone removed a few decorations from the GUI to make it fit better on a small screen, then people just had to out-minimalise Apple and it all culminates in Windows 10's display settings dialog where resolution settings is hidden behind a clickable "advanced settings" label typeset with tiny font in grey on grey background.
- jasode 11y ago
  >You're right up to about 4). The iPhone had more power than 95-era computers Well, Win95 computers got never-ending electricity from a wall-outlet. Mobile phones expending cpu cycles on "unnecessary" GUI styling wastes battery power. You're right about the other justification: a mobile phone's "UI buttons" shouldn't waste pixels on boundaries (e.g. bounding rectangles). It just needs to be spaced far apart enough for fingertip width. Unfortunately, this design makes it impossible to distinguish between text that's just a "status" as opposed to a button that executes an "action".
  - anon4 11y ago
    Those pixels are always drawn anyway. And a phone's biggest battery killer is the screen which... is on if you're looking at it. So, either your biggest power draw is already on, or there's no reason for you to put any pixels on screen.
    - jasode 11y ago
      >Those pixels are always drawn anyway. In terms of LCD being "on" vs "off", yes, they are always "on". However, the pixels for extra GUI effects must still be "computed". For example, Apple recommends that the "parallax" feature can be turned off to help conserve battery power. Parallax requires cpu computation to "draw" even though those pixels are always "on". It's the same concept of disabling screensavers on the thousands of servers in datacenters. Even those those pixels are always on, computing the drawings in screensavers consume cpu. Multiply the waste that by thousands of servers and the company is paying extra electricity bills for no reason.

by jasode 11y ago

anon4 11y ago

You're right up to about 4). The iPhone had more power than 95-era computers and definitely could render buttons with bezels. It's just a design fad. iPhone removed a few decorations from the GUI to make it fit better on a small screen, then people just had to out-minimalise Apple and it all culminates in Windows 10's display settings dialog where resolution settings is hidden behind a clickable "advanced settings" label typeset with tiny font in grey on grey background.

jasode 11y ago
>You're right up to about 4). The iPhone had more power than 95-era computers Well, Win95 computers got never-ending electricity from a wall-outlet. Mobile phones expending cpu cycles on "unnecessary" GUI styling wastes battery power. You're right about the other justification: a mobile phone's "UI buttons" shouldn't waste pixels on boundaries (e.g. bounding rectangles). It just needs to be spaced far apart enough for fingertip width. Unfortunately, this design makes it impossible to distinguish between text that's just a "status" as opposed to a button that executes an "action".
- anon4 11y ago
  Those pixels are always drawn anyway. And a phone's biggest battery killer is the screen which... is on if you're looking at it. So, either your biggest power draw is already on, or there's no reason for you to put any pixels on screen.
  - jasode 11y ago
    >Those pixels are always drawn anyway. In terms of LCD being "on" vs "off", yes, they are always "on". However, the pixels for extra GUI effects must still be "computed". For example, Apple recommends that the "parallax" feature can be turned off to help conserve battery power. Parallax requires cpu computation to "draw" even though those pixels are always "on". It's the same concept of disabling screensavers on the thousands of servers in datacenters. Even those those pixels are always on, computing the drawings in screensavers consume cpu. Multiply the waste that by thousands of servers and the company is paying extra electricity bills for no reason.