# Pin Screen

The pin-art toy, as a surface. Press a word through polished pins under a raking lamp, drag it, wipe it, or shake it flat. Your hand is the mould.

Object · With a Pass · https://tactileui.dev/objects/pin-screen

> The code and styling for this object come with the Pass. Sign in if you have one. Sign in: https://tactileui.dev/auth/sign-in The price: https://tactileui.dev/pricing

## Anatomy

Pressure field, Spring heightfield, Hex pin grid, Image heightmap, Silhouette inflate, Stroke aware pitch, Cast shadow march, Sprite atlas shading, Dirty region repaint, Sleeping loop, Text relief

## Usage notes

Give a hero, a cover, a 404 or a launch something to touch before anything is read: the name stands out of the board the way a hand stands out of the real toy, and the visitor presses it, wipes it or leaves their own print in it.

## Options

| Option | Type | Description |
| - | - | - |
| text | text | The word behind the board. Empty is a plain board that takes the shape of whatever presses it. |
| shape | enum | The word, an open hand or a round mark. In code, any image or canvas works too. |
| finish | enum | Auto follows the page: a light board on a light finish, a dark one on a dark finish. |
| frame | enum | Frame |
| hold | boolean | Like the toy, the shape stays up. Off: it appears only under the hand. |
| keep | boolean | What the hand presses stays until the board is shaken flat. |
| pointer | enum | Lift pushes pins out from behind; wipe presses them back flat from the front. |
| pitch | number | The largest pitch. Small boards go finer so the relief stays legible. |
| pinSize | number | Head diameter as a share of the pitch. |
| radius | number | Hand radius (px) |
| depth | number | Relief depth |
| memory | number | How long a stroke stays when the impression is not kept. 0 lets go at once; 1 holds for seconds. |
| light | number | 0 is from above, clockwise. |
| intro | boolean | The relief comes up through the pins when the board first comes into view. |
| arrival | enum | A wave that reads left to right, or deepest first, like a hand pushed in from behind. |

## Methods

- update
- replay
- reset
- pressAt
- state
- destroy

## States

1. **Arriving**: 
2. **At rest**: The relief stands proud under the lamp (hold), the flush field sparkles; the loop is asleep and costs nothing.
3. **Hand over it**: Pins under the pointer spring out (lift) or are pressed back flat (wipe); raised pins brighten, show their shafts and cast shadows away from the lamp.
4. **Remembering**: Without keep, pressure decays with a half-life set by memory, so a stroke lingers and lets go.
5. **Impression kept**: With keep, whatever the hand pressed stays until reset(); the loop still sleeps once the pins settle.
6. **Shaken flat**: 
7. **Off screen or hidden**: The loop pauses; a returning tab cannot launch the springs with a long frame.
8. **Resized**: Rebuilt at the new size, pitch refitted so the relief stays legible; a relief that had arrived is simply there.
9. **Phone**: Small boards get finer pins so the word stays at least ten pins tall; pan-y keeps vertical scrolling.
10. **Reduced motion**: The relief standing and still on the first paint. No arrival, no springs, no pointer; nothing lost.

## How it works

Original. Taken from the physical pin-art toy, not from a catalogue reference, so references is honestly empty. Canvas 2D only; the relief is text in the page fonts, a procedural hand or mark drawn with canvas paths, or any image the page passes in, so no image ships.