4 ms·

Art Bits from HyperCard

schlauerfox 8mo ago
now I need an emoji font in this 90s style of those 'small treasures'
colinbartlett 8mo ago
HyperCard was definitely my first taste of what would become my career in web software development. I wasn't a Mac user at home, but school had them and I absolutely loved what I could create with HyperCard, there was nothing like it on Windows. I also recall switching to SuperCard simply for the COLOR support, what a time.
doawoo 8mo ago
We need a modern HyperCard, I want to see more creative computing
- oidar 8mo ago
  Have you seen Decker: https://beyondloom.com/decker/ https://beyondloom.com/decker/
  - hendersonreed 8mo ago
    there's a great blogpost explaining the creator's inspirations in hypercard also: https://beyondloom.com/blog/sketchpad.html https://beyondloom.com/blog/sketchpad.html
- escapecharacter 8mo ago
  in progress ;)
- simquat 8mo ago
  I'm working on it, Breadboard[0] is a visual app builder that mixes Figma-style UI design with Shortcuts-style logic. [0] https://breadboards.io/ https://breadboards.io/
- afandian 8mo ago
  I recently enjoyed this episode of Mac Folklore Radio. A surprising prescient discussion on HyperCard and hypertext. https://podcasts.apple.com/gb/podcast/mac-folklore-radio/id1428670055?i=1000465784581 https://podcasts.apple.com/gb/podcast/mac-folklore-radio/id1...
- hyperhello 8mo ago
  There is this thing called the World Wide Web that does most of that.
  - yjftsjthsd-h 8mo ago
    The web is sort of like hypercard, but it's not the same; in particular, the ease of creating things in hypercard is the important thing about it, and AFAIK that remains unmatched.
    - NetMageSCW 8mo ago
      Exactly - the Web is a PDF. Hypercard is a Word document.
      - hyperhello 8mo ago
        As someone who knows rather a lot about HyperCard: it was never allowed or positioned to fulfill its potential. There were easily fixable security issues ruining the opportunity to be the center of OS scripting. The UI was never rewritten for color and to match the Mac UI, which would not have been complicated either. The code must have been very difficult to upgrade, either technically or organizationally, because the entire upgrade run past 2.0 was so meager. It was a piece of genius, but in the end, only a piece.
- tomcam 8mo ago
  LiveCode is its spiritual successor IMHO. Cross platform too. https://livecode.com/ https://livecode.com/
  - NetMageSCW 8mo ago
    Doesn’t really seem to get “it” to be a successor, or even a new VisualBasic.
- NetMageSCW 8mo ago
  A long term goal of mine, but I would create a desktop application as I don’t think there’s enough focus on those any more.
  - doawoo 8mo ago
    I would love a local-first app, publish to web sure! but local first editor would be fantastic imo
oidar 8mo ago
Archive.org link: https://web.archive.org/web/20260306224042/https://archives.somnolescent.net/web/mari_v2/junk/hypercard/ https://web.archive.org/web/20260306224042/https://archives....
ascorbic 8mo ago
Ah, that'll be useful. The hardest thing about adding a new project to my site is finding a new HyperCard/System 6 icon. https://mk.gg/ https://mk.gg/
- heliumtera 8mo ago
  Hey, I really loved the fonts on your website. For the past 10 years I've being using terminus bitmap font, so I have strong opinions about it. The only reason I prefer Firefox is because it supports bitmap. Reading your website on my phone made my day! Lovely fonts/aesthetics
- bensyverson 8mo ago
  Wow, I must be in my 40s because I love your site :)
  - ascorbic 8mo ago
    Did you find the "hot corner" though?
    - bensyverson 8mo ago
      omg immediate nostalgia. I can still picture the After Dark floppies!
- zahlman 8mo ago
  I get that I'm critiquing you within your apparent wheelhouse, but this aesthetic also matters a lot to me. img[data-astro-cid-vnzlvqnm] { width: 48px; height: 48px; image-rendering: pixelated; object-fit: contain; margin-bottom: 0.5rem; } I understand the goal here, but it works really poorly IMO when the source images are generally 32x32 (and some of them are smaller to arbitrary degrees because the content has been cropped — this doesn't seem to distort aspect ratios, but e.g. the "eye" icon gets stretched to fill the space, and thus scales with a bespoke 48/25 factor). Meanwhile the hover cursor looks pixel-precise, but definitely too big compared to the icons. (It seems to have been scaled 2x ahead of time, from an authentic 16x16.) The background scale is also pixel-precise (I don't know whether it's 2x scaled just to scale it, or to look like a 2x2 "pattern") so the difference in approaches is just really jarring to me. (I think the font is also doing some anti-aliasing; probably can't really control that. It looks really cool, though.) I would really recommend not cropping to content, and either using integer-scale boxes or just accepting some sampling interpolation. Or just leaving everything at 1:1 scale. It'd be noticeably physically smaller than authentic for typical desktop displays, but that's just hardware doing what it does. (And as it stands, it might be bigger than authentic!) Bonus points for a `@media` query on device resolution to make the choice. (Edit: after reading through https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/image-rendering https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/P... I'm not really sure Firefox is working as advertised...? But I think x1.5 scaling for pixel art is always going to involve compromise.)
alexpotato 8mo ago
My favorite fact about HyperCard was that the game Myst was built using HyperCard: Source: https://en.wikipedia.org/wiki/Myst#:~:text=The%20game%20was%20created%20on%20Apple%20Macintosh%20computers%20and%20ran%20on%20the%20HyperCard%20software%20stack https://en.wikipedia.org/wiki/Myst#:~:text=The%20game%20was%...
- IIsi50MHz 8mo ago
  Also sources: the Myst making-of video included on the Myst CD-ROM, and the Cyan team members who made it!
  - alexpotato 8mo ago
    Thanks for the reminder! Feel like I saw this many years ago but totally worth a re-watch.
joshstrange 8mo ago
I so wish the author had made their screenshot at the top an image map so you could click on the icons to jump to each section below. But so cool! I loved playing with HyperCard in elementary/middle school before I moved on to coding and saw what was possible there. But HyperCard will always hold a special place in my heart. EDIT: Ok, I couldn't help myself, this [0] will inject the image map into the page (paste it into your console). Don't worry, it's simple and easy to read what it's doing). Video of what it looks like once injected: https://cs.joshstrange.com/t1T3KGxF https://cs.joshstrange.com/t1T3KGxF [0] https://gist.github.com/joshstrange/6ea1fb4b64b39ee410e2bd6f8d03495b https://gist.github.com/joshstrange/6ea1fb4b64b39ee410e2bd6f...
NetMageSCW 8mo ago
I wonder if these were created by Susan Kare.

now I need an emoji font in this 90s style of those 'small treasures'

HyperCard was definitely my first taste of what would become my career in web software development. I wasn't a Mac user at home, but school had them and I absolutely loved what I could create with HyperCard, there was nothing like it on Windows. I also recall switching to SuperCard simply for the COLOR support, what a time.

doawoo 8mo ago

We need a modern HyperCard, I want to see more creative computing

oidar 8mo ago
Have you seen Decker: https://beyondloom.com/decker/ https://beyondloom.com/decker/
- hendersonreed 8mo ago
  there's a great blogpost explaining the creator's inspirations in hypercard also: https://beyondloom.com/blog/sketchpad.html https://beyondloom.com/blog/sketchpad.html
escapecharacter 8mo ago
in progress ;)
simquat 8mo ago
I'm working on it, Breadboard[0] is a visual app builder that mixes Figma-style UI design with Shortcuts-style logic. [0] https://breadboards.io/ https://breadboards.io/
afandian 8mo ago
I recently enjoyed this episode of Mac Folklore Radio. A surprising prescient discussion on HyperCard and hypertext. https://podcasts.apple.com/gb/podcast/mac-folklore-radio/id1428670055?i=1000465784581 https://podcasts.apple.com/gb/podcast/mac-folklore-radio/id1...
hyperhello 8mo ago
There is this thing called the World Wide Web that does most of that.
- yjftsjthsd-h 8mo ago
  The web is sort of like hypercard, but it's not the same; in particular, the ease of creating things in hypercard is the important thing about it, and AFAIK that remains unmatched.
  - NetMageSCW 8mo ago
    Exactly - the Web is a PDF. Hypercard is a Word document.
    - hyperhello 8mo ago
      As someone who knows rather a lot about HyperCard: it was never allowed or positioned to fulfill its potential. There were easily fixable security issues ruining the opportunity to be the center of OS scripting. The UI was never rewritten for color and to match the Mac UI, which would not have been complicated either. The code must have been very difficult to upgrade, either technically or organizationally, because the entire upgrade run past 2.0 was so meager. It was a piece of genius, but in the end, only a piece.
tomcam 8mo ago
LiveCode is its spiritual successor IMHO. Cross platform too. https://livecode.com/ https://livecode.com/
- NetMageSCW 8mo ago
  Doesn’t really seem to get “it” to be a successor, or even a new VisualBasic.
NetMageSCW 8mo ago
A long term goal of mine, but I would create a desktop application as I don’t think there’s enough focus on those any more.
- doawoo 8mo ago
  I would love a local-first app, publish to web sure! but local first editor would be fantastic imo

oidar 8mo ago

Archive.org link: https://web.archive.org/web/20260306224042/https://archives.somnolescent.net/web/mari_v2/junk/hypercard/ https://web.archive.org/web/20260306224042/https://archives....

ascorbic 8mo ago

Ah, that'll be useful. The hardest thing about adding a new project to my site is finding a new HyperCard/System 6 icon. https://mk.gg/ https://mk.gg/

heliumtera 8mo ago
Hey, I really loved the fonts on your website. For the past 10 years I've being using terminus bitmap font, so I have strong opinions about it. The only reason I prefer Firefox is because it supports bitmap. Reading your website on my phone made my day! Lovely fonts/aesthetics
bensyverson 8mo ago
Wow, I must be in my 40s because I love your site :)
- ascorbic 8mo ago
  Did you find the "hot corner" though?
  - bensyverson 8mo ago
    omg immediate nostalgia. I can still picture the After Dark floppies!
zahlman 8mo ago
I get that I'm critiquing you within your apparent wheelhouse, but this aesthetic also matters a lot to me. img[data-astro-cid-vnzlvqnm] { width: 48px; height: 48px; image-rendering: pixelated; object-fit: contain; margin-bottom: 0.5rem; } I understand the goal here, but it works really poorly IMO when the source images are generally 32x32 (and some of them are smaller to arbitrary degrees because the content has been cropped — this doesn't seem to distort aspect ratios, but e.g. the "eye" icon gets stretched to fill the space, and thus scales with a bespoke 48/25 factor). Meanwhile the hover cursor looks pixel-precise, but definitely too big compared to the icons. (It seems to have been scaled 2x ahead of time, from an authentic 16x16.) The background scale is also pixel-precise (I don't know whether it's 2x scaled just to scale it, or to look like a 2x2 "pattern") so the difference in approaches is just really jarring to me. (I think the font is also doing some anti-aliasing; probably can't really control that. It looks really cool, though.) I would really recommend not cropping to content, and either using integer-scale boxes or just accepting some sampling interpolation. Or just leaving everything at 1:1 scale. It'd be noticeably physically smaller than authentic for typical desktop displays, but that's just hardware doing what it does. (And as it stands, it might be bigger than authentic!) Bonus points for a `@media` query on device resolution to make the choice. (Edit: after reading through https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/image-rendering https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/P... I'm not really sure Firefox is working as advertised...? But I think x1.5 scaling for pixel art is always going to involve compromise.)

alexpotato 8mo ago

My favorite fact about HyperCard was that the game Myst was built using HyperCard: Source: https://en.wikipedia.org/wiki/Myst#:~:text=The%20game%20was%20created%20on%20Apple%20Macintosh%20computers%20and%20ran%20on%20the%20HyperCard%20software%20stack https://en.wikipedia.org/wiki/Myst#:~:text=The%20game%20was%...

IIsi50MHz 8mo ago
Also sources: the Myst making-of video included on the Myst CD-ROM, and the Cyan team members who made it!
- alexpotato 8mo ago
  Thanks for the reminder! Feel like I saw this many years ago but totally worth a re-watch.

joshstrange 8mo ago

I so wish the author had made their screenshot at the top an image map so you could click on the icons to jump to each section below. But so cool! I loved playing with HyperCard in elementary/middle school before I moved on to coding and saw what was possible there. But HyperCard will always hold a special place in my heart. EDIT: Ok, I couldn't help myself, this [0] will inject the image map into the page (paste it into your console). Don't worry, it's simple and easy to read what it's doing). Video of what it looks like once injected: https://cs.joshstrange.com/t1T3KGxF https://cs.joshstrange.com/t1T3KGxF [0] https://gist.github.com/joshstrange/6ea1fb4b64b39ee410e2bd6f8d03495b https://gist.github.com/joshstrange/6ea1fb4b64b39ee410e2bd6f...

NetMageSCW 8mo ago

I wonder if these were created by Susan Kare.