skills.rest
andregusman-raiz
andregusman-raizCOMMUNITY
Explore all skills by this author →
GitHub

ag-criar-cenario-ux-qat

Generate UX-QAT scenario artifacts from application screens and design tokens.

19|4|Updated Mar 7, 2026
Search Tags:#design-system#rubrics#visual-testing#interactions#ux-qat#screen-scenarios#golden-screenshots
One-click install
npx skills add https://github.com/andregusman-raiz/a-gusman-claude --skill ag-criar-cenario-ux-qat
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ag-criar-cenario-ux-qat
Source: https://github.com/andregusman-raiz/a-gusman-claude/tree/main/skills/ag-criar-cenario-ux-qat
Command: npx skills add https://github.com/andregusman-raiz/a-gusman-claude --skill ag-criar-cenario-ux-qat

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the creation of structured UX-QAT scenarios from application screens, enabling consistent visual QA coverage across dashboards, forms, and authentication flows.

Core Features & Use Cases

  • Map app screens to UX-QAT scenarios with visual rubrics, critical interactions, and anti-pattern documentation
  • Generate and organize artifacts: context.md, interactions.ts, journey.spec.ts
  • Automatically reference design tokens and project structure to align with the design system
  • Update and register scenarios in ux-qat.config.ts for continuous QA integration

Quick Start

Provide a ready-to-use UX-QAT scenario template for a given screen, including context, interactions, and test artifacts.

Frequently Asked Questions about ag-criar-cenario-ux-qat

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate UX-QAT scenario creation from application screens?▼

UX-QAT scenarios map application screens to visual rubrics, critical interactions, and anti-pattern documentation. They are needed to establish consistent visual QA coverage across dashboards, forms, and authentication flows.

How do I generate visual testing artifacts for design system screens?▼

Generate visual testing artifacts by referencing design tokens and project structure. This process updates ux-qat.config.ts and produces journey.spec.ts files to align visual testing directly with your design system.

Can I use this for projects with existing design tokens and concrete screens?▼

Yes, this works for projects with concrete screens and design tokens. It enables rubric selection, interaction mapping, and golden screenshot capture to align visual testing with the design system.

What is the best way to document anti-patterns during visual QA?▼

Document anti-patterns by mapping them within UX-QAT scenarios alongside interactions and golden screenshots. This updates ux-qat.config.ts to register anti-pattern documentation for continuous QA integration.

Related Skills

Explore More Design & Creative Skills→
andregusman-raizandregusman-raiz
19

ag-criar-cenario-qat

Translate user stories into four-layer QAT specifications with golden samples and anti-patterns.

Community
Advanced
1337hero1337hero
1

visual-audit

Screenshot a website and analyze visual composition against design principles.

Community
Intermediate
mikeparcewskimikeparcewski
8

visual-review

Assess visual design against a design system using a scoring rubric.

Community
Intermediate
joyce820309joyce820309

qa-only

Automate QA testing of web applications and generate structured reports with health scores, screenshots, and repro steps.

Community
Intermediate