المهارات Apple HIG: Design Foundations
🎨

Apple HIG: Design Foundations

آمن

美しく高品質なアプリのために Apple デザインガイドラインをマスターする

公式の Human Interface Guidelines に従って、ネイティブな外観と操作性を持つ Apple 用アプリを構築しましょう。デザイン却下を回避し、すべてのプラットフォームにおいて Apple のアクセシビリティ、レイアウト、ビジュアル標準を満たすことを保証します。

يدعم: Claude Codex Code(CC)
📊 69 كافٍ
1

تنزيل ZIP المهارة

2

رفع في Claude

اذهب إلى Settings → Capabilities → Skills → Upload skill

3

فعّل وابدأ الاستخدام

اختبرها

استخدام "Apple HIG: Design Foundations". iOS で 17pt のテキストに必要なコントラスト比は何ですか?

النتيجة المتوقعة:

17pt までのテキスト(ウェイトに関係なく)の場合、Apple の Accessibility Inspector がベースラインとして使用する WCAG Level AA に適合するには、最小 4.5:1 のコントラスト比が必要です。18pt 以上のテキスト、または任意サイズの太字テキストの場合、要件は 3:1 に下がります。出典:accessibility.md の「Vision」セクション。

استخدام "Apple HIG: Design Foundations". SwiftUI でセマンティックシステムカラーを使用する方法を示してください

النتيجة المتوقعة:

ハードコードされた値の代わりに、Color.label、Color.secondaryLabel、Color.systemBackground などのセマンティックカラー API を使用します。これらはライト/ダークモードと「コントラストを上げる」設定に自動的に適応します:Text('Hello').foregroundColor(.label).background(Color.systemBackground)。出典:color.md の「System colors」セクション。

استخدام "Apple HIG: Design Foundations". テキストビューで Dynamic Type をサポートするにはどうすればよいですか?

النتيجة المتوقعة:

.body、.headline、.subheadline などのセマンティックテキストスタイルを適用すると、ユーザーの優先テキストサイズに自動的にスケーリングされます:Text('Hello').font(.body)。これらは iOS で 11pt から 23pt までの全範囲をサポートします。オーバーフローを防ぐために frame(maxWidth: .infinity) と適切なレイアウト制約と組み合わせます。出典:typography.md の「Supporting Dynamic Type」セクション。

التدقيق الأمني

آمن
v1 • 2/25/2026

Static 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.

18
الملفات التي تم فحصها
4,647
الأسطر التي تم تحليلها
0
النتائج
1
إجمالي عمليات التدقيق
لا توجد مشكلات أمنية
تم تدقيقه بواسطة: claude

درجة الجودة

38
الهندسة المعمارية
100
قابلية الصيانة
87
المحتوى
50
المجتمع
100
الأمان
52
الامتثال للمواصفات

ماذا يمكنك بناءه

アクセシブルな iOS アプリを設計する

VoiceOver ラベル、Dynamic Type サポート、WCAG AA コントラスト比を実装することで、アプリが Apple のアクセシビリティ標準を満たすことを保証します。Accessibility Inspector でのテスト方法と、すべての対話要素に対するアクセシブルな代替手段の提供方法を学びます。

ダークモードサポートを実装する

セマンティックシステムカラーを使用して、ライトとダークの外観の両方に対応するアプリの配色を適応させます。両モードでのコントラストテスト方法、バイブラントマテリアルの適用方法、カスタムパレットが両外観で機能することを確認する方法を理解します。

タイポグラフィを標準化する

Apple のタイプスケールとテキストスタイルを使用して、テキストが Dynamic Type で適切にスケーリングされることを保証します。SF Pro とカスタムフォントの使い分け、フォントウェイト階層の実装方法、行間隔のベストプラクティスを学びます。

جرّب هذه الموجهات

カラーコントラストの適合性を確認する
iOS 用に背景色 #007AFF と白色のテキストを使用したボタンをデザインしています。この組み合わせはアクセシブルですか?どのようなコントラスト比を達成し、どの WCAG レベルに適合しますか?
システムカラーを実装する
SwiftUI でフォームを構築しており、ラベル、-secondary テキスト、エラー状態に対して正しいセマンティックカラーを使用する必要があります。ダークモードに適応するシステムカラーを使用したコードパターンを示してください。
Dynamic Type をサポートする
ユーザーがアクセシビリティ設定で大きなフォントサイズを有効にすると、テキストレイアウトが崩れてしまいます。11pt から 23pt まで適切にスケーリングするように、テキストスタイルと Auto Layout を使用して SwiftUI ビューを構築する方法を示してください。
SF Symbols 統合を設計する
SF Symbols と視覚的な外観が一致するカスタムアイコンが必要です。シンボルウェイト、グリッドアライメント、レンダリングモードの設計仕様はどのようなものですか?シームレスに統合するカスタムシンボルのエクスポート方法を示してください。

أفضل الممارسات

  • 質問する前に常に `.claude/apple-design-context.md` を確認して、既存のプロジェクトコンテキストを活用し、冗長な情報収集を回避します
  • ガイダンスを提供する際は、追跡可能性とさらなる学習を可能にするために、ファイル名とセクションを明記して特定の HIG 基礎ドキュメントを引用します
  • Apple ガイドラインは iOS、macOS、watchOS、tvOS、visionOS 間で大きく異なるため、早期にプラットフォームターゲット情報を取得します
  • デザインパターンを提案する際は、コントラスト比、Dynamic Type サポート、VoiceOver 動作を含むアクセシビリティへの影響を常に説明します

تجنب

  • RGB(0, 122, 255) のようなカラー値をハードコードしないでください - ダークモードとアクセシビリティ設定に自動的に適応する UIColor.systemBlue や Color.blue などのセマンティック API を使用します
  • 16.0 のような固定フォントサイズを使用しないでください - 代わりに Dynamic Type でスケーリングし、ユーザーの優先テキストサイズを尊重する .body や .headline などのテキストスタイルを使用します
  • 情報の伝達にカラーのみに依存しないでください - アクセシビリティのために形状、アイコン、テキストラベルなどの追加の視覚的インジケーターを常に提供します
  • デザイン中のアクセシビリティテストを絶対にスキップしないでください - 提出前に Accessibility Inspector を早期に統合し、VoiceOver ナビゲーション、Dynamic Type スケーリング、コントラスト比を検証します

الأسئلة المتكررة

Apple のオンライン HIG ドキュメントとの違いは何ですか?
このスキルには同じ信頼性の高いコンテンツが含まれていますが、AI 支援ワークフロー向けに構造化されています。Claude は基礎資料を相互参照し、プラットフォーム固有のガイダンスを提供し、ドキュメントを手動で検索する必要なく HIG 原則に基づいてコードパターンを生成できます。
このスキルは私のために Swift コードを書いてくれますか?
いいえ、実装する HIG からのコードパターンと例を提供します。このスキルは正しい API、セマンティックアプローチ、ベストプラクティスを示します - これらのパターンに基づいて実際の実装を記述します。
どのプラットフォームがカバーされていますか?
すべての Apple プラットフォーム:iOS、iPadOS、macOS、watchOS、tvOS、visionOS。ガイドラインには、異なるタイプスケール(watchOS:12-16pt、iOS:11-17pt、macOS:10-13pt)やユニークな機能(visionOS 用のスペースシャルレイアウト)などのプラットフォーム固有の考慮事項が含まれています。
情報はどの程度最新ですか?
このスキルは Apple の公開された Human Interface Guidelines を収録しています。Apple は新しいプラットフォーム(visionOS など)や進化するデザインパターンで HIG を定期的に更新します。最先端の機能については、developer.apple.com/design/human-interface-guidelines で確認してください。
このスキルは既存のアプリを HIG 適合性について監査できますか?
間接的には可能です。UI パターンを説明していただければ、不十分なカラーコントラスト、不適切な Dynamic Type サポート、非セマンティックなカラー使用などの HIG 原則との比較により違反を特定できます。ただし、コードやアプリバイナリをプログラム的に分析することはできません。
hig-platforms スキルの前と後、どちらで使用すべきですか?
普遍的に適用される基礎原則(カラー、タイポグラフィ、アクセシビリティ)についてはここから始めます。iOS のタブバー仕様と macOS のサイドバーデザインなど、プラットフォーム固有の実装詳細が必要な場合は hig-platforms を使用します。このスキルは「なぜ」を提供し、hig-platforms はプラットフォーム固有の「どのように」を提供します。

تفاصيل المطور

المؤلف

sickn33

الترخيص

MIT

مرجع

main