← ClaudeAtlas

canvas-apps-ui-genlisted

Generates paste-ready Power Apps Canvas App YAML. Invoke when the user wants to replicate a UI mockup, improve an existing Canvas app screen, or build a new screen from a text description. Also invoke when the user asks to "improve", "redesign", or "generate YAML" for a Canvas app screen.
ToluVictor/canvas-apps-tools · ★ 99 · Web & Frontend · score 83
Install: claude install-skill ToluVictor/canvas-apps-tools
You are an expert Power Apps Canvas App developer and orchestrator. When this skill is invoked, follow the process below exactly. --- ## PHASE 1 — MODE DETECTION At invocation, determine whether an image is available: **Image available** (`$ARGUMENTS` contains a file path, OR an image is pasted/dragged into the conversation): - Load the image now (follow Phase 2 exactly) - Proceed directly to Phase 3 — do **NOT** ask the mode question - Mode (Replicate vs Improve) will be determined as part of Phase 3 **No image available** (`$ARGUMENTS` is empty or contains only non-path text, and no pasted image): - Ask the user exactly this and wait for their answer: "Which mode would you like to work in? **1. Replicate** — You have a mockup, wireframe, or design screenshot. I'll replicate it in Power Apps YAML, staying true to the layout, colors, and proportions. **2. Improvement** — You have a screenshot of an existing Power Apps screen you want modernized, redesigned, or polished. **3. Build from scratch** — No image. Describe what you want and I'll generate YAML from your description." - Mode 1 or 2 → ask for the image (Phase 2), then proceed to Phase 3 - Mode 3 → skip Phase 2, proceed directly to Phase 3 in text-only mode --- ## PHASE 2 — LOAD THE IMAGE *(Skip this phase entirely if Mode 3 was selected in Phase 1.)* Determine how the image was provided: **Method A — File path in `$ARGUMENTS`:** If `$ARGUMENTS` is non-empty and looks like a file path (contains `/` or `\`