On 2 August 2026, the transparency rules of the EU AI Act - Article 50 - became enforceable. Most teams I talk to are treating that as a legal problem: a policy to write, a box to tick, a risk for someone else to own. I think that reading is wrong, and I think it is wrong in a way that matters for anyone who designs software.
Article 50 does not live in a policy document. It lives in the interface. It is the moment a person needs to know they are talking to an AI and not a human. The moment a piece of content has to be marked as generated. The moment a system that reads emotion has to say so, before it acts. The moment an automated decision still has to pass through a person who can say no. Those are not clauses. They are buttons, labels, notices, and review steps - and someone has to design and build them.
So I did. The Article 50 UI Pattern Kit is four accessible React components for the parts of the Act that live in the UI. Open-source, MIT, WCAG 2.1 AA. This is the thinking behind each one, because the decisions are the interesting part.
AI disclosure that does not disappear
The easy version of "tell people it is AI" is a toast that shows once and slides away. That fails the moment the user scrolls, refreshes, or arrives mid-conversation. So the disclosure badge is persistent, and the full sentence is always available to a screen reader even when the visible label is shortened to a chip. Meaning never depends on the icon or the colour alone. Disclosure that a blind user cannot reach is not disclosure.
A label people and machines can read
Article 50(4) has no transition period for new content, which makes labelling generated media the most time-sensitive pattern in the kit. But a label a human can see is only half the job. The content label is also machine-readable - it carries a data attribute other software can detect - so provenance survives the screenshot, the repost, and the scrape. Visible for people, structured for machines.
An emotion notice that keeps its promise
If a system estimates how you feel, you are owed a notice before it acts on you - and the duty to inform does not end the second you dismiss it. So the emotion-recognition notice is a labelled region, never a modal that traps your focus, and when you acknowledge it, it collapses into a small persistent indicator rather than vanishing. You are told, and you stay told.
A gate where a human is the final authority
This is the ethical centre of the kit. AI proposes; a named human decides. The review gate holds an AI-suggested action until a person approves, edits, or rejects it. Confidence is shown as a number and a bar - never colour alone - and a low-confidence result is flagged with an icon and the words, so the handoff to human judgement is legible instead of buried under a fluent sentence.
Watching the four work as one
Patterns in isolation are easy to nod at. So I built a live demo where they run together as a single feature: a tone reader you can actually type into. It streams its reasoning before it commits, shows how sure it is, sends the uncertain calls to the gate, and - the part I am most attached to - refuses to answer when the input is nonsense, instead of fabricating a confident guess.
The model behind it is a small, deterministic classifier, not a live LLM, so every state including refusal can be shown on demand, at zero cost, with nothing leaving your browser. Swapping in a real model changes one function; the interface does not move.
Accessibility is not the decoration
Here is the part I will not soften: "accessible AI" that fails a contrast check is just a slogan. So I ran a real accessibility audit against the kit, it found genuine bugs, and I fixed every one - including a contrast failure the automated tool missed on a gradient background, which I only caught by doing the maths by hand. Zero violations, verified. If the pitch is that AI should be accountable and inclusive, the artifact has to survive the same test it asks everyone else to pass.
Where this leaves us
I keep landing on the same idea. AI does not remove the need for a human-accountable layer. It makes that layer the product - the surface where trust is either earned or quietly skipped. And that layer is interface work: disclosure, labelling, oversight, the honest refusal. It is exactly where a designer who codes should be standing.
The kit is free. Take the patterns, ship them, and tell me what breaks.
Open the Kit (opens the Article 50 Kit site)Try the live demo (opens the demo)