Histórias do Juca

Screenshots

screenshots · juca1 / 6

Overview

The reader reads or listens to a scene and picks, with real buttons, what happens next; each story is a branching graph of nodes with different endings. The hero is Juca, a young, blind alligator from the Cachoeira River in Joinville, Brazil, who finds treasures using smell and hearing — the protagonist himself mirrors the audience the project wants to welcome.

The first story, Juca e a Caça ao Tesouro do Rio, branches into two paths and two endings. The second, Juca e a Corrida do Churrasco, introduces lightweight state (money and time) that changes as you choose and unlocks or hides options — a race against the clock (and hunger) to reach a barbecue across town.

The non-negotiable premise is accessibility first: the experience must genuinely work with screen readers (NVDA, JAWS, VoiceOver, Narrator) and keyboard navigation — not merely "be compatible." Choices are real buttons reachable by Tab and fired with Enter/Space; on every scene change, focus moves to the new text so the screen reader announces it; there is a skip link, high contrast, an always-visible focus ring, and no information conveyed by color alone. In-browser narration (Web Speech API, pt-BR) with speed control, a native share button, and per-scene illustrations round out the experience.

Architecturally, the engine is fully separated from the content: the React components are generic and story-agnostic, while each story is self-contained under stories/<slug>/ (a JSON node graph, cover art, and the source script). A graph validator (pnpm validate-stories) guarantees no node is unreachable, choice-less, or missing image alt text — keeping accessibility verifiable with every new story that ships.

Highlights