Swiftui Expert Skill
AFK-surf/OpenBridge
Write, review, or improve SwiftUI code following best practices for state management, view composition, performance, modern APIs, Swift concurrency, and iOS 26+ Liquid Glass adoption.
SwiftUI interface implementation patterns aligned with the iOS 26 / Swift 6.2 clinic modular MVVM-C architecture, grounded in Creative Selection and Design Like Apple principles.
$ npx skills add pproenca/dot-skills --skill ios-design -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install pproenca/dot-skills ios-design --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/.experimental/ios-design .claude/skills/ios-design && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "ios-design" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-design into .claude/skills/ios-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ios-design", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-designType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add pproenca/dot-skills --skill ios-design -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install pproenca/dot-skills ios-design --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/.experimental/ios-design .agents/skills/ios-design && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "ios-design" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-design into .agents/skills/ios-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ios-design", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add pproenca/dot-skills --skill ios-design -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install pproenca/dot-skills ios-design --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/.experimental/ios-design .cursor/skills/ios-design && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "ios-design" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-design into .cursor/skills/ios-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ios-design", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/pproenca/dot-skills.git --path skills/.experimental/ios-design--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add pproenca/dot-skills --skill ios-design -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install pproenca/dot-skills ios-design --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/.experimental/ios-design .gemini/skills/ios-design && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "ios-design" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-design into .gemini/skills/ios-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ios-design", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install pproenca/dot-skills ios-designInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add pproenca/dot-skills --skill ios-design -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/.experimental/ios-design .github/skills/ios-design && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "ios-design" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-design into .github/skills/ios-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ios-design", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add pproenca/dot-skills --skill ios-design -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install pproenca/dot-skills ios-design --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/pproenca/dot-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/.experimental/ios-design .opencode/skills/ios-design && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "ios-design" agent skill from https://github.com/pproenca/dot-skills/tree/master/skills/.experimental/ios-design into .opencode/skills/ios-design/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ios-design", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
ios-designSwiftUI interface implementation patterns aligned with the iOS 26 / Swift 6.2 clinic modular MVVM-C architecture, grounded in Creative Selection and Design Like Apple principles.
iOS Design is an agent skill from pproenca/dot-skills. SwiftUI interface implementation patterns aligned with the iOS 26 / Swift 6.2 clinic modular MVVM-C architecture, grounded in Creative Selection and Design Like Apple principles. Use when building new SwiftUI views/screens while respecting Domain/Data boundaries, App-target route-shell navigation, and production-grade accessibility/interaction standards.
Its SKILL.md is about 3.2k tokens, which your agent loads only when the skill is triggered. The skill folder holds 68 other files, including reference files and assets (for example `assets/templates/_template.md`, `metadata.json` and `references/_sections.md`).
It sits in Mobile, covering iOS development. It works with iOS, SwiftUI and Swift. The repository describes itself as: A collection of AI agent skills following the Agent Skills open format. The licence is MIT.
8 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit cf93c57. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
iOS Design loads about 3.2k tokens when it runs, and up to ~53k if it reads all its reference files. Until then it costs about 92 tokens; SKILL.md has 1,163 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from pproenca/dot-skills at commit cf93c57, republished under its MIT licence (© pproenca). 1,163 words, ~3,238 tokens.
.claude/skills/ios-design/SKILL.md (or your agent's skills folder). This skill also uses 65 other files; get the full folder from GitHub.A builder's guide for implementing Apple-quality iOS interfaces in SwiftUI, grounded in two foundational design texts:
Contains 62 rules across 8 principle-based categories. Each rule identifies a specific anti-pattern, grounds the fix in a named principle, and provides the correct iOS 26 / Swift 6.2 SwiftUI implementation.
This skill is the building and implementation guide — it teaches how to construct new SwiftUI interfaces from scratch using Apple-quality patterns. When loaded alongside ios-ui-refactor (reviewing/refactoring existing UI), this skill covers the greenfield implementation that ios-ui-refactor later audits. Use this skill for building new screens; use the sibling for evaluating and improving existing ones.
All guidance in this skill assumes the clinic modular MVVM-C architecture:
Domain + DesignSystem only (never Data, never sibling features)DependencyContainer, concrete coordinators, and Route Shell wiringDomain stays pure Swift and defines models plus repository, *Coordinating, ErrorRouting, and AppError contractsData owns SwiftData/network/sync/retry/background I/O and implements Domain protocolsReference these guidelines when:
| Priority | Category | Principle | Impact | Prefix | Rules |
|---|---|---|---|---|---|
| 1 | Empathy in Every Pixel | Kocienda "Empathy" · Edson "Design Is About People" | CRITICAL | empathy- | 8 |
| 2 | The Visual System | Edson "Systems Thinking" · Kocienda "Convergence" | CRITICAL | system- | 8 |
| 3 | Craft: State as Foundation | Kocienda "Craft" | CRITICAL | craft- | 7 |
| 4 | Creative Composition | Kocienda "Creative Selection" | HIGH | compose- | 6 |
| 5 | Taste: The Right Choice | Kocienda "Taste" · Edson "Design with Conviction" | HIGH | taste- | 8 |
| 6 | Navigation as Conversation | Edson "Design Is a Conversation" · Kocienda "The Demo" | HIGH | converse- | 9 |
| 7 | Design Out Loud: Layout | Edson "Design Out Loud" · Kocienda "Intersection" | HIGH | layout- | 8 |
| 8 | The Product Speaks | Edson "Product Is the Marketing" · Kocienda "Demo Culture" | MEDIUM | product- | 8 |
Kocienda: "Empathy — trying to see the world from other people's perspectives." Edson: design begins with the person holding the device.
empathy-semantic-colors - Use semantic colors, never hard-coded valuesempathy-dark-mode - Support Dark Mode from day oneempathy-foreground-style - Use foregroundStyle over foregroundColorempathy-safe-areas - Always respect safe areas for contentempathy-voiceover-labels - Add VoiceOver labels to every interactive elementempathy-touch-targets - Ensure 44x44 point minimum touch targetsempathy-reduce-motion - Always provide reduce motion fallbackempathy-readable-width - Constrain text to readable width on iPadEdson: "Zoom out to see relationships between objects." Kocienda: convergence — many decisions narrowing toward one coherent whole.
system-typography - Use system typography styles, never fixed sizessystem-visual-hierarchy - Establish clear visual hierarchy through size, weight, and colorsystem-spacing-grid - Use a 4pt base unit for all spacingsystem-material-backgrounds - Use material backgrounds for depth and layeringsystem-sf-symbols - Use SF Symbols for consistent iconographysystem-gradients - Apply gradients for visual depth, not decorationsystem-standard-margins - Use system standard margins consistentlysystem-stack-config - Configure stack alignment and spacing explicitlyKocienda: "Craft — applying skill to achieve a high-quality result."
craft-state-local - Use @State for view-local value typescraft-state-binding - Use @Binding for child view mutationscraft-state-environment - Use @Environment for shared app-wide datacraft-state-observable - Use @Observable for model classescraft-avoid-body-state - Never create state inside the view bodycraft-minimize-scope - Minimize state scope to reduce re-renderscraft-state-bindable - Use @Bindable for @Observable bindingsKocienda: "Creative selection — great software is built through composition and recombination."
compose-body-some-view - Return some View from body, never concrete typescompose-custom-properties - Use properties to make views configurablecompose-modifier-order - Apply view modifiers in the correct ordercompose-viewbuilder - Use @ViewBuilder for flexible slot-based compositioncompose-prefer-value-types - Prefer value types for view datacompose-prefer-composition - Prefer composition over inheritance for view reuseKocienda: "Taste — refined judgment, the ability to choose the one right solution." Edson: commit to one approach and perfect it.
taste-list-vs-lazyvstack - Choose List for system features, LazyVStack for custom layoutstaste-sheet-vs-fullscreen - Choose sheet for tasks, fullScreenCover for immersiontaste-picker - Choose the right picker style for the data typetaste-grid-vs-lazygrid - Choose Grid for aligned data, LazyVGrid for scrollable collectionstaste-button - Use button styles that match the action's importancetaste-textfield - Configure text input with the right keyboard and content typetaste-alerts - Use alerts only for critical, blocking informationtaste-action-sheets - Use confirmation dialogs for contextual multi-choice actionsEdson: "Design is a conversation between the product and the person." Kocienda: demos as conversations about whether the interface speaks clearly.
converse-navigationstack - Use NavigationStack for programmatic, type-safe navigationconverse-tabview - Organize app sections with TabView for parallel navigationconverse-sheet-item - Use item binding for data-driven sheet presentationconverse-dismiss - Use environment dismiss for modal closureconverse-toolbar - Place toolbar items in the correct semantic positionsconverse-tab-bar - Use tab bar for top-level section navigationconverse-nav-bar - Configure navigation bar to communicate contextconverse-hierarchy - Design clear navigation hierarchy before writing codeconverse-search - Integrate search with the searchable modifierEdson: "Design Out Loud — prototype relentlessly until layout feels inevitable." Kocienda: the intersection of technology and liberal arts.
layout-stacks - Use stacks instead of manual positioninglayout-spacer - Use Spacer for flexible space distributionlayout-frame-sizing - Use frame() for explicit size constraintslayout-zstack - Use ZStack for purposeful layered compositionlayout-grid - Use Grid for aligned non-scrolling tabular contentlayout-lazy-grids - Use LazyVGrid for scrollable multi-column layoutslayout-adaptive - Use adaptive layouts for different size classeslayout-scroll-indicators - Show scroll indicators for long scrollable contentEdson: "The product itself is the marketing." Kocienda: every animation and loading state built to survive Steve Jobs' scrutiny.
product-transitions - Use semantic transitions for appearing viewsproduct-loading-states - Show honest loading states, not indefinite spinnersproduct-with-animation - Use withAnimation for explicit state-driven animationproduct-matched-geometry - Use matchedGeometryEffect for contextual origin transitionsproduct-list-cells - Design list cells with standard layoutsproduct-content-unavailable - Use ContentUnavailableView for empty and error statesproduct-segmented - Use segmented controls for visible, mutually exclusive optionsproduct-menus - Use menus for secondary actions without cluttering the interfaceRead individual reference files for detailed explanations and code examples:
| File | Description |
|---|---|
| references/_sections.md | Category definitions and principle grounding |
| assets/templates/_template.md | Template for new rules |
| metadata.json | Version and reference information |
© pproenca, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 65 other files (references, assets) in skills/.experimental/ios-design of pproenca/dot-skills.
Open the folder on GitHubat commit cf93c57
iOS Design next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| iOS Design this skillpproenca/dot-skills | 214 | — | ~3.2k | Automated safety check: Pass | MIT | |
| Swiftui Expert SkillAFK-surf/OpenBridge | 430 | 2 repos | ~3.9k | Automated safety check: Pass | MIT | |
| Swiftui AnimationAstraFoundry/KumoApp | 290 | — | ~4.1k | Automated safety check: Pass | AGPL-3.0 | |
| Snapshot Testsmicrosoft/SwiftStreamingMarkdown | 377 | — | ~2.2k | Automated safety check: Pass | MIT | |
| Bootstrap iOSRayFernando1337/rayfernando-skills | 130 | — | ~1.1k | Automated safety check: Pass | Apache-2.0 | |
| Swiftui Animationdpearson2699/swift-ios-skills | 1.2k | — | ~3.9k | Automated safety check: Pass | Custom licence |
AFK-surf/OpenBridge
Write, review, or improve SwiftUI code following best practices for state management, view composition, performance, modern APIs, Swift concurrency, and iOS 26+ Liquid Glass adoption.
AstraFoundry/KumoApp
Implement, review, or improve SwiftUI animations and transitions.
microsoft/SwiftStreamingMarkdown
Record and validate swift-snapshot-testing snapshots in the SwiftStreamingMarkdown package: regenerate reference PNGs, run snapshot tests, and diff failed snapshots.
RayFernando1337/rayfernando-skills
Bootstrap agents for iOS, iPadOS, macOS, Swift, SwiftUI, SwiftData/Core Data, Swift Testing, Xcode build/test/debug, Simulator, App Intents, or XcodeBuildMCP work.
dpearson2699/swift-ios-skills
Implement, diagnose, or review SwiftUI motion using explicit and scoped implicit animations, springs, transitions, PhaseAnimator, KeyframeAnimator, matched geometry or navigation zoom, SF Symbol…
aiskillstore/marketplace
Develop native iOS applications with Swift/SwiftUI. An agent skill from aiskillstore/marketplace.
pproenca/dot-skills
Audio forensics and voice recovery guidelines for CSI-level audio analysis.
pproenca/dot-skills
Guided, scripted pipeline for running JSX/TSX/React codemods safely across large legacy codebases.
pproenca/dot-skills
Create well-structured RFCs and technical proposals for software projects.
pproenca/dot-skills
Developer-experience friction auditing and fixing — slow onboarding, repeated manual setup steps, missing bootstrap/reset/seed scripts, undiscoverable conventions.
pproenca/dot-skills
Turn a rough idea for a language into a complete, implementable specification — a DSL, query, config/data, template, or protocol language — by interviewing the author dimension by dimension until…
pproenca/dot-skills
Drafting Python Enhancement Proposals (PEPs) — proposing a Python language feature, a standard library change, an interoperability standard, or an informational/process document for the Python…
Categories
SwiftUI interface implementation patterns aligned with the iOS 26 / Swift 6.2 clinic modular MVVM-C architecture, grounded in Creative Selection and Design Like Apple principles. iOS Design is an agent skill from pproenca/dot-skills.2 clinic modular MVVM-C architecture, grounded in Creative Selection and Design Like Apple principles.
iOS Design fits situations like: building new SwiftUI views/screens while respecting Domain/Data boundaries; app-target route-shell navigation; production-grade accessibility/interaction standards.
Run `npx skills add pproenca/dot-skills --skill ios-design -a claude-code`. Or copy the skill folder (skills/.experimental/ios-design in pproenca/dot-skills) into .claude/skills/ios-design in your project. Claude Code loads it when a task matches its description.
Run `npx skills add pproenca/dot-skills --skill ios-design -a codex`. Or copy the skill folder (skills/.experimental/ios-design in pproenca/dot-skills) into .agents/skills/ios-design in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add pproenca/dot-skills --skill ios-design -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/ios-design, .gemini/skills/ios-design, .github/skills/ios-design and .opencode/skills/ios-design in your project.
SKILL.md names no scripts, command-line tools or credentials: iOS Design is instructions for the agent only.
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
iOS Design is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 3.2k tokens (SKILL.md is roughly 13k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 50k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with iOS Design: Swiftui Expert Skill (AFK-surf/OpenBridge, 430 stars), Swiftui Animation (AstraFoundry/KumoApp, 290 stars), Snapshot Tests (microsoft/SwiftStreamingMarkdown, 377 stars) and Bootstrap iOS (RayFernando1337/rayfernando-skills, 130 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
pproenca (a GitHub user) maintains it in pproenca/dot-skills, which has 214 GitHub stars. The repository holds 182 skills in this directory. The repository was last updated on August 15, 2026.
Source: pproenca/dot-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.