Robo-Friend Game

How to play

Robo is a single button with a small state machine behind it. There is nothing to install and nothing to sign up for — the whole toy lives in this page.

1. Say hello. Click or tap the robot. With a keyboard, focus the robot and press Space or Enter — it is a real button, so both work by default.
2. Watch the reaction. Each activation rolls one of four outcomes: Robo waves, Robo says one of twelve friendly lines, Robo asks a yes/no question, or Robo starts one of the two mini-games.
3. Answer when asked. Yes/no questions and mini-game rounds render real buttons under the stats. Pick one; feedback appears on the chest screen and in the announcement region.
4. Play a round. Shape match shows a target shape on the chest screen and asks you to tap the matching name; Quick math shows a small addition or subtraction and offers four answers. Both last 20 seconds and count how many you get right.
5. Mind the battery. Every interaction costs a few percent of energy and energy trickles back up by about one percent every four seconds. When it is too low, Robo refuses to play until you press Rest, which refills it to 100 percent.
6. Track the friendship bar. Warm greetings, good answers and finished rounds raise friendship towards 100 percent. It is flavour, not a score you can lose — wrong answers cost you nothing but the time on the clock.
7. Clear it if you want. Reset asks for confirmation and then deletes the saved friendship and energy from this browser.

What the mini-games teach

Honestly: not much, and that is fine. Both mini-games are 20-second warm-ups rather than a curriculum. Shape match is simple visual matching — a triangle, a circle or a diamond is drawn on the chest screen and you pick the matching word, which is light practice at holding a shape in mind while scanning a row of options. Quick math is single-digit addition and subtraction with four choices, the kind of arithmetic you already do when splitting a bill.

Neither game adapts its difficulty, tracks accuracy over time, or claims to improve anything measurable. There are no levels, streaks or rewards beyond the friendship bar going up, and the answers are generated fresh each round with no stored history. Treat the whole page as a two-minute break: the interesting part is the interaction loop, not the difficulty.

Accessibility and reduced motion

Every control on this page is a real <button> element, so it is reachable with Tab, activates with Space or Enter, and shows the site's normal focus ring. The robot itself is one labelled button; the drawing inside it is decorative and hidden from assistive technology, so screen-reader users hear "Interact with Robo the robot" rather than a pile of shapes.

State changes are written to a visually hidden aria-live="polite" region: "Robo waves at you", "Correct! Friendship 42 percent", "Not quite. The answer was 9". The visible speech bubble carries the same text but is marked aria-hidden so nothing is announced twice. The two progress bars expose role="progressbar" with live aria-valuenow values, and the sound toggle reports its state with aria-pressed.

The page respects prefers-reduced-motion: reduce in two ways. The site-wide stylesheet already collapses CSS animations and transitions, and the script additionally checks the media query before creating anything: the confetti burst is skipped entirely rather than merely shortened, and the floating, blinking and waving animations are switched off. Nothing in the game depends on animation — the shapes, the numbers, the timer text and the announcements all carry the same information in static form.

The layout is fluid: the robot is an inline SVG that scales with its column and never overflows a 360 px viewport, the stats stack into a single column, and the answer buttons wrap into a grid of at least 120 px. No external assets are loaded — no fonts, images, scripts or audio files — so the toy works fully offline.