skills.rest
trabian
trabianOFFICIAL
Explore all skills by this author →
WebsiteGitHub

Fluxwing Screenshot Importer

Convert UI screenshots into uxscii components and screens.

18|1|Updated Oct 13, 2025
Search Tags:#automation#vision#generation#screenshot#import#uxscii
One-click install
npx skills add https://github.com/trabian/fluxwing-skills --skill fluxwing-screenshot-importer-trabian
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Fluxwing Screenshot Importer
Source: https://github.com/trabian/fluxwing-skills/tree/main/skills/fluxwing-screenshot-importer
Command: npx skills add https://github.com/trabian/fluxwing-skills --skill fluxwing-screenshot-importer-trabian

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates converting UI screenshots into uxscii components and screens by coordinating vision analysis and component generation agents.

Core Features & Use Cases

  • Vision phase: 3 parallel vision agents handle layout, components, and visual properties.
  • Component generation: In parallel, generate atomic and composite components.
  • Screen generation: Delegates to Fluxwing Screen Scaffolder for end-to-end screen creation.

Quick Start

Provide a screenshot path and let Fluxwing Screenshot Importer orchestrate the end-to-end conversion.

Frequently Asked Questions about Fluxwing Screenshot Importer

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

FAQPage Schema
How do I convert UI screenshots into uxscii components automatically?▼

Screenshot Importer transforms UI screenshots (PNG, JPG, WebP, GIF) into uxscii components and screens by analyzing layout structures, detecting components, and extracting visual properties. Upload your screenshot and the Skill orchestrates vision analysis and generates atomic and composite components automatically.

Can I import design screenshots from Figma or other design tools?▼

Yes. Screenshot Importer accepts UI screenshot images in PNG, JPG, WebP, and GIF formats. Export your design as a screenshot from any design tool, then import it to generate uxscii components and screen definitions.

What happens after screenshots are converted to uxscii components?▼

Generated components and screens are written to your project workspace. The Skill delegates full screen creation to Fluxwing Screen Scaffolder, enabling end-to-end conversion from screenshot to deployable uxscii screens.

How does the vision analysis work for detecting UI layouts?▼

Screenshot Importer uses a Vision Coordinator Agent that spawns three parallel vision agents to analyze layout structures, identify components, and extract visual properties. Results merge into a unified data structure that generates components and screens.

Do I need to manually edit components after import?▼

Screenshot Importer generates components and screens automatically with validation. While the Skill writes production-ready artifacts to your workspace, you can review and refine generated components as needed for your project.

What file formats and image types does Screenshot Importer support?▼

The Skill processes PNG, JPG, WebP, and GIF image formats. Provide a screenshot path and Screenshot Importer handles vision analysis and component generation across all supported formats.

Related Skills

Explore More Design & Creative Skills→
AZANIRAZANIR
2

qa-testcase-from-ui

Generate test cases from UI screenshots and Figma exports via vision analysis.

Community
Intermediate
jackspacejackspace
16

Fluxwing Screenshot Importer

Import UI screenshots and convert them to the uxscii standard via vision agents.

Community
Advanced
trabiantrabian
18

Fluxwing Screen Scaffolder

Orchestrate multi-agent assembly of .uxm screens from uxscii components.

Official
Advanced
DojoGenesisDojoGenesis
2

figma-to-code

Convert Figma designs into HTML, Svelte, React, or Vue components.

Community
Advanced