/ الدليل / الملعب / Apple-Hig-Designer
← كل الخوادم ↗ GitHub
● مجتمع axiaoge2 ⚡ فوري

Apple-Hig-Designer

بواسطة axiaoge2 · axiaoge2/Apple-Hig-Designer

صمّم شاشات تتبع فعلاً إرشادات Apple لتجربة المستخدم — Claude يفحص التخطيط والطباعة والتفاعلات مقابل HIG.

Apple-Hig-Designer هي أداة Agent Skill تحمّل إرشادات Apple لتجربة المستخدم في ذاكرة Claude العاملة لمهام التصميم: إنتاج نماذج SwiftUI/UIKit، نقد التخطيطات الموجودة، اختيار مكونات النظام الصحيحة، واتباع رموز الطباعة والمسافات والألوان على المنصة. تعمل سواء كنت تصمم تطبيق iPhone جديد أو تدقق تطبيق موجود.

▶ شاهد العرض 📦 التثبيت 💡 حالات الاستخدام

لماذا تستخدمه

الميزات الأساسية

عرض مباشر

كيف يبدو في الممارسة

apple-hig-designer-skill.replay ▶ جاهز
0/0

التثبيت

اختر العميل

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "apple-hig-designer-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/axiaoge2/Apple-Hig-Designer",
        "~/.claude/skills/Apple-Hig-Designer"
      ],
      "_inferred": true
    }
  }
}

افتح Claude Desktop → Settings → Developer → Edit Config. أعد التشغيل بعد الحفظ.

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "apple-hig-designer-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/axiaoge2/Apple-Hig-Designer",
        "~/.claude/skills/Apple-Hig-Designer"
      ],
      "_inferred": true
    }
  }
}

يستخدم Cursor نفس مخطط mcpServers مثل Claude Desktop. إعدادات المشروع أولى من الإعدادات العامة.

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "apple-hig-designer-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/axiaoge2/Apple-Hig-Designer",
        "~/.claude/skills/Apple-Hig-Designer"
      ],
      "_inferred": true
    }
  }
}

انقر على أيقونة MCP Servers في شريط Cline الجانبي، ثم "Edit Configuration".

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "apple-hig-designer-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/axiaoge2/Apple-Hig-Designer",
        "~/.claude/skills/Apple-Hig-Designer"
      ],
      "_inferred": true
    }
  }
}

نفس الصيغة مثل Claude Desktop. أعد تشغيل Windsurf لتطبيق التغييرات.

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "apple-hig-designer-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/axiaoge2/Apple-Hig-Designer",
        "~/.claude/skills/Apple-Hig-Designer"
      ]
    }
  ]
}

يستخدم Continue مصفوفة من كائنات الخادم بدلاً من خريطة.

~/.config/zed/settings.json
{
  "context_servers": {
    "apple-hig-designer-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/axiaoge2/Apple-Hig-Designer",
          "~/.claude/skills/Apple-Hig-Designer"
        ]
      }
    }
  }
}

أضف إلى context_servers. يعيد Zed التحميل تلقائيًا عند الحفظ.

claude mcp add apple-hig-designer-skill -- git clone https://github.com/axiaoge2/Apple-Hig-Designer ~/.claude/skills/Apple-Hig-Designer

أمر من سطر واحد. تحقق باستخدام claude mcp list. احذف باستخدام claude mcp remove.

حالات الاستخدام

استخدامات عملية: Apple-Hig-Designer

كيفية رسم شاشة iOS تتبع HIG

👤 مطورو iOS والمصممون في الفرق الوظيفية المتعددة ⏱ ~25 min intermediate

متى تستخدمه: تحتاج إلى تخطيط أول لشاشة جديدة وتريد تجنب تعلم HIG من الصفر.

المتطلبات الأساسية
  • تم استنساخ الأداة — git clone https://github.com/axiaoge2/Apple-Hig-Designer ~/.claude/skills/Apple-Hig-Designer
الخطوات
  1. وصف الشاشة
    ارسم شاشة Settings > Notifications لـ iPhone — أنماط iOS 18 القياسية.✓ تم النسخ
    → قائمة مجمعة، صفوف بتفاصيل على اليمين، رؤوس أقسام صحيحة — استشهادات HIG مضمنة
  2. إنتاج SwiftUI
    أنشئ كود SwiftUI باستخدام Form/List والألوان النظامية.✓ تم النسخ
    → SwiftUI بطريقة أصلية مع .listStyle(.insetGrouped)، Toggle، NavigationLink
  3. التحقق من الوضع الداكن
    اضبط للوضع الداكن — تأكد من استخدام .primary / .secondary، وليس hex مشفرة.✓ تم النسخ
    → تأكيد الألوان الدلالية

النتيجة: شاشة تبدو أصلية في المعاينة الأولى ولن يتم رفضها في المراجعة.

المزالق
  • تصميم مخصص يتعارض مع النظام — اسأل Claude 'ما الطريقة القياسية لـ HIG؟' قبل أي تصميم مخصص
اجمعها مع: ios-simulator-skill

تدقيق شاشة موجودة مقابل HIG

👤 مراجعو التصميم والقادة التقنيون ⏱ ~20 min beginner

متى تستخدمه: قبل الإطلاق، تريد رأياً ثانياً بشأن توافق HIG.

الخطوات
  1. مشاركة لقطة شاشة أو كود
    إليك لقطة شاشة لشاشة Profile الخاصة بنا. ضع علامة على انحرافات HIG.✓ تم النسخ
    → ملاحظات محددة مع مراجع HIG
  2. ترتيب الأولويات
    رتب النتائج حسب التأثير — ما الذي قد يهتم به المراجع فعلاً؟✓ تم النسخ
    → قائمة مرتبة، وليس تصريف مسطح
  3. اقتراح الإصلاحات
    للثلاثة الأولى، أظهر لي تغييرات SwiftUI ملموسة.✓ تم النسخ
    → فروقات الكود

النتيجة: قائمة إصلاحات مركزة ذات أهمية، وليست تفاصيل دقيقة.

المزالق
  • التدقيق دقيق جداً — مشاكل المسافات بـ 1px — اطلب النتائج المرجحة بالتأثير فقط
اجمعها مع: filesystem

اختر بين أنماط iOS و iPadOS و macOS لتطبيق مشترك

👤 الفرق التي تبني تطبيق SwiftUI متعدد المنصات ⏱ ~30 min advanced

متى تستخدمه: نفس الميزة تحتاج معاملة مختلفة على الهاتف مقابل iPad مقابل Mac.

الخطوات
  1. حدد الميزة
    لدينا ميزة Library. ما شكل الملاحة الصحيح لكل منصة؟✓ تم النسخ
    → Tab bar / Sidebar / NavigationSplitView مُعيّنة للمنصات مع التفكير
  2. اختر الأساليب الأولية
    أي أساليب SwiftUI الأولية يجب أن نستخدمها لكل منصة لتجنب الحيل؟✓ تم النسخ
    → اختيارات أساليب أولية خاصة بالمنصة

النتيجة: تقسيم تصميم يطابق HIG لكل منصة وسهل التنفيذ.

المزالق
  • iPad كـ 'iPhone كبير' — يفتقد مؤشر الماوس وأنماط الأعمدة المتعددة — اطلب من Claude أن يعدد الخصائص الخاصة بـ iPadOS قبل نسخ UX الخاص بـ iPhone

التركيبات

اجمعها مع خوادم MCP أخرى لتحقيق نتائج x10

apple-hig-designer-skill + ios-simulator-skill

عرّض SwiftUI المُنشأ وافحصه في iOS Simulator

عرّض هذا SwiftUI في iPhone 16 simulator وتأكد من أنه يطابق موجز HIG.✓ تم النسخ
apple-hig-designer-skill + filesystem

طبق الرقع المقترحة عبر كود التطبيق

طبق إصلاحات التدقيق على Views/Profile/✓ تم النسخ

الأدوات

ما يوفره هذا الـ MCP

الأداةالمدخلاتمتى تستدعيهاالتكلفة
hig-layout-design screen intent + platform الشاشات أو الميزات الجديدة 0
hig-audit screenshot or SwiftUI code مراجعة ما قبل الإطلاق 0
swiftui-snippet pattern name خطوة التنفيذ 0

التكلفة والحدود

تكلفة التشغيل

حصة API
لا يوجد
الرموز لكل استدعاء
رموز 3–8k لكل شاشة
التكلفة المالية
مجاني
نصيحة
حدد الرسم لشاشة واحدة في المرة؛ HIG طويل — لا تحاول إغراء Claude لاستشهاد كل شيء

الأمان

الصلاحيات والأسرار ونطاق الأثر

تخزين بيانات الاعتماد: لا يوجد
نقل البيانات الخارجي: لا يوجد

استكشاف الأخطاء

الأخطاء الشائعة وحلولها

Suggestions feel dated

أخبر Claude بإصدار iOS الذي تستهدفه؛ يختلف HIG عبر الإصدارات.

SwiftUI uses deprecated modifiers

حدد الحد الأدنى لإصدار iOS بشكل صريح.

البدائل

Apple-Hig-Designer مقابل البدائل

البديلمتى تستخدمهاالمقايضة
the-unofficial-swift-programming-language-skillتحتاج إلى مساعدة على مستوى اللغة، وليس تصميم HIGاللغة، وليس واجهة المستخدم
cupertinoتريد MCP متصلاً بمستندات Apple الحيةMCP حي مقابل أداة مخزنة مؤقتاً

المزيد

الموارد

📖 اقرأ ملف README الرسمي على GitHub

🐙 تصفح القضايا المفتوحة

🔍 تصفح أكثر من 400 خادم MCP و Skills