sigil-social-layouting

Generate social ad layout specs as LayoutSpec JSON from creative intent and LayoutDNA.

Updated Oct 25, 2025
One-click install
npx skills add https://github.com/tensalir/Loop-Vesper --skill sigil-social-layouting
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: sigil-social-layouting
Source: https://github.com/tensalir/Loop-Vesper/tree/main/src/lib/skills/sigil-social-layouting
Command: npx skills add https://github.com/tensalir/Loop-Vesper --skill sigil-social-layouting

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

Generates on-brand social media layout specs (structure only) from creative intent and candidate LayoutDNA. Use when placing text and CTA on a base visual for paid social assets, ensuring safe zones, hierarchy, and brand consistency. Output is LayoutSpec JSON for Figma export.

Core Features & Use Cases

  • Generate layout structure for social ad creatives: specify text blocks, typography, and hierarchy without pixel rendering.
  • Validate and repair layouts against safe zones, brand rules, and platform specs, given a brief and optional LayoutDNA candidates.
  • Interpret fuzzy brand intent into concrete positions and scales, with outputs suitable for Figma export to designers.

Quick Start

Provide a single LayoutSpec JSON that places text blocks within safe zones according to the brief and candidate LayoutDNA.

Frequently Asked Questions about sigil-social-layouting

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

FAQPage Schema
How do I generate brand-safe social media layout specifications for paid ads?

Generate social media layout specifications by processing creative intent and candidate LayoutDNA. The system outputs a LayoutSpec JSON containing text blocks, normalized bounding box coordinates, typography hierarchy, and validated color usage for brand consistency.

Can I validate safe zones and typography for 9x16 and 1:1 social ad formats?

Yes, you can validate safe zones and typography hierarchy for 9x16, 1:1, and 4x5 social ad formats. The system checks text block positions against platform specifications and brand rules to ensure compliance.

How do I export social ad layout structures to Figma without pixel rendering?

Export social ad layout structures to Figma using the LayoutSpec JSON output. This JSON contains normalized bounding box coordinates, fontFamily, weight, scale, and color data that maps directly into Figma design layers.

What is LayoutDNA and how does it map fuzzy brand intent into concrete ad positions?

LayoutDNA interprets fuzzy brand intent into concrete positions and scales for social ad creatives. It acts as a candidate template system that the layout engine uses to place text blocks and CTAs within brand-safe boundaries.

Does this layout generation tool handle color usage validation and brand rule checks?

Yes, the layout generation process handles color usage validation and brand rule checks. It validates the generated LayoutSpec JSON against provided references to ensure all text blocks and visual elements comply with established brand guidelines.

What are the limitations of generating social ad layout specs using only structural JSON data?

The limitation is that this process generates layout structure only and does not perform pixel rendering. It specifies text blocks, typography, and hierarchy as a LayoutSpec JSON, requiring a downstream tool for visual asset generation.