5 ms·

I wonder how much material design is influenced by Hypercard. I know the web was partially inspired but it looks like with material design the language is sort

I wonder how much material design is influenced by Hypercard. I know the web was partially inspired but it looks like with material design the language is sort of extended. Or maybe it was all integrated into the design language for the web.

Torwald 9y ago
I had an equivalent multimedia authoring system on the Amiga, called Hyperbook. http://obligement.free.fr/articles/hyperbook_beta.php http://obligement.free.fr/articles/hyperbook_beta.php It was very much influenced by HyperCard, obviously. They didn't try to hide it, to the contrary, so much so that they hacked the UI-controls to make them more "Macintoshis" I guess. Except it came in colors. The multimedia aspect of the Amiga, remember?
- ken 9y ago
  HyperCard on the Apple IIgs fully supported colors. :-)
Karunamon 9y ago
What I find amazing is that early B&W GUIs were more usable than modern material design. Most takes on Material that I’ve seen take poor use of screen real-estate, poor conveyance, and distracting/hard-to-read color choices to an art form.
- jaysonelliot 9y ago
  I've been very interested lately in the idea of monochromatic interfaces. Aside from being easier on the eyes (especially an amber or red interface), they force UI designers to make careful choices, and potentially result in a cleaner, more useable interface. It's not a project for me yet, just a series of notes and concepts, but I'd like to turn it into a proof of concept at the very least.
  - kbutler 9y ago
    Having made extensive use of amber and green and b&w monitors, I much prefer full color. Though I dislike the recent low-contrast efforts. Keep high contrast, reduce brightness as desired for your environment.
    - mikekchar 9y ago
      I totally agree with this. I've spent hours and hours selecting colour palettes that give high contrast (I work on 16 colour terminals because more than 16 colours makes it really difficult to guarantee good contrast in all situations). Having said that, it's hard to beat black on white for contrast ;-) However, I think one of the reasons people like the monochromatic themes (especially white on black) is the same -- they want high contrast with low brightness. By having the background black, they guarantee a low brightness. And when white is too bright, they go for amber. I find that by doing the reverse (black on white) and setting my brightness very low (I often go as low at 7%, but more normally 11% back light) I have a very comfortable display with a lot more options. It's really funny, though, because when I have to run software that doesn't follow my colour themes, the computer almost looks like it's turned off. If I'm playing a game, I have to crank up the brightness to 70% or 80% in the same lighting conditions.
      - deleted 9y ago
        [deleted]
      - gm-conspiracy 9y ago
        I just thought you had a fondness for EGA.
    - kuschku 9y ago
      The problem of the low contrast issue is that otherwise content becomes unusuable on calibrated screens. On a modern screen, a value of 100% is 1000 nits, 0% is far below 1 nits. On an average shitty monitor, it's more a range 10 times more limited. Your suggestion of making my monitor emulate your shitty monitor in hardware settings would also make it impossible to use it for use cases that do need this high contrast. Reading text, on the other hand, gets very painful with that much contrast. Real text, on a real newspaper, in normal room light, is #454545 text on #f0f0f0 background, in sRGB color space. Not #000 on #fff in sRGB, and definitely not 0 on max on ten times more contrast. The real issue is that we have no color and contrast management at all for websites. I can't say that a color is meant to mean a certain brightness in nits, so it renders as #777 on my screen, and #000 on yours.
- dman 9y ago
  In case some UX / HCI experts read this thread, are there any credible studies of information density in user interfaces plotted over time?
  - wtallis 9y ago
    I'm not aware of any systematic analysis. However, my expectations are that we would see relatively constant information density until about a decade ago. The simultaneous increase in available pixels and increase in prevalence of touchscreens has made it possible and in some cases desirable to drastically reduce information density without rendering interfaces immediately unusable. The problem is that touchscreen-oriented design is infecting non-touchscreen software.
  - kuschku 9y ago
    You could simply plot recommended sizes for clickable items over time. Windows 9x used 125% text height of 10pt as clickable item height, that's around 0.441mm. Android 4.0 recommends a clickable item height of 48dp, "roughly one centimeter". Android 5.0 uses 56dp (1.17cm), and on Phablets and Tablets even 64dp (1.33cm). For items in lists, a second effect was seen, as it became recommend to show more info earlier, the number of list items visible at the same time was reduced. A multi line list item has a minimum height of 72dp (1.5cm), average is more around 96dp (2cm). A similar effect can be seen on Windows, in UWP, the average item height also went to almost exactly 1cm in lists or menus. This all fits well, as the smalest reliably clickable element in a UI is ~1cm on its smallest dimension. This is also a common issue with HN, where voting buttons are 0.3 by 0.3cm, even on mobile, and as result I misclick ~2/3rds of the time, but no one seems willing to fix this.
    - dman 9y ago
      Thanks for taking the time to write such a detailed comment!
      - kuschku 9y ago
        It’s honestly not much effort – I was compiling a new version of my app when I wrote it, and the last change I had done was the size of a button, because people complained about it. So I happened to have all the documents open by luck :)
- scroot 9y ago
  Once we get usable and affordable e-ink monitors designers will have to revisit this territory seriously.
  - TeMPOraL 9y ago
    Color abuse isn't really the most serious problem; the loss of information density is. E-ink isn't going to help here. Some alternative business models that would not incentivize companies into making their application glorified interactive movie posters would be welcome.
- zitterbewegung 9y ago
  I have done material design somewhat badly. I would mean a design directly from Google not someone’s reinterpretation of it. You can use it to justify your sloppyness but you could do the same thing in HyperCard.
  - TeMPOraL 9y ago
    I'd say Google is widely recognized for "taking poor use of screen real-estate to an art form" with their designs; though Material design is probably just a symptom here, the cause being the ongoing desire to dumb down applications and remove functionality.
    - pjmlp 9y ago
      Actually a typical rant on Android development forums is how Google doesn't follow their own Material designs.
      - TeMPOraL 9y ago
        Maybe. Still, I go to material.io and I don't see anything there that would make those things better. I wish there was a UI philosophy that would take Tufte's ideas as a set of core principles: maximizing data-ink ratio, minimizing junk, increasing data density.
        aeorgnoieang 9y ago
        > I wish there was a UI philosophy that would take Tufte's ideas as a set of core principles Wouldn't that just be Tufte's ideas? What's missing for it to be a 'UI philosophy'?
        TeMPOraL 9y ago
        A nice .io domain and endorsement by a hot tech company, I guess.

Torwald 9y ago

I had an equivalent multimedia authoring system on the Amiga, called Hyperbook. http://obligement.free.fr/articles/hyperbook_beta.php http://obligement.free.fr/articles/hyperbook_beta.php It was very much influenced by HyperCard, obviously. They didn't try to hide it, to the contrary, so much so that they hacked the UI-controls to make them more "Macintoshis" I guess. Except it came in colors. The multimedia aspect of the Amiga, remember?

ken 9y ago
HyperCard on the Apple IIgs fully supported colors. :-)

Karunamon 9y ago

What I find amazing is that early B&W GUIs were more usable than modern material design. Most takes on Material that I’ve seen take poor use of screen real-estate, poor conveyance, and distracting/hard-to-read color choices to an art form.

jaysonelliot 9y ago
I've been very interested lately in the idea of monochromatic interfaces. Aside from being easier on the eyes (especially an amber or red interface), they force UI designers to make careful choices, and potentially result in a cleaner, more useable interface. It's not a project for me yet, just a series of notes and concepts, but I'd like to turn it into a proof of concept at the very least.
- kbutler 9y ago
  Having made extensive use of amber and green and b&w monitors, I much prefer full color. Though I dislike the recent low-contrast efforts. Keep high contrast, reduce brightness as desired for your environment.
  - mikekchar 9y ago
    I totally agree with this. I've spent hours and hours selecting colour palettes that give high contrast (I work on 16 colour terminals because more than 16 colours makes it really difficult to guarantee good contrast in all situations). Having said that, it's hard to beat black on white for contrast ;-) However, I think one of the reasons people like the monochromatic themes (especially white on black) is the same -- they want high contrast with low brightness. By having the background black, they guarantee a low brightness. And when white is too bright, they go for amber. I find that by doing the reverse (black on white) and setting my brightness very low (I often go as low at 7%, but more normally 11% back light) I have a very comfortable display with a lot more options. It's really funny, though, because when I have to run software that doesn't follow my colour themes, the computer almost looks like it's turned off. If I'm playing a game, I have to crank up the brightness to 70% or 80% in the same lighting conditions.
    - deleted 9y ago
      [deleted]
    - gm-conspiracy 9y ago
      I just thought you had a fondness for EGA.
  - kuschku 9y ago
    The problem of the low contrast issue is that otherwise content becomes unusuable on calibrated screens. On a modern screen, a value of 100% is 1000 nits, 0% is far below 1 nits. On an average shitty monitor, it's more a range 10 times more limited. Your suggestion of making my monitor emulate your shitty monitor in hardware settings would also make it impossible to use it for use cases that do need this high contrast. Reading text, on the other hand, gets very painful with that much contrast. Real text, on a real newspaper, in normal room light, is #454545 text on #f0f0f0 background, in sRGB color space. Not #000 on #fff in sRGB, and definitely not 0 on max on ten times more contrast. The real issue is that we have no color and contrast management at all for websites. I can't say that a color is meant to mean a certain brightness in nits, so it renders as #777 on my screen, and #000 on yours.
dman 9y ago
In case some UX / HCI experts read this thread, are there any credible studies of information density in user interfaces plotted over time?
- wtallis 9y ago
  I'm not aware of any systematic analysis. However, my expectations are that we would see relatively constant information density until about a decade ago. The simultaneous increase in available pixels and increase in prevalence of touchscreens has made it possible and in some cases desirable to drastically reduce information density without rendering interfaces immediately unusable. The problem is that touchscreen-oriented design is infecting non-touchscreen software.
- kuschku 9y ago
  You could simply plot recommended sizes for clickable items over time. Windows 9x used 125% text height of 10pt as clickable item height, that's around 0.441mm. Android 4.0 recommends a clickable item height of 48dp, "roughly one centimeter". Android 5.0 uses 56dp (1.17cm), and on Phablets and Tablets even 64dp (1.33cm). For items in lists, a second effect was seen, as it became recommend to show more info earlier, the number of list items visible at the same time was reduced. A multi line list item has a minimum height of 72dp (1.5cm), average is more around 96dp (2cm). A similar effect can be seen on Windows, in UWP, the average item height also went to almost exactly 1cm in lists or menus. This all fits well, as the smalest reliably clickable element in a UI is ~1cm on its smallest dimension. This is also a common issue with HN, where voting buttons are 0.3 by 0.3cm, even on mobile, and as result I misclick ~2/3rds of the time, but no one seems willing to fix this.
  - dman 9y ago
    Thanks for taking the time to write such a detailed comment!
    - kuschku 9y ago
      It’s honestly not much effort – I was compiling a new version of my app when I wrote it, and the last change I had done was the size of a button, because people complained about it. So I happened to have all the documents open by luck :)
scroot 9y ago
Once we get usable and affordable e-ink monitors designers will have to revisit this territory seriously.
- TeMPOraL 9y ago
  Color abuse isn't really the most serious problem; the loss of information density is. E-ink isn't going to help here. Some alternative business models that would not incentivize companies into making their application glorified interactive movie posters would be welcome.
zitterbewegung 9y ago
I have done material design somewhat badly. I would mean a design directly from Google not someone’s reinterpretation of it. You can use it to justify your sloppyness but you could do the same thing in HyperCard.
- TeMPOraL 9y ago
  I'd say Google is widely recognized for "taking poor use of screen real-estate to an art form" with their designs; though Material design is probably just a symptom here, the cause being the ongoing desire to dumb down applications and remove functionality.
  - pjmlp 9y ago
    Actually a typical rant on Android development forums is how Google doesn't follow their own Material designs.
    - TeMPOraL 9y ago
      Maybe. Still, I go to material.io and I don't see anything there that would make those things better. I wish there was a UI philosophy that would take Tufte's ideas as a set of core principles: maximizing data-ink ratio, minimizing junk, increasing data density.
      - aeorgnoieang 9y ago
        > I wish there was a UI philosophy that would take Tufte's ideas as a set of core principles Wouldn't that just be Tufte's ideas? What's missing for it to be a 'UI philosophy'?
        TeMPOraL 9y ago
        A nice .io domain and endorsement by a hot tech company, I guess.