Apple HIG: Design Foundations
Meistern Sie die Apple Design-Richtlinien für wunderschöne Apps
Entwickeln Sie Apple-Apps, die sich nativ anfühlen und aussehen, indem Sie die offiziellen Human Interface Guidelines befolgen. Vermeiden Sie Design-Ablehnungen und stellen Sie sicher, dass Ihre App Apples Zugänglichkeits-, Layout- und visuellen Standards auf allen Plattformen entspricht.
Die Skill-ZIP herunterladen
In Claude hochladen
Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen
Einschalten und loslegen
Teste es
Verwendung von "Apple HIG: Design Foundations". Welches Kontrastverhältnis benötige ich für 17pt Text in iOS?
Erwartetes Ergebnis:
Für Text bis 17pt (unabhängig vom Gewicht) benötigen Sie ein minimales Kontrastverhältnis von 4.5:1, um WCAG Level AA zu erfüllen, das Apples Accessibility Inspector als Basis verwendet. Für Text ab 18pt und größer oder fetten Text jeder Größe sinkt die Anforderung auf 3:1. Quelle: accessibility.md, Abschnitt 'Vision'.
Verwendung von "Apple HIG: Design Foundations". Zeigen Sie mir, wie ich semantische Systemfarben in SwiftUI verwende
Erwartetes Ergebnis:
Verwenden Sie semantische Color-APIs wie Color.label, Color.secondaryLabel, Color.systemBackground anstatt Werte hartzukodieren. Diese passen sich automatisch an Hell/Dunkel-Modus und Increase Contrast an: Text('Hello').foregroundColor(.label).background(Color.systemBackground). Quelle: color.md, Abschnitt 'System colors'.
Verwendung von "Apple HIG: Design Foundations". Wie unterstütze ich Dynamic Type in meiner Text-View?
Erwartetes Ergebnis:
Wenden Sie semantische Textstile wie .body, .headline, .subheadline an, die automatisch mit der bevorzugten Textgröße des Benutzers skalieren: Text('Hello').font(.body). Diese unterstützen den vollen Bereich von 11pt bis 23pt auf iOS. Kombinieren Sie mit frame(maxWidth: .infinity) und korrekten Layout-Constraints, um Überlauf zu verhindern. Quelle: typography.md, Abschnitt 'Supporting Dynamic Type'.
Sicherheitsaudit
SicherStatic analysis detected 2676 pattern matches across 18 markdown documentation files (4647 lines). All findings are confirmed FALSE POSITIVES from legitimate documentation content: Ruby backtick notation for inline code examples (e.g., `systemRed`, `label`), hardcoded URLs linking to Apple's official developer documentation, and 'C2 keywords' that are benign terminology in accessibility/design contexts (e.g., 'control' for Switch Control, 'access' for accessibility, 'capture' for screen capture guidelines). This skill contains only static markdown reference documentation with no executable code, network operations, or security risks. Safe to publish.
Qualitätsbewertung
Was du bauen kannst
Zugängliche iOS-Apps entwerfen
Stellen Sie sicher, dass Ihre App Apple-Zugänglichkeitsstandards entspricht, indem Sie VoiceOver-Labels, Dynamic Type-Unterstützung und WCAG AA-Kontrastverhältnisse implementieren. Erfahren Sie, wie Sie mit Accessibility Inspector testen und zugängliche Alternativen für alle interaktiven Elemente bereitstellen.
Dark Mode-Unterstützung implementieren
Passen Sie Ihr App-Farbschema für helle und dunkle Darstellungen mit semantischen Systemfarben an. Verstehen Sie, wie Sie Kontrast in beiden Modi testen, vibrierende Materialien anwenden und sicherstellen, dass benutzerdefinierte Paletten across Darstellungen funktionieren.
App-Typografie standardisieren
Verwenden Sie Apples Type-Scale und Textstile, um sicherzustellen, dass Ihr Text mit Dynamic Type korrekt skaliert. Erfahren Sie, wann Sie SF Pro gegenüber benutzerdefinierten Schriftarten verwenden, wie Sie Schriftgewichts-Hierarchie implementieren und Best Practices für Zeilenabstände.
Probiere diese Prompts
Ich entwerfe einen Button mit Hintergrundfarbe #007AFF und weißem Text für iOS. Ist diese Kombination zugänglich? Welches Kontrastverhältnis erreicht sie und welches WCAG-Level erfüllt sie?
Ich baue ein Formular in SwiftUI und benötige die korrekten semantischen Farben für Labels, Sekundärtext und Fehlerzustände. Zeigen Sie mir das Code-Muster mit Systemfarben, die sich an Dark Mode anpassen.
Mein Text-Layout bricht, wenn Benutzer größere Schriftgrößen in den Zugänglichkeitseinstellungen aktivieren. Zeigen Sie mir, wie ich meine SwiftUI-View mit Textstilen und Auto Layout strukturiere, damit sie von 11pt bis 23pt korrekt skaliert.
Ich benötige benutzerdefinierte Icons, die der optischen Erscheinung von SF Symbols entsprechen. Was sind die Design-Spezifikationen für Symbolgewicht, Rasterausrichtung und Rendering-Modi? Zeigen Sie mir, wie ich benutzerdefinierte Symbole exportiere, die sich nahtlos integrieren.
Bewährte Verfahren
- Prüfen Sie immer auf `.claude/apple-design-context.md`, bevor Sie Fragen stellen, um vorhandenen Projektkontext zu nutzen und redundante Informationssammlung zu vermeiden
- Zitieren Sie spezifische HIG-Grundlagendokumente mit Dateinamen und Abschnitten bei der Bereitstellung von Anleitungen, um Rückverfolgbarkeit und weiteres Lesen zu ermöglichen
- Fordern Sie frühzeitig Plattform-Zielinformationen an, da Apple-Richtlinien zwischen iOS, macOS, watchOS, tvOS und visionOS erheblich variieren
- Erklären Sie immer Zugänglichkeitsauswirkungen bei der Vorschlag von Design-Mustern, einschließlich Kontrastverhältnissen, Dynamic Type-Unterstützung und VoiceOver-Verhalten
Vermeiden
- Hartkodieren Sie keine Farbwerte wie RGB(0, 122, 255) - verwenden Sie semantische APIs wie UIColor.systemBlue oder Color.blue, die sich automatisch an Dark Mode und Zugänglichkeitseinstellungen anpassen
- Vermeiden Sie feste Schriftgrößen wie 16.0 - verwenden Sie stattdessen Textstile wie .body oder .headline, die mit Dynamic Type skalieren und die bevorzugte Textgröße des Benutzers respektieren
- Verlassen Sie sich nicht allein auf Farbe zur Informationsvermittlung - stellen Sie immer zusätzliche visuelle Indikatoren wie Formen, Icons oder Text-Labels für Zugänglichkeit bereit
- Überspringen Sie niemals Zugänglichkeitstests während des Designs - integrieren Sie Accessibility Inspector frühzeitig und überprüfen Sie VoiceOver-Navigation, Dynamic Type-Skalierung und Kontrastverhältnisse vor der Veröffentlichung