skills.rest
artosetrov
artosetrovCOMMUNITY
Explore all skills by this author →
GitHub

ds-screen-builder

Map Swift view code to DS components and assemble Figma screens.

Updated Mar 5, 2026
Search Tags:#automation#figma#swift#design-system#screen-builder#ds-components
One-click install
npx skills add https://github.com/artosetrov/iron-fist-arena-backend --skill ds-screen-builder
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ds-screen-builder
Source: https://github.com/artosetrov/iron-fist-arena-backend/tree/main/.claude/skills/ds-screen-builder
Command: npx skills add https://github.com/artosetrov/iron-fist-arena-backend --skill ds-screen-builder

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

DS Screen Builder translates Swift view code into DS-compliant Figma screens, mapping UI to DS components, applying tokens and styles, and assembling frame-by-frame with proper auto-layout and bindings.

Core Features & Use Cases

  • Reads Swift view code and maps UI to DS components
  • Assembles frame-by-frame in Figma using only DS components, tokens, and styles
  • Use Case: Build any screen in Figma directly from Swift, ensuring consistency with the DS system

Quick Start

Provide the Swift view file for the target screen and run the builder to generate a DS-compliant Figma screen.

Frequently Asked Questions about ds-screen-builder

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

FAQPage Schema
How do I convert Swift view code into a Figma screen?▼

To convert Swift view code into a Figma screen, the builder reads your Swift file, maps UI elements to design system components, and assembles the frame automatically with correct auto-layout and bindings.

Can I build Figma screens from Swift using only design system components?▼

Yes, you can build Figma screens from Swift using only design system components. The builder validates tokens and places DS components frame-by-frame to ensure strict consistency with your design system.

What is the best way to map Swift UI code to Figma design system components?▼

The best way to map Swift UI code to Figma design system components is by reading the Swift view, validating design tokens, and automatically applying the correct DS components, styles, and frame auto-layout.

Do I need to load design system context before generating Figma screens from Swift?▼

Yes, you need to load design system context before generating Figma screens from Swift. The builder requires prerequisites like reading FIGMA_SCREEN_RULES and ensuring DS context is loaded before screen creation.

Does the Swift to Figma screen builder apply auto-layout and bindings automatically?▼

Yes, the Swift to Figma screen builder applies auto-layout and bindings automatically. It reads Swift view code and assembles frame-by-frame in Figma using correct auto-layout and component bindings.

What are the limitations of building Figma screens directly from Swift view code?▼

A limitation of building Figma screens from Swift view code is the strict prerequisite of having a loaded design system context and FIGMA_SCREEN_RULES, as it only assembles screens using existing DS components and tokens without creating new ones.

Related Skills

Explore More Design & Creative Skills→
MihaiOnSoftwareMihaiOnSoftware
1

load-rules

Load user rules from ~/.ai/rules/ in defined order.

Community
Basic
codesour-designcodesour-design

source-command-handoff-figma

Convert product flow requirements into structured Figma handoff designs.

Community
Advanced
artosetrovartosetrov

ds-figma-sync

Detect and fix mismatches between Swift design tokens and Figma DS files.

Community
Advanced
AbsolutelySkilledAbsolutelySkilled
207

figma-to-code

Convert Figma design frames into HTML, CSS, and React components.

Official
Advanced