메뉴
SwiftUI ViewのDesign System準拠性を監査する。既存UIのレビュー、デザインチェック時に使用。「デザインレビュー」「UIチェック」「design audit」「デザイン監査」「UI監査」「デザインチェック」「トークン確認」などのキーワードで自動適用。
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
AI QA Agent のメインオーケストレーター。テストスイートまたは個別テストケースの QA を段階的に実行する。フェーズスキルに委譲して段階的開示を行い、サブエージェントでコンテキスト隔離を実現する。「QA」「動作確認」「テストケース実行」「smoke test」「E2E」「手動テスト」「結合テスト」などのキーワードで自動適用。
QA テストスイートの解析・前提条件解決・実行計画策定を行うフェーズスキル。ios-qa-workflow から参照される。「テスト計画」「QA 準備」「テストスイート解析」などのキーワードで自動適用。
QA テスト結果を集約し、構造化レポートを生成するフェーズスキル。失敗テストの分析と次のアクション提案を含む。「QA レポート」「テスト結果」「QA 結果」などのキーワードで自動適用。
テストケースの作成を対話的に支援するユーティリティスキル。アプリの画面を観察しながらテストケースを生成できる。「テストケース作成」「QA ケース作成」「テスト項目作成」などのキーワードで自動適用。
テストケースの実行制御を行うフェーズスキル。各テストケースを qa-runner → qa-judge のパイプラインで実行し、アプリ状態管理と結果収集を担当する。ios-qa-workflow から参照される。
iOS 開発ワークフローのオーケストレーター。XcodeBuildMCP ベースのフォアグラウンドサブエージェントを使い分け、ビルド・テスト・実行・UI 検証をコンテキスト隔離で実行する。「iOS」「Xcode」「Swift」「build」「test」「compile」「simulator」「xcodebuild」「preview」「SwiftUI」「ビルド」「テスト」「コンパイル」などのキーワードで自動適用。
| name | design-audit |
| description | SwiftUI ViewのDesign System準拠性を監査する。既存UIのレビュー、デザインチェック時に使用。「デザインレビュー」「UIチェック」「design audit」「デザイン監査」「UI監査」「デザインチェック」「トークン確認」などのキーワードで自動適用。 |
既存の SwiftUI View が Swift Design System に準拠しているかを体系的に監査する。
ハードコードされた値がないか検出する。
| 検出対象 | 正しい使用 | 重大度 |
|---|---|---|
Color.red, .red, Color(hex:) など | colors.error, colors.primary 等 | Critical |
.font(.system(size:)) | .typography(.bodyMedium) 等 | Critical |
.padding(16), spacing: 12 等の数値直指定 | spacing.lg, spacing.md 等 | Warning |
cornerRadius: 8 等の数値直指定 | radius.lg 等 | Warning |
.animation(.easeOut(duration:)) | .animate(motion.tap, value:) | Warning |
ColorPalette プロパティ一覧（これ以外の Color を使っていたら違反）:
SpacingScale 値一覧: none(0), xxs(2), xs(4), sm(8), md(12), lg(16), xl(24), xxl(32), xxxl(48), xxxxl(64)
Typography 一覧: displayLarge(57), displayMedium(45), displaySmall(36), headlineLarge(32), headlineMedium(28), headlineSmall(24), titleLarge(22), titleMedium(16), titleSmall(14), bodyLarge(16), bodyMedium(14), bodySmall(12), labelLarge(14), labelMedium(12), labelSmall(11)
カスタム実装が既存コンポーネントで代替できないか確認する。
| パターン | 代替コンポーネント |
|---|---|
| 手動の角丸+影+背景カード | Card(elevation:) |
| カスタムボタンスタイル | .buttonStyle(.primary/.secondary/.tertiary) + .buttonSize() |
| タイトル付きカードセクション | SectionCard(title:elevation:) |
| カスタムアイコンバッジ | IconBadge(systemName:size:) |
| カスタム進捗表示 | ProgressBar |
| カスタムテキスト入力 | DSTextField |
| カスタム通知バナー | Snackbar |
| タグ/フィルター UI | Chip + .chipStyle(.filled/.outlined) |
| フローティングボタン | FloatingActionButton |
| グリッドレイアウト | AspectGrid |
| チェック項目 | 基準 | 重大度 |
|---|---|---|
accessibilityLabel | インタラクティブ要素に必須 | Critical |
| タップターゲット | 最小 44x44pt | Critical |
| Dynamic Type | .typography() 使用で自動対応 | Warning |
| reduce motion | .animate() 使用で自動対応 | Warning |
| コントラスト比 | on* カラーと * カラーのペア使用 | Warning |
| チェック項目 | 基準 | 重大度 |
|---|---|---|
| ThemeProvider | ルートに .theme(themeProvider) | Critical |
| Environment 宣言 | @Environment(\.colorPalette) 等 | Critical |
| ダークモード | colors.surface / colors.onSurface 等のペア使用 | Warning |
| テーマ切替 | 複数テーマで表示が崩れないか | Recommendation |
| 必須 Preview | 説明 | 重大度 |
|---|---|---|
| Default | 通常状態 | Warning |
| Dark Mode | .theme(ThemeProvider(initialMode: .dark)) | Warning |
| Large Text | .environment(\.sizeCategory, .accessibilityExtraLarge) | Recommendation |
| Compact | 最小コンテンツ | Recommendation |
| Edge Case | 長文、大量データ | Recommendation |
.theme(ThemeProvider()) | すべての Preview に必須 | Critical |
| チェック項目 | 基準 | 重大度 |
|---|---|---|
| View の body 行数 | 40行以下推奨 | Recommendation |
| ViewModifier 抽出 | 繰り返しの修飾は ViewModifier に | Recommendation |
| サブView 分割 | 独立した論理単位は別 View に | Recommendation |
import DesignSystem | 必須 | Critical |
| レベル | 意味 | 対応 |
|---|---|---|
| Critical | Design System 違反。修正必須 | 即座に修正 |
| Warning | 推奨パターンからの逸脱 | 早めに修正 |
| Recommendation | 改善提案 | 次回以降に検討 |
# Design System 監査レポート
**対象**: `FileName.swift`
**日時**: YYYY-MM-DD
**スコア**: X / 6 カテゴリ合格
## サマリー
| カテゴリ | 結果 | Critical | Warning | Recommendation |
|---------|------|----------|---------|----------------|
| トークン準拠性 | ✅/❌ | 0 | 0 | 0 |
| コンポーネント使用 | ✅/❌ | 0 | 0 | 0 |
| アクセシビリティ | ✅/❌ | 0 | 0 | 0 |
| テーマ対応 | ✅/❌ | 0 | 0 | 0 |
| Preview カバレッジ | ✅/❌ | 0 | 0 | 0 |
| 構造品質 | ✅/❌ | 0 | 0 | 0 |
## 詳細
### 🔴 Critical
1. **[トークン準拠性]** L15: `.foregroundColor(.red)` → `.foregroundStyle(colors.error)`
2. **[テーマ対応]** L3: `@Environment` 宣言なし → `@Environment(\.colorPalette) private var colors` を追加
### 🟡 Warning
1. **[トークン準拠性]** L22: `.padding(16)` → `.padding(spacing.lg)`
### 🟢 Recommendation
1. **[構造品質]** body が 55 行 → サブView に分割を検討
// Before
.foregroundColor(.red)
.background(Color.white)
.foregroundColor(.gray)
// After
.foregroundStyle(colors.error)
.background(colors.surface)
.foregroundStyle(colors.onSurfaceVariant)
// Before
.padding(16)
VStack(spacing: 8) { ... }
// After
.padding(spacing.lg)
VStack(spacing: spacing.sm) { ... }
// Before
.font(.system(size: 14, weight: .medium))
.font(.title)
// After
.typography(.bodyMedium)
.typography(.titleLarge)
// Before
.animation(.easeOut(duration: 0.1), value: isActive)
// After
.animate(motion.tap, value: isActive)
// Before
content
.padding(16)
.background(Color.white)
.clipShape(RoundedRectangle(cornerRadius: 12))
.shadow(color: .black.opacity(0.1), radius: 4, y: 2)
// After
Card(elevation: .level2) {
content
}