mcpbeat Sign in

App Clip Skill for Claude

Generates App Clip targets with invocation URL handling, lightweight experiences, and full app upgrade prompts. Use when user wants NFC/QR/Safari banner invocation, instant app experiences, or App Clip Card setup.

13k tokens
context cost
the whole folder, loaded on every use
3
files
instructions only
0
copies elsewhere
how many repositories repackaged it
585
stars on the repo
on the repository, not the skill itself

Install

one command, takes just this skill from the repository
npx skills add https://github.com/rshankras/claude-code-apple-skills --skill app-clip

The instruction itself

24 sections, as written by the author

App Clip Generator

Generate production App Clip infrastructure — a lightweight version of your app invoked from NFC tags, QR codes, Safari banners, or Messages. Includes App Clip target setup, invocation URL handling, experience routing, location confirmation, and full app upgrade flow.

When This Skill Activates

Use this skill when the user:

  • Asks to "add an app clip" or "create an app clip target"
  • Mentions "instant app" or "lightweight app experience"
  • Wants to set up "App Clip Card" metadata
  • Mentions "NFC tag" invocation or "QR code" launching an app
  • Asks about "app clip invocation" or "invocation URL handling"
  • Wants a "lightweight app experience" for a physical location

Pre-Generation Checks

1. Project Context Detection

  • [ ] Check deployment target (iOS 14+ required for App Clips, iOS 16+ recommended)
  • [ ] Check Swift version (requires Swift 5.9+)
  • [ ] Check for @Observable support (iOS 17+ / macOS 14+)
  • [ ] Identify Xcode project structure (.xcodeproj or .xcworkspace)

2. Conflict Detection

Search for existing App Clip targets:

Glob: **/*AppClip*/*.swift, **/*Clip*/*.swift
Grep: "NSUserActivityTypeBrowsingWeb" or "AppClipExperience" or "SKOverlay"

If existing App Clip target found:

  • Ask if user wants to replace or extend it
  • If extending, identify which components are missing

3. Project Structure

Identify where the main app target lives and where to place the App Clip target alongside it.

Configuration Questions

Ask user via AskUserQuestion:

  • Invocation method?
  • NFC tag only
  • QR code only
  • Safari banner (Smart App Banner)
  • Messages
  • All of the above — recommended
  • Primary experience?
  • Order food (restaurant/cafe)
  • Reserve (booking/reservation)
  • Check in (event/location)
  • Preview content (article/product)
  • Include location confirmation?
  • Yes — verifies user is physically at the expected location (recommended for physical-world invocations)
  • No — skip location verification
  • Include full app upgrade prompt?
  • Yes — show SKOverlay banner to download full app (recommended)
  • No — App Clip only, no upgrade path

Generation Process

Step 1: Read Templates

Read templates.md for production Swift code.

Read patterns.md for constraints, testing, and best practices.

Step 2: Create Core Files

Generate these files:

  • AppClipApp.swift — @main App struct handling invocation via .onContinueUserActivity
  • InvocationHandler.swift — Parses invocation URL, extracts parameters, validates against registered experiences
  • AppClipExperience.swift — Protocol and concrete experience implementations

Step 3: Create Location Files (if selected)

  • LocationConfirmationView.swift — CLLocationManager-based location verification for physical invocations

Step 4: Create Upgrade Files (if selected)

  • FullAppUpgradeView.swift — SKOverlay-based banner prompting full app download
  • SharedDataManager.swift — App Group data sharing between App Clip and full app

Step 5: Determine File Location

Check project structure:

  • If Sources/ exists -> Sources/AppClip/
  • If main app target folder exists -> AppClip/ at the same level
  • Otherwise -> AppClip/

Output Format

After generation, provide:

Files Created

AppClip/
├── AppClipApp.swift              # @main entry point with invocation handling
├── InvocationHandler.swift       # URL parsing and parameter extraction
├── AppClipExperience.swift       # Experience protocol and implementations
├── LocationConfirmationView.swift # Location verification (optional)
├── FullAppUpgradeView.swift      # SKOverlay upgrade prompt (optional)
└── SharedDataManager.swift       # App Group data sharing (optional)

Xcode Target Setup Instructions

  • Add App Clip Target:
  • File > New > Target > App Clip
  • Set bundle ID to {main-app-bundle-id}.Clip
  • Set deployment target to iOS 16.0
  • Configure Associated Domains:
  • Add appclips:{your-domain.com} to both main app and App Clip entitlements
  • Set Up App Group:
  • Add group.{your-bundle-id} to both targets for shared data
  • Apple-App-Site-Association (AASA) file:
  • Host at https://{your-domain.com}/.well-known/apple-app-site-association

Integration

Handle invocation in the App Clip:

@main
struct MyAppClip: App {
    @State private var handler = InvocationHandler()

    var body: some Scene {
        WindowGroup {
            ContentView(experience: handler.currentExperience)
                .onContinueUserActivity(
                    NSUserActivityTypeBrowsingWeb
                ) { activity in
                    handler.handle(activity)
                }
        }
    }
}

Route to the correct experience:

struct ContentView: View {
    let experience: (any AppClipExperience)?

    var body: some View {
        if let experience {
            AnyView(experience.makeView())
        } else {
            DefaultExperienceView()
        }
    }
}

Share data with the full app:

// In App Clip — save order before user upgrades
SharedDataManager.shared.save(order, forKey: "pendingOrder")

// In Full App — restore after install
if let order: Order = SharedDataManager.shared.load(forKey: "pendingOrder") {
    showOrder(order)
}

Prompt full app download:

FullAppUpgradeView(
    appStoreID: "123456789",
    benefits: [
        "Order history and favorites",
        "Loyalty rewards program",
        "Push notification for order updates"
    ]
)

Testing

@Test
func invocationHandlerParsesProductURL() {
    let handler = InvocationHandler()
    let url = URL(string: "https://example.com/clip/product/abc123")!

    let experience = handler.parseURL(url)

    #expect(experience != nil)
    #expect(experience?.experienceType == .previewContent)
    #expect(experience?.parameters["productID"] == "abc123")
}

@Test
func invocationHandlerRejectsInvalidURL() {
    let handler = InvocationHandler()
    let url = URL(string: "https://other-domain.com/something")!

    let experience = handler.parseURL(url)

    #expect(experience == nil)
}

@Test
func sharedDataManagerRoundTrips() {
    let manager = SharedDataManager(suiteName: "group.test")
    let order = Order(id: "order-1", items: ["Latte", "Muffin"])

    manager.save(order, forKey: "testOrder")
    let loaded: Order? = manager.load(forKey: "testOrder")

    #expect(loaded?.id == "order-1")
    #expect(loaded?.items.count == 2)
}

Common Patterns

Handle Invocation URL

Every App Clip starts from a URL. Parse it to determine what experience to show:

// URL: https://example.com/clip/order?location=store-42
// -> Route to OrderExperience with locationID = "store-42"

Present Experience Immediately

Users expect instant value. Show the relevant experience within 1-2 seconds, no sign-in required.

Prompt Full App Install

After the user completes the primary task, show an SKOverlay banner with clear benefits of the full app.

Gotchas

  • 10 MB size limit — App Clip binary must be under 10 MB. Use SF Symbols, avoid large assets, lazy-load images from network.
  • 8-hour data retention — App Clip data is deleted after 8 hours of inactivity. Use App Group to persist data accessible to the full app.
  • Limited frameworks — No CallKit, no HealthKit, no CareKit. Limited background processing. Check Apple's framework availability list.
  • No background processing — App Clips cannot run background tasks, background fetch, or silent push notifications.
  • Must work without sign-in — App Clips should provide value immediately. Defer sign-in until the full app upgrade.
  • App Clip Card metadata — Configure in App Store Connect: card image (3000x2000 px), title, subtitle, call-to-action button text.
  • Associated Domains required — Both the main app and App Clip must have the appclips: associated domain configured, and the AASA file must be hosted on the domain.
  • Size budgeting — Regularly check App Clip size during development with xcodebuild -exportArchive or the App Thinning Size Report.

References

  • templates.md — All production Swift templates for App Clip infrastructure
  • patterns.md — Constraints, data lifecycle, testing, and best practices
  • Related: generators/deep-linking — Universal link and deep link handling
  • Related: generators/onboarding-generator — Onboarding flow for full app upgrade

Other skills for the same job

different authors, same section of the catalogue
Protocolsio Integration
by christophacham
×4

Integration with protocols.io API for managing scientific protocols. This skill should be used when working with protocols.io to search, create, update, or publish protocols; manage protocol steps and materials; handle discussions and comments; organize workspaces; upload and manage files; or integrate protocols.io functionality into workflows. Applicable for protocol discovery, collaborative protocol development, experiment tracking, lab protocol management, and scientific documentation.

16k tokens
Tailored Resume Generator
by frostant
×4

Analyzes job descriptions and generates tailored resumes that highlight relevant experience, skills, and achievements to maximize interview chances

3k tokens
Excalidraw Diagram Generator
by github
vendor ×3

Generate Excalidraw diagrams from natural language descriptions. Use when asked to "create a diagram", "make a flowchart", "visualize a process", "draw a system architecture", "create a mind map", or "generate an Excalidraw file". Supports flowcharts, relationship diagrams, mind maps, and system architecture diagrams. Outputs .excalidraw JSON files that can be opened directly in Excalidraw.

36k tokens scripts
Expo Dev Client
by openai
vendor ×3

Build and distribute Expo development clients locally or via TestFlight

961 tokens
Executing Plans
by ZhanlinCui
×3

Use when you have a written implementation plan to execute in a separate session with review checkpoints

542 tokens
Anndata
by christophacham
×3

Data structure for annotated matrices in single-cell analysis. Use when working with .h5ad files or integrating with the scverse ecosystem. This is the data format skill—for analysis workflows use scanpy; for probabilistic models use scvi-tools; for population-scale queries use cellxgene-census.

16k tokens
Benchling Integration
by christophacham
×3

Benchling R&D platform integration. Access registry (DNA, proteins), inventory, ELN entries, workflows via API, build Benchling Apps, query Data Warehouse, for lab data management automation.

14k tokens
Biopython
by christophacham
×3

Comprehensive molecular biology toolkit. Use for sequence manipulation, file parsing (FASTA/GenBank/PDB), phylogenetics, and programmatic NCBI/PubMed access (Bio.Entrez). Best for batch processing, custom bioinformatics pipelines, BLAST automation. For quick lookups use gget; for multi-service integration use bioservices.

24k tokens

How to use it

Copy the folder

Take rshankras/app-clip from the repository into ~/.claude/skills for personal use, or into .claude/skills inside a project.

Check the name does not clash

The agent identifies a skill by the name field in its header. Two skills with the same name cannot sit side by side — one of them will be ignored.