Layout Architect

This skill specializes in Visual Reverse Engineering. It analyzes input images or brand guidelines and generates the precise code required to reproduce that design.

Capabilities

1. Slide & Brand Reproduction:

   • Image to Marp CSS: Creates custom themes for Markdown-to-slide conversion.
   • Brand-to-Theme: Translates research (colors, logos) into a Marp CSS file AND a shared color palette JSON in knowledge/templates/themes/palettes/ following the visual_harmony_guide.md.
   • Image to Editable PPTX: Generates python-pptx scripts to build native PowerPoint slides with editable text and shapes.

2. UI Reproduction:

   • Image to Code: Converts UI screenshots into HTML/Tailwind, React, or pure CSS.

Workflow

1. Asset Extraction (If input is PPTX)

If the user provides a .pptx file instead of an image, first extract the media assets to "see" the design.