CtrlK
BlogDocsLog inGet started
Tessl Logo

ux-disruptivo

Use when designing new screens, redesigning existing UI, creating visual concepts, or improving interfaces in Nicolify. Executes a 7-phase creative Design Thinking workflow: defines user personas, frames problems, audits existing components (Shadcn UI + Tailwind CSS v4 + FSD architecture), researches SaaS UI patterns, proposes multiple distinct layout paradigms with ASCII wireframes and HTML mockups, iterates through dialogue, and delivers a complete UI-SPEC.md with component trees, data flow, responsive behavior, and interaction patterns — all following Nicolify's design tokens and codebase conventions. Triggers: 'diseña', 'rediseña', 'nueva pantalla', 'concepto visual', 'propuesta de diseño', 'UX', 'layout', 'prototipo', 'mejora la interfaz', 'wireframe', 'mockup', 'esquema de color', 'componentes de pantalla'.

75

Quality

92%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

The canonical home for this skill is ux-disruptivo in alpacapurpura/luana-method

SKILL.md
Quality
Evals
Security

Quality

Content

85%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is a well-structured, actionable 7-phase workflow with explicit gates, validation, and on-demand reference loading. Its only weaknesses are minor verbosity in the framing sections and HTML-preview guidance that leans procedural rather than copy-paste ready.

Suggestions

Trim the duplicated communication rules in the <role> block (language rules already implied by the trigger phrasing) to improve conciseness.

Add a small copy-paste HTML scaffold for the Phase 5 preview (DOCTYPE, tailwind CDN script, tailwind.config stub) so the preview step is fully executable rather than described.

Condense the 'Be transparent' parenthetical asides into a single fallback note to reduce token overhead.

DimensionReasoningScore

Conciseness

The body is mostly efficient — terse tables, bullet lists, and a quick-reference grid assume Claude's competence without explaining basics like 'what is a wireframe' — but a few sections (the repeated communication rules in the role block, the parenthetical 'Be transparent: *...*' asides) could be trimmed. Not a 5 because minor over-explanation remains.

4 / 5

Actionability

Concrete, executable guidance dominates: explicit glob paths ('frontend/src/components/ui/*.tsx', 'frontend/src/features/{domain}/components/**/*.tsx'), 'xdg-open /tmp/ux-preview-{timestamp}.html', the Tailwind CDN snippet, and exact UI-SPEC write paths. It falls just short of 5 because the HTML-preview steps are procedural prose rather than copy-paste-ready code and a few phases lean on guidance over commands.

4 / 5

Workflow Clarity

A clear 7-phase sequence carries explicit validation checkpoints and feedback loops: the Phase 1 gate ('Do NOT proceed to Phase 2 without answers to at least questions 1 and 2'), Phase 7's 'Verify real component names against codebase' glob before writing, the decisions_log iteration loop, and the navigation-support table for re-entering earlier phases. This matches the anchor requiring explicit validation steps and error-recovery feedback loops.

5 / 5

Progressive Disclosure

SKILL.md functions as a true overview with well-signaled, one-level-deep references: all five bundle files (design-system-inventory, proposal-format, ascii-mockup-guide, ui-spec-template, research-prompts) exist and are loaded on demand at the specific phase that needs them, with no nested-reference chains.

5 / 5

Total

18

/

20

Passed

Description

100%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description is exemplary: it states concrete capabilities, supplies a rich set of natural trigger phrases, explicitly answers both what and when, and carves out a clear niche with low conflict risk. It rewards specificity and completeness without resorting to vague fluff.

DimensionReasoningScore

Specificity

Lists multiple concrete actions across the workflow — 'defines user personas', 'audits existing components', 'proposes multiple distinct layout paradigms with ASCII wireframes and HTML mockups', 'delivers a complete UI-SPEC.md with component trees, data flow, responsive behavior' — giving comprehensive coverage rather than generic language.

5 / 5

Completeness

Opens with an explicit 'Use when designing new screens, redesigning existing UI...' (when) and follows with a detailed enumeration of the 7-phase workflow outputs (what), clearly and concretely answering both.

5 / 5

Trigger Term Quality

An explicit 'Triggers:' clause supplies 13 natural Spanish phrases a founder would actually say ('diseña', 'rediseña', 'nueva pantalla', 'prototipo', 'wireframe', 'mockup', 'esquema de color', 'componentes de pantalla'), with strong synonym coverage.

5 / 5

Distinctiveness Conflict Risk

Scoped tightly to Nicolify UI design with a distinct creative-vs-mechanical niche and language-specific Spanish triggers, making overlap with unrelated skills minimal.

5 / 5

Total

20

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
alpacapurpura/ap_sales_agent
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.