Tea and Photos

The brief

This is a worked example. Askmill wrote this prompt from a simulated client interview, in which a model answered the questions for an invented client. The line under the title is the opening request the interview started from; everything else came out of the answers.

The prompt

The complete text, exactly as it is handed to an AI builder.

Download (.txt)

A lap-tray game of photo pairs for a tablet resting on a cushion in an armchair: a few large cream cards lie face down, two of them hide the same family photograph, and finding both brings that photograph up big so the two people sitting together can talk about it. Concept: the match is only a way into the conversation, and nothing in it can be failed. The player is Margaret, who has early dementia, stiff arthritic hands and reading glasses; her carer Joy sits beside her and prepares things. Rules: a round has 3 pairs (6 cards) by default; Joy may choose 2, 3 or 4. Touching a card turns it face up in 900 ms. Two alike stay up as a found pair. Two different stay up together for 3 s, then turn back in 900 ms with no sound, shake, colour or word. After 3 such turns in a row, the next card turned makes the edge of its partner breathe softly until touched. No score, timer, counter, level or praise exists anywhere.

Mood: unhurried, companionable, sunlit; an armchair by a window at four in the afternoon, tea on the side table. Light page. Palette: window cream #FBF4E4 (page ground); linen cream #F3E7CF (card backs, panels); afternoon gold #E3B55A (card edges, fill of big buttons); toffee #9A6B1F (1.5 px keylines round cards and buttons, at least 4:1 on the page so shapes stay findable); tea brown #3A2A1C (all text: at least 11:1 on window cream, at least 6:1 on afternoon gold); milky tea #7A5C3E (small notes in Joy's corner only, at least 4.5:1); window light #FFE3A3, the one accent, used only for the slanted patch of sun on the page and the glow round a found pair, nothing else uses it. No pure white or black, no red or green; tints only by mixing with window cream.

Screens: Margaret sees four, in order. 1) Hello: the line "Hello, Margaret", one button "Let's begin", and nothing else but a faint corner mark. 2) The round: square cards with 24 px corners, backs plain linen cream with a 6 px afternoon-gold edge and a soft warm shadow, fronts showing the photo cropped square (focus 50% 30% so faces survive). 3) The big photo (signature moment). 4) The album: every photo of the round, found or not, laid on one cream page in thin gold edges, each tilted up to 1.5 degrees, under the line "That was lovely."; touching one shows it big with "Back to the album"; one button, "More photos", deals a new round; the album never times out. The corner mark is a 28 px teacup outline at top right (toffee at 35%, deliberately quiet because only Joy needs it, 56 px touch area, accessible name "Joy's corner, hold for two seconds"). Held 2 s on Hello or the album it opens Joy's corner; held 2 s during a round, the remaining cards turn up together and the album arrives exactly as if every pair had been found, so a tired day ends like a finished one.

Joy's corner is a plain sheet in 20 px text: "Name on the hello" (default Margaret); "Add photos", a picker taking many images at once, each resized to 1600 px on the long side plus a 600 px card copy, orientation corrected, stored on the tablet in IndexedDB ("tea-and-photos", version 1, cap 300 photos); a thumbnail grid, the latest round's photos first, each opening "Who is in it", "Year", "Group" (Wedding, Holidays, Children, Garden, or typed) and the switch "Rest this photo", which keeps it out of every round until switched back; "Today's photos" (All mixed, or one group); "How many pairs"; "A quieter day"; "Soft chime"; "Open the last album"; "Close". Each round takes the least recently shown photos that are not resting, ties broken at random; a small group is topped up from all photos; when photos run short, six built-in tea-brown line drawings fill the gaps (teacup, teapot, armchair, window, rose, reading glasses), so the first run is already playable. Settings and the last album are saved in localStorage under "teaAndPhotos.v1". Messages exist only here: empty, "No family photos yet. The drawings will keep you company."; error, "That one would not open. The others are in."; and the note "A pastime for company, not a treatment or a test. Nothing leaves this tablet."

Typography: "Avenir Next", "Gill Sans", "Segoe UI", Verdana, sans-serif; no downloads. On Margaret's screens weight 600, sentence case, never capitals, no interface line longer than four words: hello clamp(48px, 7vw, 72px), button text 36 px, caption names 34 px and year 28 px, line-height 1.3. Voice: a kind friend, plain statements, never a question mark. Buttons are at least 96 px tall and 320 px wide; cards at least 180 px with 28 px gaps.

Entrance: at 0 ms the cream page and the patch of window light are already there; "Hello, Margaret" fades in from 300 ms over 900 ms; the button rises 12 px and fades in from 1200 ms over 800 ms, cubic-bezier(.2,.7,.2,1); complete by 2 s. Untouched, the light crosses the page in 90 s and the button edge breathes every 6 s. "Let's begin" deals the cards one at a time, 250 ms apart, each settling in 700 ms. Touch: a touch counts on release if the finger travelled under 30 px, however long it rested; input is then ignored for 700 ms, so double taps do nothing; a card already face up does nothing; a second finger or palm is ignored; zoom, selection, callouts and page bounce are disabled. Lying wide, 6 cards sit 3 by 2; standing tall, 2 by 3 (4 cards 2 by 2; 8 cards 4 by 2 or 2 by 4), re-flowing on rotation without losing the round. Keyboard: Tab and arrow keys move a 4 px tea-brown focus ring, Enter or Space turns a card or presses a button, A goes to the album during a round, J opens Joy's corner from Hello or the album, Escape closes it or the big photo.

Signature moment: the found pair. 0-900 ms the second card finishes turning; 900-1700 ms both edges glow in window light (with the chime, if on); 1700-3100 ms the whole uncropped photo lifts from the cards and grows to 86% of the screen's short side while the board fades behind cream at 85%; 3100-3900 ms the caption fades in beneath, for example "Margaret and her sister" and "1962", only if entered; at 5000 ms "Carry on" appears. It waits as long as the talk lasts. "Carry on" settles the photo back in 1000 ms; the pair stay face up, glowing, and the patch of light is one step warmer (opacity 0.18 at the start, 0.42 at the last pair). Hidden detail: the slant of the light follows the real clock, from 20 degrees at 13:00 to 50 degrees at 18:00.

Sound: off by default; "Soft chime" builds Web Audio only when switched on: two sine notes, 523 Hz then 784 Hz, 60 ms attack, 1.4 s decay, peak gain 0.12, on a found pair only. A quieter day: 2 pairs whatever the setting, cards face up from the start so nothing needs remembering (a touched card's edge thickens to 10 px; two different relax after 3 s), turns and growth become 600 ms cross-fades, the light stands still. Reduced motion: the same cross-fades and still light. Performance: no libraries, at most 8 cards and one full-size photo decoded at a time, pixel ratio capped at 2, CSS animation only, paused when hidden, Hello visible within 500 ms offline; a screen wake lock is held during a round and the album where available. Fallback without storage: photos live for the session and Joy's corner says "Photos will stay only until the tablet is closed." Accessibility: cards are buttons named by position and caption, a polite live region speaks "A pair" plus the caption, or "The cards have turned back over", no focus trap. Never: the words wrong, try again, lost or score; a question; anything opening by itself; any sound on an unmatched turn; flashing; network requests, accounts, adverts or tracking. Deliver as a single self-contained HTML file with no external files, fonts, libraries or network requests; the only images are those chosen in Joy's corner. Done when: (1) a round of 3 pairs is completed with slow single touches, and double taps or brushes change nothing; (2) from Hello to album no forbidden word, question mark or unprompted panel appears and unmatched turns are silent; (3) holding the corner mark for 2 s mid-round reaches the album with every photo of the round and "That was lovely."; (4) a rested photo never appears in later rounds, and 60 photos added in one go give different photos in the next round; (5) the next day, "Open the last album" shows yesterday's photos.

DESCRIPTION
A cream page with a slanted patch of afternoon sun drifting across it says "Hello, Margaret" above one wide gold button. Touching "Let's begin" deals six large linen-cream cards, each edged in gold, onto the page one at a time. A slow touch turns a card over to show a family photograph; when its twin is found, both edges glow, the whole photograph lifts off the cards and grows until it nearly fills the tablet, and the names and the year settle beneath it in big dark letters. Then it waits while Margaret and Joy talk, until "Carry on" is touched. Two different cards rest face up for three seconds and turn back without a sound or a word. With each pair the sunlight on the page grows a little warmer, and when the last is found, or when Joy quietly holds the teacup mark in the corner, every photograph of the round is laid out together as an album page under the line "That was lovely.", where it stays for as long as anyone wants to look. Behind the same mark, Joy's corner keeps the photographs, their groups, the ones that are resting, and the switch for a quieter day.

VISUAL TECHNIQUES
- Card turn as a 900 ms CSS 3D rotateY with preserved backfaces and ease-in-out; a 600 ms cross-fade variant for the quieter day and reduced motion
- Card construction: linen cream face, 6 px afternoon-gold border, 1.5 px toffee outline, two-layer warm shadow, 24 px radius, photo set with object-fit cover at 50% 30%
- Window light: a slanted four-pane shape in #FFE3A3 blurred 40 px, drifting on a 90 s CSS animation, opacity stepped from 0.18 to 0.42 by pairs found, angle taken from the device clock
- Found-pair glow as layered box-shadows in window light on a 2.4 s breathing keyframe; the same keyframe at lower strength for the partner hint after 3 unmatched turns
- Big-photo choreography with the Web Animations API: FLIP from the card's rectangle to a centred frame at 86% of the short side, cream veil at 85% over the board, staggered caption and button fades
- Album page as a CSS grid of thin gold-edged prints with seeded tilts of up to 1.5 degrees, sized so 2 to 4 photos fit without moving the page
- Tap filter on Pointer Events: act on release, 30 px travel limit, 700 ms lock-out, primary pointer only; touch-action none, user-select none, overscroll-behavior none
- Hold-to-open corner mark: a 2 s press timer with a ring drawn by stroke-dashoffset that fills while held and empties on release
- Photo import: multiple file input, createImageBitmap with imageOrientation from-image, canvas resize to 1600 px and 600 px JPEG at 0.85 quality, blobs in IndexedDB, object URLs revoked after use
- Selection by least-recently-shown timestamp with random tie-break, group filter, resting flag, and top-up from six inline SVG line drawings
- State in one versioned localStorage record (name, pairs, quieter day, chime, group, last album ids); session-only fallback when storage is refused
- Web Audio chime: two sine oscillators (523 Hz, 784 Hz) through a gain envelope, the audio context created only when the switch is turned on
- Orientation-aware grid re-flowing between 3 by 2 and 2 by 3 with a 600 ms position transition; Screen Wake Lock while a round or the album is open
- Accessibility layer: native buttons, polite live region, 4 px focus ring offset 4 px, prefers-reduced-motion mapped to the cross-fade set

INTERACTION MODEL
On Hello, touching "Let's begin" (or Enter or Space) deals the cards. In a round, a touch counts when the finger lifts, provided it moved less than 30 px; resting the finger for a long time is fine, a second tap within 700 ms does nothing, a card already face up does nothing, and a second finger or palm is ignored. The first touch turns one card, the second turns another: alike, they glow and the photo rises big with its caption, waiting until "Carry on" is touched (it appears at 5000 ms); different, they stay up 3 s and turn back silently. After 3 unmatched turns in a row the partner of the next turned card breathes at its edge. When the last pair is found the album appears; touching a photo there shows it big, "Back to the album" returns, "More photos" deals a new round. Holding the teacup mark for 2 s (a ring fills while held) opens Joy's corner from Hello or the album, and during a round goes straight to the album. In Joy's corner every control is an ordinary labelled field, switch or button, and "Close" or Escape returns to where it was opened. Keyboard: Tab and arrow keys move focus card by card, Enter or Space turns or presses, A goes to the album during a round, J opens Joy's corner from Hello or the album, Escape closes the big photo or Joy's corner. Rotating the tablet re-flows the cards without changing the round. "Soft chime" adds one two-note chime per found pair and nothing else. With "A quieter day" or reduced motion, cards and photos cross-fade in 600 ms and the light stands still; on a quieter day the cards also lie face up from the start.

What's inside this prompt

The sections of this prompt, in order, with their length.

1. Overview 176 words
2. Mood 134 words
3. Screens 416 words
4. Typography 75 words
5. Entrance 210 words
6. Signature moment 139 words
7. Sound 331 words
8. Description 201 words
9. Visual techniques 379 words
10. Interaction model 295 words

More prompts from the library

• Game prompt · 2,157 words

  Todos para Casa

  A cooperative forest board game on the tablet for my six-year-old twins, so nobody loses against her sister.

  Worked example (simulated interview)

• Website prompt · 2,281 words

  Falegnameria Valgrande

  A family joinery near Verona wants a site that shows its kitchens and stairs and lets people book the free measuring visit.

  Worked example (simulated interview)

• App prompt · 2,319 words

  Panjski dnevnik

  I keep 14 hives near Ljubljana and want to log inspections on my phone with gloves on.

  Worked example (simulated interview)