Agent skill · Frontend

draft-recon

UI and UX reconnaissance — scan existing frontend routes, components, navigation, and flows to understand the current UX state before designing. Use when asked to "understand the current UI", "what UX patterns exist", "map the navigation", "what screens exist", or before starting any flow or wireframe work.

jeremylongshoregithub.com/jeremylongshoreGitHub ↗
claude-codecan modify filesMIT
Install
npx skills add jeremylongshore/claude-code-plugins-plus-skills --skill draft-recon --agent claude-code

Same command for any agent — swap --agent for codex, cursor, copilot.

Facts
Files in the skill folder: 2
SKILL.md size: 4 KB
Bundled scripts: none
Version: 0.6.4
Declared author: tonone-ai <hello@tonone.ai>
Allowed tools: ReadBashGlobGrepWebFetchWebSearchAskUserQuestion
Path: plugins/ai-agency/tonone/skills/draft-recon/SKILL.md
Open the folder on GitHub →
Where it comes from
Stars: 2,596
Language: Python
Read our review of the source →

Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.

From the SKILL.md

# UX Reconnaissance You are Draft — the UX designer on the Product Team. Map the current UX before you redesign anything. Follow the output format defined in docs/output-kit.md — 40-line CLI max, box-drawing skeleton, unified severity indicators, compressed prose. ## Steps ### Step 0: Detect Environment Scan for frontend indicators: ```bash # Routes / pages find . -name "*.tsx" -o -name "*.jsx" -o

More from claude-code-plugins-plus-skills
All skills →
building-automl-pipelinesBuild automated machine learning pipelines with feature engineering, model selection, and…Data & Analyticsprocessing-computer-vision-tasksProcess images using object detection, classification, and segmentation. Use when requesting…AI & Agentsvalidating-ai-ethics-and-fairnessValidate AI/ML models and datasets for bias, fairness, and ethical concerns. Use when auditing AI…AI & Agentsorchestrating-multi-agent-systemsExecute orchestrate multi-agent systems with handoffs, routing, and workflows across AI providers.…Workflow & Productivityrunning-clustering-algorithmsAnalyze datasets by running clustering algorithms (K-means, DBSCAN, hierarchical) to identify data…Data & Analyticspreprocessing-data-with-automated-pipelinesProcess automate data cleaning, transformation, and validation for ML tasks. Use when requesting…Data & Analytics
About this skill
What does the draft-recon skill do?

UI and UX reconnaissance — scan existing frontend routes, components, navigation, and flows to understand the current UX state before designing. Use when asked to "understand the current UI", "what UX patterns exist", "map the navigation", "what screens exist", or before starting any flow or wireframe work.

How do I install it?

Run `npx skills add jeremylongshore/claude-code-plugins-plus-skills --skill draft-recon --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.

Where does this skill come from?

From jeremylongshore/claude-code-plugins-plus-skills, a repository with 2,596 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.

Is a popular skill a good skill?

Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.

Keep going
All skills →
The full catalog, by category and by tool.
Open Source Radar →
The repositories these skills come from, watched daily.
The people behind them →
Makers and builders across the ecosystem.