skills.rest
JubaKitiashvili
JubaKitiashviliCOMMUNITY
Explore all skills by this author →
Website𝕏@jubakitiashviliGitHub

erne-debug-visual

Capture and analyze mobile app screenshots to identify and fix visual UI issues.

41|4|Updated Mar 10, 2026
Search Tags:#react-native#ui-testing#expo#visual-debugging#mobile-app#screenshot-analysis#figma-compare
One-click install
npx skills add https://github.com/JubaKitiashvili/everything-react-native-expo --skill erne-debug-visual
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: erne-debug-visual
Source: https://github.com/JubaKitiashvili/everything-react-native-expo/tree/main/.claude/skills/erne-debug-visual
Command: npx skills add https://github.com/JubaKitiashvili/everything-react-native-expo --skill erne-debug-visual

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Visual UI issues in mobile apps can be subtle and costly. This skill enables automated visual debugging by capturing, analyzing, and fixing UI defects using a multimodal vision agent.

Core Features & Use Cases

  • Screenshot capture from running simulator/emulator and analyze visual issues across layouts, typography, color, and spacing.
  • Compare app UI with Figma exports to detect deltas.
  • Navigate to specific screens, perform checks, and propose minimal, safe fixes for UI inconsistencies.

Quick Start

Use the erne-debug-visual command to automatically capture and analyze a screenshot from your running app.

Frequently Asked Questions about erne-debug-visual

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

FAQPage Schema
How do I debug visual UI issues in a React Native app?▼

Visual UI debugging captures screenshots from running simulators and analyzes layout, typography, color, and spacing defects to propose safe fixes. It works by executing a deterministic workflow: capture, analyze, propose fixes, and summarize results with categorized severity.

Can I compare my mobile app UI directly against Figma exports?▼

Yes, you can compare mobile app UI against Figma exports. The visual debugger captures app screenshots, detects deltas against Figma designs, and proposes minimal fixes to resolve visual inconsistencies in React Native and Expo projects.

Does visual UI debugging work with Expo projects?▼

Yes, visual UI debugging supports Expo projects. It auto-captures screenshots from running simulators, navigates to specific screens, and analyzes visual issues across layouts and typography for React Native and Expo environments.

How do I automate screenshot analysis for mobile app layouts?▼

Automate screenshot analysis by running a visual-debugger command to auto-capture screens from running simulators. The agent analyzes screenshots, identifies visual problems, and summarizes results with categorized severity levels for mobile apps.

What is the workflow for fixing mobile app visual defects automatically?▼

The workflow executes a deterministic sequence: capture screenshots, analyze visual issues, propose minimal safe fixes, and summarize results with categorized severity. This handles layout, typography, color, and spacing inconsistencies in mobile apps.

Related Skills

Explore More Software Engineering Skills→
krzemienskikrzemienski
2

react-native-validation

Automate end-to-end validation of React Native apps across iOS and Android.

Community
Advanced
dagbadagba
3

ios-debugger-agent

Build, launch, and debug iOS apps on a booted simulator with UI interaction and log capture.

Community
Advanced
takapomtakapom

figma

Extract Figma design data and generate React Native components and design tokens.

Community
Advanced
r3dlexr3dlex
2

visual-verdict

Compare UI screenshots against reference images to detect layout, style, and content discrepancies.

Community
Intermediate