First-Time User Experience lens for UI review and design decisions. Evaluates every screen as if seeing the app for the first time.
Review your UI as a stranger seeing it for the first time.
An agent skill that catches every assumption, every friction point, every moment a new user would stop and think.
Runs in Claude Code, Codex CLI, Cursor, Zed, Windsurf, and Gemini CLI — anything that reads the AGENTS.md standard.
You built something great. But you can't unsee what you know.
Every label that "makes sense", every flow that "feels natural" — it only feels that way because you built it. First-time users don't have your context. And they won't ask. They'll just leave.
clarity-first applies a First-Time User Experience (FTUE) lens to every screen review. It asks the questions you've stopped asking.
Point it at a screen. It scans every element, then verdicts each one:
> Review my signup screen with clarity-first
Auditing signup screen as a first-time user…
Element Verdict Why
─────────────────────────────────────────────────────────
Logo + tagline keep Orients instantly
"Sync your workspace" cut Jargon. New user has no workspace yet
8-field form redesign Form wall before any value delivered
"Continue" (gray) fix Primary action not visually dominant
Cookie banner defer Hides the one thing that matters
Golden rule failed: a first-time user stops to think at field 3.
Suggested: email-only first step, defer the rest. 8 fields → 1.
That's the whole point — it returns what to cut, fix, or keep, not vague advice.
Claude Code:
/plugin marketplace add drmarceloclipi-star/clarity-first
/plugin install clarity-first@clarity-first
Restart Claude Code. Done.
Codex CLI · Cursor · Zed · Windsurf · Gemini CLI: grab the portable entrypoint files — no plugin system needed:
curl -fsSLO https://raw.githubusercontent.com/drmarceloclipi-star/clarity-first/main/AGENTS.md
curl -fsSLO https://raw.githubusercontent.com/drmarceloclipi-star/clarity-first/main/GEMINI.md
Drop in your project root, or in ~/.codex/ / ~/.gemini/ to enable it everywhere. Any agent that reads the open AGENTS.md standard picks it up automatically.
Symlinks the skill into ~/.claude/skills:
cargo install --git https://github.com/drmarceloclipi-star/clarity-first
clarity-first
Re-run clarity-first anytime to pull the latest.
Every element on every screen is tested against four questions:
| Question | Pass condition |
|---|---|
| Understand instantly? | No reading, thinking, or scanning required |
| Need this now? | First-time user needs this element on first visit |
| Too much? | Removing half would hurt the experience |
| Simpler possible? | No version exists with fewer steps, words, or choices |
One "no / yes / yes / yes" → redesign.
Mention any of these in your prompt and the skill activates:
clarity-first · FTUE · first-time user · onboarding · UX review · simplify UI
If a first-time user stops to think, the design is not finished.
/plugin update clarity-first@clarity-first
Cargo users: re-run clarity-first.
MIT
Built by
Dr. Marcelo Cavalcanti
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
npx claudepluginhub drmarceloclipi-star/clarity-first --plugin clarity-firstProblem-definition lens. Asks questions until the problem is sharply defined, then hunts the web for evidence of good constraints and existing solutions.
UI/UX design intelligence. 67 styles, 161 palettes, 57 font pairings, 25 charts, 15 stacks (React, Next.js, Vue, Svelte, Astro, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Nuxt, Jetpack Compose). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient.
Comprehensive skill pack with 66 specialized skills for full-stack developers: 12 language experts (Python, TypeScript, Go, Rust, C++, Swift, Kotlin, C#, PHP, Java, SQL, JavaScript), 10 backend frameworks, 6 frontend/mobile, plus infrastructure, DevOps, security, and testing. Features progressive disclosure architecture for 50% faster loading.
This skill should be used when users need to generate ideas, explore creative solutions, or systematically brainstorm approaches to problems. Use when users request help with ideation, content planning, product features, marketing campaigns, strategic planning, creative writing, or any task requiring structured idea generation. The skill provides 30+ research-validated prompt patterns across 14 categories with exact templates, success metrics, and domain-specific applications.
Develop, test, build, and deploy Godot 4.x games with Claude Code. Includes GdUnit4 testing, web/desktop exports, CI/CD pipelines, and deployment to Vercel/GitHub Pages/itch.io.
Upstash Context7 MCP server for up-to-date documentation lookup. Pull version-specific documentation and code examples directly from source repositories into your LLM context.
A growing collection of Claude-compatible academic workflow bundles. Covers scientific figures, manuscript writing and polishing, reviewer assessment, citation retrieval, data availability, paper reading, literature search, response letters, paper-to-PPTX conversion, and evidence-grounded Chinese invention patent drafting. Rules are organized as reusable skill folders with explicit workflows and quality checks.