reversa-screen-translator

Translate legacy UI screens into executable target specifications with adapter-formatted contracts.

Updated May 16, 2026
One-click install
npx skills add https://github.com/ricardops34/rcg-crm --skill reversa-screen-translator
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: reversa-screen-translator
Source: https://github.com/ricardops34/rcg-crm/tree/main/.agents/skills/reversa-screen-translator
Command: npx skills add https://github.com/ricardops34/rcg-crm --skill reversa-screen-translator

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Replaces improvisation during UI migration by converting legacy screen behavior and text into executable, mode-aware specifications that a codifier can implement without guessing layout, hierarchy, or messages.

Core Features & Use Cases

  • Two-phase screen translation with mandatory human mode selection: enforces a deliberate choice between literal, modernized, or hybrid translation before generating specs.
  • Executable target screen generation: produces target_screens.md with adapter-specific spec formats and required state/event contracts.
  • Parity support via golden files (when available): emits golden/ outputs plus manifest.yaml for constructive parity tests using the legacy oracle output.
  • Deviation tracking and gating: records divergences in screen_deviation_log.md and blocks handoff to the Inspector until deviations are resolved.
  • Strict read-only behavior for legacy content: limits writes to _reversa_sdd/migration/, _reversa_sdd/screens/, and derived design tokens.

Quick Start

Run the command /reversa-screen-translator to translate the legacy screens into target_screens.md after you confirm the translation mode (literal, modernized, or hybrid).

Frequently Asked Questions about reversa-screen-translator

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

FAQPage Schema
How do I translate legacy UI screens into executable specs for a NestJS Angular migration?

You translate legacy UI screens into executable specs by enforcing a human-approved translation mode and generating adapter-formatted contracts. This converts legacy screen behavior into target_screens.md specifications that a codifier can implement without guessing layout or hierarchy.

What is golden file parity testing and when do I need it for UI migration?

Golden file parity testing is a process that emits golden/ outputs and manifest.yaml for constructive parity tests using legacy oracle output. You need it during UI migration to validate that modernized screens preserve the original legacy behavior.

How do I generate design-system tokens from legacy screens during migration?

You generate design-system tokens by applying a screen translation mode—literal, modernized, or hybrid—to the legacy UI. This translation preserves textual content while deriving target specifications and design tokens in a structured workflow.

Does the screen translation workflow allow modifying the original legacy source files?

No, the screen translation workflow enforces strict read-only behavior for legacy content. Writes are limited to designated migration and screen directories, plus derived design tokens, ensuring the original legacy source remains untouched.

What happens if there are deviations between the legacy screen and the target specification?

Deviations between the legacy screen and target specification are recorded in screen_deviation_log.md. This deviation logging gates the workflow by blocking handoff to the Inspector until all divergences are fully resolved.

Can I use screen translation for a partial UI migration without rewriting everything?

Yes, you can use the hybrid translation mode for partial UI migration. This mode-aware approach allows you to mix literal and modernized specs, ensuring textual content is preserved while adapting specific screen elements as needed.