apple-ui-design
Apple-inspirierte Interfaces gestalten
Das Erstellen von Premium-Interfaces erfordert das Verständnis von Typografie-Hierarchie, Spacing-Rhythmus und subtilen Animationen. Diese Fähigkeit vermittelt Apple-Design-Prinzipien zum Erstellen von sauberen, minimalistischen, benutzerfreundlichen Interfaces, die sich nativ auf Apple-Plattformen anfühlen.
Скачать ZIP навыка
Загрузить в Claude
Перейдите в Settings → Capabilities → Skills → Upload skill
Включите и начните использовать
Протестировать
Использование «apple-ui-design». Einen primären Button mit Apple-Design-Prinzipien erstellen
Ожидаемый результат:
- Pillenförmiger Button (border-radius: 980px) für Apple-Authentizität
- Blaue Akzentfarbe (#0071e3) mit weißem Text
- 12px vertikal / 24px horizontal Padding für komfortables Touch-Target
- Sanfter Scale- und Brightness-Übergang beim Hover
- 500 Schriftstärke für klare visuelle Hierarchie
Использование «apple-ui-design». Eine Inhaltskarte mit Dunkelmodus-Unterstützung gestalten
Ожидаемый результат:
- Weißer Hintergrund mit 80% Opazität für leichten Glass-Effekt
- 20px Backdrop-Blur für Tiefe und Fokus
- 18px Border-Radius für moderne abgerundete Ecken
- Subtiler 6% schwarzer Schatten für Erhebung ohne Härte
- Dunkelmodus: Schwarzer Hintergrund mit #1d1d1f sekundär
Аудит безопасности
БезопасноThis is a pure documentation skill containing only design guidelines and CSS examples. All 58 static findings are FALSE POSITIVES. The scanner misidentified CSS hex color codes as cryptographic algorithms and markdown backticks as shell execution. No executable code, file access, network calls, or system operations exist.
Факторы риска
🌐 Доступ к сети (1)
📁 Доступ к файловой системе (1)
Оценка качества
Что вы можете построить
Komponenten-Entwicklung
React, Vue oder HTML-Komponenten erstellen, die den Apple-Design-Richtlinien für konsistente Benutzererfahrung folgen.
Design-System-Erstellung
Typografie-, Farb- und Spacing-Grundlagen für Design-Systeme mit Apple-Ästhetik etablieren.
Qualitätsprüfung
Bestehende Interfaces anhand von Apple-Design-Standards für Premium-Qualitätsbewertung evaluieren.
Попробуйте эти промпты
Einen primären Button mit Apple-UI-Prinzipien gestalten. Pillenform, blaue Akzentfarbe, sanfter Hover-Übergang und korrektes Padding einschließen.
Eine Karten-Komponente mit Backdrop-Blur, abgerundeten Ecken, subtilem Schatten und korrektem Spacing erstellen. Dunkelmodus-Unterstützung einschließen.
Ein Typografie-System mit SF Pro mit Hero-, Titel-, Body- und Caption-Styles definieren. Zeilenhöhen und Schriftstärken einschließen.
Eine Landing-Page nach Apple-Prinzipien gestalten: 680px maximale Inhaltsbreite, grosszügiger Weißraum, eine primäre CTA und sanfte Fade-Animationen.
Лучшие практики
- System-Schriften (-apple-system, SF Pro) für natives Gefühl und Performance verwenden
- Konsistenten Spacing-Rhythmus mit 4px-Basiseinheit-Multiples beibehalten
- Inhaltsbreite auf ~680px für optimale Lesbarkeit und Fokus begrenzen
Избегать
- Dekorative Schriften verwenden, die mit Inhalten konkurrieren
- Mehrere konkurrierende Call-to-Action-Buttons hineinstopfen
- Störende Animationen anwenden, die von Inhalten ablenken