Immediate result: WCAG 2.2 issues found in your HTML or design description, with the success criterion and fix for each.
Problem it solvesAccessibility issues are found late, by users who can't use the product.
<div onclick='buy()'>Buy</div> · grey #999 text on white · icon-only close button
div as button — 2.1.1 Keyboard (A) → use <button type='button'>
#999 on #fff = 2.85:1 — fails 1.4.3 (AA, needs 4.5:1) → use #595959 (7:1)
Icon-only close — 4.1.2 Name, Role, Value → add aria-label='Close'
Accessibility problems are usually discovered late, by people who can't use the product. This skill checks HTML or a detailed screen description for contrast, text alternatives, labels, focus order, keyboard access, target size and motion, maps each issue to a WCAG 2.2 success criterion and level, and gives the fix — calculating contrast ratios when you provide colours. It's honest about what can't be judged from text and lists the manual tests, such as a screen-reader pass, that you still need to run. To use it, paste the skill into your assistant and send HTML code or a detailed description of a screen (colours, sizes, labels, interactions).
# Skill: Accessibility checker
You are running the "Accessibility checker" skill for me. I work as: Designer / front-end developer. What I need from you: WCAG 2.2 issues found in my HTML or design description, with the success criterion and fix for each.
## When I send you HTML code or a detailed description of a screen (colours, sizes, labels, interactions)
1. Check contrast, text alternatives, labels, focus order, keyboard access, target size and motion.
2. Map each issue to a WCAG 2.2 success criterion and level (A, AA).
3. Give the fix (code or design change).
4. List what needs manual testing with a screen reader.
## Reply in this format
- Issues table: issue, WCAG criterion, level, fix
- Fixed code (if HTML given)
- Manual tests to run
## Rules
- Compute contrast ratios when hex colours are given.
- Say what can't be judged from text alone.
- Use only the facts I give you; mark anything you had to assume with [ASSUMPTION].
- If something essential is missing, ask me one short question, then continue.
- No preamble or filler: start with the result.
Confirm you're ready in one line, then wait for me to send HTML code or a detailed description of a screen (colours, sizes, labels, interactions).Then sendHTML code or a detailed description of a screen (colours, sizes, labels, interactions). For example: <div onclick='buy()'>Buy</div> · grey #999 text on white · icon-only close button
Upload it to Claude, add it to ChatGPT's Codex app, clone it into Claude Code, or download the SKILL.md for any agent. Full guide with screenshots →
Download the ZIP and upload it in Claude. Claude then uses the skill on its own whenever a request matches.
Download ZIP
OpenAI's Codex app reads the same SKILL.md format. Copy the skill into your Codex skills folder:
$ git -c http.version=HTTP/1.1 clone https://scienceofapps.com/skills/ai-skills.git
$ cp -r ai-skills/accessibility-checker ~/.codex/skills/
Clone the library and copy this skill into your Claude Code skills folder.
$ git -c http.version=HTTP/1.1 clone https://scienceofapps.com/skills/ai-skills.git
$ cp -r ai-skills/accessibility-checker ~/.claude/skills/~/.claude/skills/ for all projects, or .claude/skills/ inside one project.Download the skill file and put it in a folder named after the skill.
Download SKILL.md~/.claude/skills/accessibility-checker/SKILL.md.Repositoryscienceofapps.com/skills/ai-skills.git · all 200 skills, one folder each, plain git over HTTPS
Accessibility issues are found late, by users who can't use the product. The skill fixes that: wCAG 2.2 issues found in your HTML or design description, with the success criterion and fix for each.
Copy the skill and paste it as the first message of a new chat, then send your input. To keep it, paste it into a ChatGPT Project or custom GPT, a Claude Project or a Gemini Gem, or upload the SKILL.md file as a Claude Skill.
Send HTML code or a detailed description of a screen (colours, sizes, labels, interactions). If something essential is missing, the skill asks you one short question and then continues.
Yes. It's free to copy, use and adapt, with no sign-up, and works in the free versions of ChatGPT, Claude, Gemini and Copilot.
ProblemUsability tests ask leading questions and test the wrong tasks.
Prototype of a medicine-reminder app for people over 60
Task: 'Your doctor just added a tablet to take after dinner. Set it up so you won't forget.'
Not: 'Tap Add Medicine.'
Probe: 'What did you expect to happen there?'
Immediate resultA moderated test script with screener, warm-up, realistic tasks, neutral probes and a debrief.
ProblemDesigners working alone lack structured critique and miss problems a team would spot.
Pricing page: 4 tiers side by side, 'Most popular' on the most expensive, 30 features per tier
Goal check: help small teams pick a plan — 120 feature rows work against that.
Issue: 'Most popular' on the top tier — if untrue, it's fake social proof.
Alternative: 3 tiers, 6 key differences, full comparison behind 'See all features'.
Immediate resultA structured critique against the design's goal: what works, what doesn't and why, with options.
ProblemPersonas are invented in workshops and describe stereotypes, not behaviour.
12 interviews with people who split bills with flatmates
'The Ledger Keeper' (5 of 12): pays first, tracks in Splitwise, chases everyone.
Quote: 'I'm always the one asking for ₹340 back.'
Implication: one-tap reminders that don't make the ledger keeper look petty.
Immediate resultBehaviour-based personas with goals, context, frustrations and quotes drawn from your research.
All 12 design & ux skillsAll 200 skillsRead it in the articleProve it: AI for UX/UI Designers Certification (free test)
60 research-backed principles in 6 categories — what each one means, why it works on the human brain and how to use it on your own screens. Written by Sushant Singh, founder of Science of Apps, who has scaled consumer apps to lacs of users and spent 10+ years leading product across startups and digital businesses in the US, EU & India.
110 real paywalls from top apps, taken apart, rated out of 5 and decoded with the Laws of UX — plus the frameworks, copy and checklists to ship your own. By Sushant Singh, founder of Science of Apps.