skills.rest
Helcio-Nogueira
Helcio-NogueiraCOMMUNITY
Explore all skills by this author →
GitHub

reversa-visor

Documents legacy system interfaces from screenshots by extracting components, layouts, and navigation flows.

Updated Mar 23, 2026
Search Tags:#screenshots#mermaid#specification#reverse engineering#ui documentation#legacy system#navigation flow
One-click install
npx skills add https://github.com/Helcio-Nogueira/Painel_Inteligente_Hackaton_2026 --skill reversa-visor-helcio-nogueira
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: reversa-visor
Source: https://github.com/Helcio-Nogueira/Painel_Inteligente_Hackaton_2026/tree/main/.agents/skills/reversa-visor
Command: npx skills add https://github.com/Helcio-Nogueira/Painel_Inteligente_Hackaton_2026 --skill reversa-visor-helcio-nogueira

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Documenting the user interface of a legacy system is slow and error-prone when the system cannot be run or its source code is unavailable. This Skill turns user-provided screenshots into structured interface documentation without requiring the system to be running. ## Core Features & Use Cases - Screen Inventory: Catalogs each screenshot with its name, purpose, state (loading, empty, filled, error), and usage context. - Element Extraction: Identifies forms, tables, navigation menus, and feedback elements (modals, messages, tooltips) from images. - Flow and State Mapping: Maps navigation flows between screens in Mermaid and compares the same screen across different states. - Unit Mapping: Assigns each screen to a specification unit based on configurable granularity (module, endpoint, use-case, feature, hybrid, or custom). - Use Case: A team reverse-engineering a legacy ERP sends screenshots of its main screens; the Skill produces per-unit screen specs, a global inventory, and a Mermaid navigation flow diagram. ## Quick Start Send screenshots of the legacy system's main screens and ask the agent to document the interface, mapping each screen to its specification unit.

Frequently Asked Questions about reversa-visor

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

FAQPage Schema
How do I document a legacy system UI without access to the running system?▼

Provide screenshots of the system's screens to the Skill, which extracts components, layouts, states, and navigation flows from the images. It generates per-unit screen specifications, a global inventory, and a Mermaid flow diagram without executing the system.

How are screenshots mapped to specification units?▼

Each screen is mapped to a unit based on the granularity setting in the [specs] config section: module, endpoint, use-case, hybrid, feature, or custom folders. When mapping is ambiguous between two units, the Skill asks the user before saving.

What output files does screenshot-based UI documentation generate?▼

Per unit it saves the original screenshots under screenshots/ and a screens.md spec file. Globally it creates ui/inventory.md listing all screens with their units and ui/flow.md with a Mermaid navigation diagram.

Does this Skill work with any AI agent or model?▼

It requires an agent compatible with Agent Skills and a model with image support, since screenshots must be visually analyzed. It declares compatibility with Claude Code, Codex, Cursor, and Gemini CLI.

What happens if I send the same screenshot twice?▼

The Skill follows a non-destructive directive and never overwrites existing files. Duplicate screens are saved with a numeric suffix, such as tela.png and tela-2.png.

Related Skills

Explore More Software Engineering Skills→
lacsousalacsousa

reversa-visor

Documents legacy system interfaces from screenshots by extracting components, layouts, and navigation flows.

Community
Intermediate
Pabloprogramador23Pabloprogramador23

reversa-writer

Generate requirements.md, design.md, and tasks.md per legacy unit.

Community
Advanced
RuggeryRuggery

reversa-data-master

Document legacy database schemas, relationships, and business rules into structured Markdown artifacts.

Community
Intermediate
JoeyJoziahJoeyJoziah

peekaboo

Automate macOS UI capture, inspection, and interaction workflows via the Peekaboo CLI.

Community
Advanced