{
  "schema": "https://ai-atoms.com/schemas/skill-v1.json",
  "type": "skill",
  "id": "skill/hig-components-system",
  "version": "1.0.1",
  "name": "Hig Components System",
  "description": "Apple HIG guidance for system experience components: widgets, live activities, notifications, complications, home screen quick actions, top shelf, watch faces, app clips, and app shortcuts. Use when asked about: \"widget design\", \"live activity\", \"notification design\", \"complication\", \"home screen quick action\", \"top shelf\", \"watch face\", \"app clip\", \"app shortcut\", \"system experience\". Also use when the user says \"how do I design a widget,\" \"what should my notification look like,\" \"how do Live Activities work,\" \"should I make an App Clip,\" or asks about surfaces outside the main app. Cross-references: hig-components-status for progress in widgets, hig-inputs for interaction patterns, hig-technologies for Siri and system integration.",
  "system_prompt_fragment": "# Apple HIG: System Experiences\n\nCheck for `.claude/apple-design-context.md` before asking questions. Use existing context and only ask for information not already covered.\n\n## Key Principles\n\n### General\n\n1. **Glanceable, immediate value.** System experiences bring your app's most important content to surfaces the user sees without launching your app. Design for seconds of attention.\n\n2. **Respect platform context.** A Lock Screen widget has different constraints than a Home Screen widget. A complication is far smaller than a top shelf item.\n\n### Widgets\n\n3. **Show relevant information, not everything.** Display the most useful subset, updated appropriately.\n\n4. **Support multiple sizes with distinct layouts.** Each size should be a thoughtful design, not a scaled version of another.\n\n5. **Deep-link on tap.** Take users to the relevant content, not the app's root screen.\n\n### Live Activities\n\n6. **Track events with a clear start and end.** Deliveries, scores, timers, rides. Design for both Dynamic Island and Lock Screen.\n\n7. **Stay updated and timely.** Stale data undermines trust. End promptly when the event concludes.\n\n### Notifications\n\n8. **Respect user attention.** Only send notifications for information users genuinely care about. No promotional or low-value notifications.\n\n9. **Actionable and self-contained.** Include enough context to understand and act without opening the app. Support notification actions. Use threading and grouping.\n\n### Complications\n\n10. **Focused data on the watch face.** Design for the smallest useful representation. Support multiple families. Budget updates wisely.\n\n### Home Screen Quick Actions\n\n11. **3-4 most common tasks.** Short titles, optional subtitles, relevant SF Symbol icons.\n\n### Top Shelf\n\n12. **tvOS showcase.** Feature content that entices: new episodes, featured items, recent content.\n\n### App Clips\n\n13. **Instant, focused functionality within a strict size budget.** Load quickly without App Store download. Only what's needed for the immediate task, then offer full app install.\n\n### App Shortcuts\n\n14. **Surface key actions to Siri and Spotlight.** Define shortcuts for frequent tasks. Use natural, conversational trigger phrases.\n\n## Reference Index\n\n| Reference | Topic | Key content |\n|---|---|---|\n| [widgets.md](references/widgets.md) | Widgets | Glanceable info, sizes, deep linking, timeline |\n| [live-activities.md](references/live-activities.md) | Live Activities | Real-time tracking, Dynamic Island, Lock Screen |\n| [notifications.md](references/notifications.md) | Notifications | Attention, actions, grouping, content |\n| [complications.md](references/complications.md) | Complications | Watch face data, families, budgeted updates |\n| [home-screen-quick-actions.md](references/home-screen-quick-actions.md) | Quick actions | Haptic Touch, common tasks, SF Symbols |\n| [top-shelf.md](references/top-shelf.md) | Top shelf | Featured content, showcase |\n| [app-clips.md](references/app-clips.md) | App Clips | Instant use, lightweight, focused task, NFC/QR |\n| [watch-faces.md](references/watch-faces.md) | Watch faces | Custom complications, face sharing |\n| [app-shortcuts.md](references/app-shortcuts.md) | App Shortcuts | Siri, Spotlight, voice triggers |\n\n## Output Format\n\n1. **System experience recommendation** -- which surface best fits the use case.\n2. **Content strategy** -- what to display, priority, what to omit.\n3. **Update frequency** -- refresh rate including system budget constraints.\n4. **Size/family variants** -- which to support and how layout adapts.\n5. **Deep link behavior** -- where tapping takes the user.\n\n## Questions to Ask\n\n1. What information needs to surface outside the app?\n2. Which platform?\n3. How frequently does the data update?\n4. What is the primary glanceable need?\n\n## Related Skills\n\n- **hig-components-status** -- Progress indicators in widgets or Live Activities\n- **hig-inputs** -- Interaction patterns for system experiences (Digital Crown for complications)\n- **hig-technologies** -- Siri for App Shortcuts, HealthKit for complications, NFC for App Clips\n\n---\n\n*Built by [Raintree Technology](https://raintree.technology) · [More developer tools](https://raintree.technology)*\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.",
  "applicable_domains": [
    "frontend"
  ],
  "category": "frontend",
  "invocation": [
    "/hig-components-system"
  ],
  "authored_by": "claudeskills.in community",
  "source_url": "https://claudeskills.in/skill/hig-components-system",
  "provenance": {
    "source": "claudeskills.in",
    "source_url": "https://claudeskills.in/skill/hig-components-system",
    "license": "unknown",
    "imported_at": "2026-09-03",
    "notes": "Aggregated by claudeskills.in from community GitHub lists."
  },
  "tags": [
    "claudeskills",
    "frontend"
  ],
  "lifecycle": "draft"
}