TITLE Jelly Alphabet PROMPT A toy: big wobbly letters made of jelly. Whatever the viewer types appears as glossy, translucent soft-body glyphs that drop onto a plate-like floor, jiggle, squash against each other, and can be poked, stretched and flung. Canvas 2D with real soft-body physics. Concept: typography you want to prod. Mood: gleeful, sticky, loud. Palette: hot pink field #FF2E7E as the full background, lemon jelly #FFE14D as the main letter colour, deep grape #2B1055 for type, shadows and outlines, white #FFFFFF for highlights; additional jelly flavours that letters cycle through: lime #7CFF6B, blue raspberry #3DA5FF, orange #FF8A1F, each semi-translucent so overlapping letters mix. Saturated colour-field page, flat background with a subtle huge halftone dot pattern in a slightly darker pink (dots swell toward the upper right). The floor is drawn as a wide, shallow glossy plate in lighter pinks with a white rim highlight and a grape shadow; on tall narrow screens there are two plates stacked (a shelf and a floor) so a word breaks into two rows of big letters, and letters hop between plates when the word reflows. Glyph construction: a custom outline font defined in the page for A–Z, 0–9 and a few punctuation marks (! ? . - +): chunky rounded shapes (fat inflated letterforms with no thin strokes; counters in A, B, D, O, P, Q, R, 0, 4, 6, 8, 9 as holes), each defined as closed polygon outlines with rounded corners, sampled into roughly 30–60 boundary points. Each letter becomes a soft body: boundary point masses connected by structural and bend springs to neighbours, plus cross-bracing springs across the stroke and shape-matching toward the rest pose (best-fit rotation blended with an area-preserving linear fit, so a squashed letter bulges sideways) so it holds its form but wobbles like gelatine; verlet integration at 120 Hz with viscous internal damping; collisions with the floor, walls and other letters (point-vs-polygon push-out) with sticky friction. Deeply tangled letters ooze through each other rather than knotting. Untouched letters gently slide and hop to their place in the word and stay upright; once the viewer drags a letter it is free to lie wherever it lands. Rendering: smooth the boundary with Catmull-Rom curves; fill with a vertical gradient of the flavour colour at ~85% opacity; an inner darker rim (stroke in a deeper tone, clipped inside) and a thin grape skin line, a broad soft specular highlight band along the upper-left that is rebuilt from the live outline so it deforms with the shape, a band of pooled light on the lower-right, three small bright glints, a few tiny bubbles suspended inside, and a soft coloured caustic glow on the plate (the pink beneath a jelly glows lighter, as light through gelatine does) plus a grape contact shadow. When a letter squashes, the highlight stretches: this sells the material. Interaction: type on the keyboard: each key drops its letter from the top at the next position with a little spin; letters land, splat, rebound and settle into a quivering word, shrinking smoothly as the word gets longer. A text field styled as a white candy-wrapper strip (zigzag ends, pink stripes) opens the system keyboard on touch devices, plus a row of big "sample word" candies (squish, yum!, gloop, boing, jelly, blop?, 2sweet, wobble). Drag any letter with pointer/finger: it stretches from the grab point like taffy and springs back (pull too far and it slips off the finger); fling it and it sails and splats against the walls, flattening and recovering. Poke (click) sends a jiggle wave through it; letters also flinch when the cursor brushes them, and poking the empty table nudges nearby letters. A "wobble the table" control (or the Space bar) gives everything a jolt. Backspace removes the last letter with a pop into droplets that fall and fade; Escape/Delete pops everything. Capacity capped at 14 letters; the oldest is slurped away off the top of the screen when exceeded. Signature moment: the landing: a word of fat letters dropping in sequence, each squashing to about two-thirds height, bulging sideways into its neighbours, and jiggling in a decaying wave while highlights slide over them. On load the page performs it unprompted: the word "WOBBLE" drops in letter by letter within the first two seconds and keeps quivering; then a designed hint appears in small type: "type something. then poke it." Typography (DOM): minimal; a tiny label top-left in bold grape lowercase rounded sans ("Arial Rounded MT Bold"/"Trebuchet MS"/system-ui): "jelly alphabet" with a flavour picker beside it drawn as four jelly-cube swatches (pressing one turns every letter that flavour, pressing it again returns to the mixed bag in which lemon dominates), and at top-right a gravity toggle drawn as an arrow (normal / upside-down / zero-g, in which letters float and bump slowly), the wobble-the-table button and a sound toggle (off by default): soft wet "blop" sounds on impacts, pitch by letter size. The hint line doubles as a small status whisper for these controls. Reduced motion: letters appear in place with a single gentle settle and reduced jiggle amplitude. Resize keeps letters within bounds. DESCRIPTION A hot-pink colour field with an oversized halftone and a glossy plate, onto which the word WOBBLE drops letter by letter as soon as the page opens: fat, translucent lemon, lime, blue-raspberry and orange jellies that squash to two-thirds of their height, bulge into each other, rebound and keep quivering. Every glyph is a hand-drawn chunky outline turned into a real soft body, so everything the viewer types, drags, pokes or flings behaves like gelatine: highlights stretch as the shape deforms, bubbles ride along inside, coloured light pools on the plate underneath. The page is a toy with almost no chrome: a tiny label, four jelly-cube flavour swatches, three round grape buttons, a candy-wrapper text field and a row of wrapped sweets that drop sample words. VISUAL TECHNIQUES - Custom chunky outline font (41 glyphs with counters) defined as polygons, corner-rounded and resampled into boundary point masses - Soft-body simulation: verlet integration at 120 Hz, shape matching with area-preserving linear blend, ring/bend/cross-bracing springs, viscous damping and soft terminal velocity - Point-versus-polygon collisions between letters with sticky floor friction and an ooze-through untangling mode - Catmull-Rom smoothed outlines filled with translucent vertical gradients on Canvas 2D - Clipped inner rim strokes, plus specular and pooled-light ribbons rebuilt every frame from live surface normals so they stretch with the jelly - Glints anchored to boundary points and bubbles skinned to their nearest outline points - Flavour-tinted caustic glows and grape contact shadows on the plate, computed from what is actually touching - Pre-rendered backdrop canvas: large rotated halftone with size gradient and layered ellipse plates - Droplet bursts and expanding rings for pops and pokes - CSS-drawn jelly cubes, wrapped candies (clip-path twists) and a pinking-sheared candy-wrapper input, with springy cubic-bezier hover and press states - Synthesised blop, pop, slurp and thud sounds with Web Audio, pitched by letter size INTERACTION MODEL Typing any letter, digit or ! ? . - + drops that glyph from the top into the next slot of the word (the wrapper field does the same through the on-screen keyboard); the word rescales and re-centres as it grows, splits across two plates on tall phones, and the oldest letter is slurped away past 14. Backspace pops the last letter into droplets, Escape or Delete pops them all, Space or the plate button jolts the table. Pressing on a letter grabs it by that spot: dragging stretches it like taffy, several fingers can pull at once, releasing flings it so it splats on walls and other letters; a quick click or tap pokes it and sends a jiggle through it, and hovering makes it flinch. The candy buttons replace the word with a sample. The jelly cubes recolour all letters to one flavour or back to the mixed bag; the arrow button cycles gravity between down, upside-down and zero-g; the speaker button turns the blop sounds on. With reduced motion, letters are placed directly in their slots with a small settle and much calmer jiggle.