# HyperCard (ハイパーカード)

> A screen form that came out of a tool. HyperCard was written by Bill Atkinson and shipped with the System 6 Macintosh in August 1987, and Apple described it as a hypermedia program or construction kit. Its unit is not a page but a card, the metaphor being a card index in which each card holds pictures or text, and a reader jumps from card to card or from one stack to another.

- IndexStyle No.536 — https://indexstyle.org/styles/hypercard
- Kind: Layout · Family: Digital Retro · Era: 1987–2004
- Mood: Play, Nostalgia, Intimacy
- Color cues: #000000 / #FFFFFF / #808080 (cues taken from reference works, not a fixed palette)

## Defining characteristics

- One card filling the screen, with navigation that jumps between cards rather than turning pages
- One bit black on white drawing, where grays and photographs both arrive as dither patterns
- A row of small square icon buttons packed along the bottom edge of the card
- Picture and text sharing one surface, with an input field marked by a single rule

## Best used for

- Building an exhibition screen that presents holdings one card at a time instead of as a run of pages
- Rebuilding the feel of late 1980s and 1990s homemade software in one bit black and white

## Composition recipe

- Typography & lettering: Use a bitmap screen face. Do not enlarge headings, and let text carry the same weight as the drawing on the card.
- Layout & structure: One card is one screen. Put the shared frame on the background layer and lay the individual picture and text over it. Pack the navigation buttons along the bottom.
- Material & texture: Black on white at one bit. Make midtones from dither patterns and halftone any photograph before placing it. Draw outlines as single pixel rules.

## What to avoid

Hiding the links inside the artwork erases the way back, and nobody can tell which stack they are in or how far along it.

## Application checklist

Before calling a piece an application of this style, check it against the defining characteristics:

- [ ] One card filling the screen, with navigation that jumps between cards rather than turning pages
- [ ] One bit black on white drawing, where grays and photographs both arrive as dither patterns
- [ ] A row of small square icon buttons packed along the bottom edge of the card
- [ ] Picture and text sharing one surface, with an input field marked by a single rule
- [ ] At least one reference work below has been studied directly
- [ ] The caution above ("What to avoid") has been addressed

## Related styles

- **Web 1.0 (ウェブ1.0)** — Reuses the naivety of the constrained early web as directness and charm. → https://indexstyle.org/styles/web-one
- **Pixel Art (ピクセルアート)** — Treats the pixel as an honest unit, building clear form from limited resolution and palette. → https://indexstyle.org/styles/pixel-art

## Further study

- HyperTalk の英語に近い書き方。1986年から87年に Dan Winkler が作った
- Myst が最初はカードの束として出たこと
- 教材や住所録として無償で回っていた束の作り

## Reference works

- Karl Baron《Macintosh Plus 上の HyperTalk スクリプト編集画面》2008 — Wikimedia Commons / CC BY 2.0 — https://commons.wikimedia.org/wiki/File:Mac%20Plus%20clock%20source%20code.jpg

## Source of record

- Museums Victoria Collections — "Hypercard Overview" — https://collections.museumsvictoria.com.au/articles/1487

## Machine surfaces

- JSON: https://indexstyle.org/api/styles/hypercard
- Image-generation prompt (legally clean): https://indexstyle.org/styles/hypercard/prompt.txt
- MCP: https://indexstyle.org/mcp (tools: search_styles, get_style, compose_styles; prompts: image-prompt, apply-style)
