ivan-magda/claude-superpowers/swift-package-demo

Claude Code and agent skill by ivan-magda/claude-superpowers

Trust tier 3
  • community
Source check pending

Checking that the SKILL.md file is still in the repository.

Use when creating demo GIFs for Swift package READMEs, recording iOS simulator videos, or setting up demo apps for SwiftUI libraries

Install

npx vskill@latest install ivan-magda/claude-superpowers/swift-package-demo

SKILL.md

Swift Package Demo Recording

Overview

Record and optimize demo GIFs for Swift package READMEs. Swift packages need a separate demo app since SwiftUI previews only run in Xcode Canvas, not the iOS Simulator.

When to Use

  • Adding demo GIFs to a Swift package README
  • Recording iOS Simulator for documentation
  • User asks to "record a demo" or "add GIFs to README"

Critical Understanding

dot
digraph demo_flow {
"SwiftUI Preview" [shape=box];
"iOS Simulator" [shape=box];
"Xcode Canvas only" [shape=box, style=filled, fillcolor=lightyellow];
"Recordable with xcrun" [shape=box, style=filled, fillcolor=lightgreen];
"SwiftUI Preview" -> "Xcode Canvas only" [label="runs in"];
"Demo App" -> "iOS Simulator" [label="runs in"];
"iOS Simulator" -> "Recordable with xcrun";
}

SwiftUI #Preview macros CANNOT be recorded. You must create a demo app.

Quick Reference

StepCommand/Action
Create demo dirmkdir -p demo
Boot simulatorxcrun simctl boot "iPhone SE (3rd generation)"
Open simulatoropen -a Simulator
Record videoxcrun simctl io booted recordVideo --codec=h264 demo/raw.mov
Stop recordingCtrl+C
Convert to GIFSee FFmpeg command below
Optimize GIFgifsicle -O3 --lossy=80 demo/out.gif -o demo/out.gif

Demo App Setup

Create demo/DemoApp/ with Xcode project that imports your package locally:

  1. In Xcode: File → New → Project → iOS App
  2. Save in demo/DemoApp/
  3. File → Add Package Dependencies → Add Local → select package root
  4. Import and use your library in the app

Critical: Use local package reference, not remote URL, to test current development code.

Recording Commands

bash
# Boot simulator (smaller = smaller GIF)
xcrun simctl boot "iPhone SE (3rd generation)"
open -a Simulator
# Run demo app in Xcode (Cmd+R), then record
xcrun simctl io booted recordVideo --codec=h264 demo/raw.mov
# Ctrl+C to stop

GIF Conversion

REQUIRED: Before converting .mov files to GIF, you MUST ask the user using AskUserQuestion:

Question: "How should the GIF be sized?"
Options:
- Full size (keep entire screen including status bar)
- Cropped (remove status bar and bottom navigation)

Do NOT assume cropping. Do NOT convert without asking first.

Full Size (default)
bash
ffmpeg -i demo/raw.mov -filter_complex \
"[0:v] fps=12,scale=300:-1:flags=lanczos,split [a][b]; \
[a] palettegen=max_colors=128:stats_mode=diff [p]; \
[b][p] paletteuse=dither=floyd_steinberg:diff_mode=rectangle" \
-y demo/output.gif
gifsicle -O3 --lossy=80 demo/output.gif -o demo/output.gif
Cropped (removes status bar and bottom nav)
bash
ffmpeg -i demo/raw.mov -filter_complex \
"[0:v] crop=in_w:in_h*0.55:0:in_h*0.12,fps=12,scale=300:-1:flags=lanczos,split [a][b]; \
[a] palettegen=max_colors=128:stats_mode=diff [p]; \
[b][p] paletteuse=dither=floyd_steinberg:diff_mode=rectangle" \
-y demo/output.gif
gifsicle -O3 --lossy=80 demo/output.gif -o demo/output.gif

Crop parameters: crop=in_w:in_h*0.55:0:in_h*0.12 keeps 55% height starting at 12% from top.

README Integration

markdown
<p align="center">
<img src="demo/demo1.gif" width="280" alt="Demo 1">&nbsp;&nbsp;<img src="demo/demo2.gif" width="280" alt="Demo 2">
</p>

Side-by-side: Use &nbsp;&nbsp; between images, width 240-280px each.

.gitignore

gitignore
# Demo - ignore everything except GIFs
demo/*
!demo/*.gif

Common Mistakes

MistakeFix
Converting without asking about sizingAlways ask user: full size or cropped?
Trying to record SwiftUI previewsCreate demo app, run in simulator
"No devices booted" errorRun xcrun simctl boot "iPhone SE (3rd generation)" first
Demo app uses remote packageUse Add Local package reference
API mismatch after package changesXcode → File → Packages → Reset Package Caches
GIFs too large (>1MB)Reduce fps (12), scale (300px), use gifsicle
Recording before app runsRun app in Xcode (Cmd+R) first, THEN start recording

Target Sizes

TypeWidthFPSTarget Size
Hero demo280-300px12< 200KB
Feature demo240px10-12< 150KB

Security

  • Security scanPassed, 90 of 100Pattern checks on the skill's files.
  • Model reviewPassed

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

Source

Popularity

7-day trend score
0

Not refreshed yet.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/ivan-magda/claude-superpowers/swift-package-demo/badge)](https://verified-skill.com/skills/ivan-magda/claude-superpowers/swift-package-demo)

Something wrong with this skill or its page? Tell us.