designmd.me مقابل Design Extractor
يحوّل كلٌّ من designmd.me و Design Extractor رابط موقع الويب إلى ملف DESIGN.md لوكيل البرمجة بالذكاء الاصطناعي لديك. ملف Design Extractor يتبع مواصفات DESIGN.md من Google، ويقدّم كل مكوّن يختاره من الصفحة على شكل وصفة HTML و CSS يستطيع وكيلك إعادة بنائها. ويُتحقَّق من كل وصفة مقابل الموقع الحي، أو تُعلَّم مع ذكر السبب. ويعمل أيضًا على المواقع التي لا تستجيب إلا للزوار من دول معينة.
هل الصيغة جديدة عليك؟ اقرأ أولًا ما هو ملف DESIGN.md.
تم التحقق في بالرجوع إلى designmd.me، صفحة الأسعار لديه، مرجع CLI الخاص به، صفحة Figma لديه وملف في قسم Discover لديه. العروض والأسعار تتغير، لذا تحقّق من موقعهم قبل أن تقرر.
لماذا Design Extractor
يتبع مواصفات DESIGN.md من Google
لا تستخدم مقدمة YAML (front matter) إلا الخصائص التي تعرّفها المواصفات، دون أي مفاتيح مخصصة في المستوى الأعلى. وتأتي الأقسام المعيارية بترتيب المواصفات، من Overview إلى Do's and Don'ts. ولا تستخدم مدخلات المكونات في مقدمة YAML إلا الخصائص الثماني التي تحددها المواصفات، بقيم صريحة. يمكنك فحص أي ملف باستخدام DESIGN.md Validator المجاني.
وصفة لكل مكوّن يختاره من الصفحة
الترويسة والتذييل والأزرار وحقول الإدخال والبطاقات وغيرها من المكونات المختارة من الصفحة تأتي كلٌّ منها على شكل وصفة: شيفرة HTML و CSS مختزلة بقيم صريحة، داخل قسم Components في ملف DESIGN.md. تسرد كل وصفة أجزاءها وحالات التمرير (hover) والتركيز (focus) التي رُصدت على الموقع، ليتمكن وكيل البرمجة لديك من إعادة بناء المكوّن بدل تخمينه.
مُتحقَّق منه مقابل الموقع الحي
تُعرض كل وصفة وحدها ويُتحقَّق منها مقابل الموقع الحي: مطابقة بنيوية بين الأجزاء المعروضة وما قيس على الصفحة، ومقارنة على مستوى البكسل مع لقطة جديدة للعنصر الحقيقي. الوصفة التي تفشل يُعاد بناؤها ويُتحقَّق منها مرة أخرى. وإن ظلت لا تجتاز الفحص فإنها تُعلَّم مع ذكر السبب، ولا تُقدَّم أبدًا على أنها مُتحقَّق منها. تعرض صفحة النتيجة مدى تطابق المكونات وعدد ما تغطيه من ألوان الموقع وأنماط نصوصه: شاهد Stripe في المعرض.
يعمل على المواقع المقيّدة جغرافيًا
بعض المواقع لا تستجيب إلا للزوار من دول معينة. عندما تفشل عملية لهذا السبب، تعرض صفحة النتيجة أداة لاختيار الدولة، تتصدرها الدول التي تبيّن أن الصفحة تُحمَّل منها، ثم تُجري عملية الاستخراج نفسها عبر متصفح في الدولة التي تختارها. تكلّف العملية عبر دولة أخرى سعر Pro مضافًا إليه رسم إضافي من الرصيد قدره 6 (المجموع: 16 رصيدًا). وإذا فشلت عملية الاستخراج، نعيد إليك رصيدك.
جنبًا إلى جنب
| designmd.me | Design Extractor | |
|---|---|---|
| التوافق مع المواصفات | يكتب مقدمة YAML تحتوي رموز المواصفات، إضافة إلى مفاتيح في المستوى الأعلى لا تعرّفها المواصفات، مثل source و themes و breakpoints. والأقسام من تصميمه الخاص، مرقّمة من Visual Theme & Atmosphere إلى Known Gaps. | يتبع مواصفات DESIGN.md من Google: مقدمة YAML لا تحتوي إلا خصائص المواصفات دون مفاتيح مخصصة في المستوى الأعلى، والأقسام المعيارية بترتيب المواصفات، ومدخلات مكونات تقتصر على خصائص المواصفات الثماني بقيم صريحة. |
| وصفات المكونات | كل مكوّن عبارة عن قائمة بقيم الأنماط، مثل الخلفية والخط والحشوة والحدود واستدارة الحواف، دون HTML. | كل مكوّن يختاره من الصفحة، مثل الترويسة والتذييل والأزرار وحقول الإدخال والبطاقات، يأتي على شكل وصفة: شيفرة HTML و CSS مختزلة في قسم Components، ليتمكن وكيل البرمجة لديك من إعادة بنائه. |
| التحقق مقابل الموقع الحي | غير متوفر | نعم. تُعرض كل وصفة وحدها ويُتحقَّق منها مقابل الموقع الحي: مطابقة بنيوية لأجزائها ومقارنة على مستوى البكسل. المكوّن الذي لا يجتاز الفحص يُعلَّم مع ذكر السبب، ولا يُقدَّم أبدًا على أنه مُتحقَّق منه. |
| المواقع المقيّدة جغرافيًا | غير متوفر | نعم. عندما يحظر موقع الزوار من بعض الدول، تعرض العملية الفاشلة أداة لاختيار الدولة، تتصدرها الدول التي تُحمَّل منها الصفحة، ثم تُجري عملية الاستخراج نفسها عبر متصفح هناك. تكلّف العملية عبر دولة أخرى سعر Pro مضافًا إليه رسم إضافي من الرصيد قدره 6 (المجموع: 16 رصيدًا). |
| ما هو | أداة توليد: الصق رابطًا واحصل على ملف DESIGN.md. من تطوير Crowdlinker. | أداة توليد: الصق رابطًا عامًا واحصل على ملف DESIGN.md لذلك الموقع. |
| الصفحات المقروءة | صفحة واحدة (صفحة الهبوط) أو عدة صفحات (أهم صفحات الموقع)، حسب اختيارك في كل عملية. | يأخذ مستوى Pro عينات من الصفحات الرئيسية للموقع. |
| السعر لكل عملية | رصيد قدره 4 للصفحة الواحدة، ورصيد قدره 8 لعدة صفحات، ولا يُخصم إلا عند النجاح. | 10 أرصدة لعملية استخراج Pro. ويُعاد الرصيد عن العمليات التي تفشل من جهتنا. |
| باقات الرصيد | 5 $ مقابل رصيد 50، و 15 $ مقابل رصيد 175، و 30 $ مقابل رصيد 375، أو شحن رصيد بمبلغ مخصص. لا تنتهي صلاحية الرصيد. | 5 $ مقابل رصيد 50، 10 $ مقابل رصيد 110، 25 $ مقابل رصيد 300. لا تنتهي صلاحية الرصيد. بلا اشتراك. |
| بداية مجانية | رصيد مجاني قدره 4 عند زيارتك الأولى، ورصيد إضافي قدره 20 عند إنشاء حساب. لا حاجة إلى بطاقة للبدء. | لا يوجد رصيد مجاني عند إنشاء حساب. المعرض والأدوات المجانية لا تكلّف شيئًا. |
| إضافات | ملف معاينة HTML (مقابل رصيد إضافي قدره 8)، واستيراد إلى Figma للمتغيرات (Variables) والأنماط (Styles) ولوحة (مقابل رصيد قدره 12، مرة واحدة لكل عملية توليد)، ومقارنات جنبًا إلى جنب بين موقعين. | عرض «المصدر» و«المعاينة» للملف ولوحة «النظام البصري» في صفحة النتيجة، إضافة إلى أدوات مجانية: أداة للتحقق من DESIGN.md، وأداة للعثور على الخطوط، وأداة لاستخراج لوحة الألوان. |
| أمثلة جاهزة | قسم Discover يضم مواقع مولَّدة، مع تصنيفات ولوحة صدارة. | معرض لعلامات تجارية مستخرجة مسبقًا، قراءته ونسخه مجانيان. |
| وصول الوكلاء | أداة CLI (@crowdlinker/designmdme) ومهارة وكيل (agent skill) لـ Claude Code و Cursor وغيرهما من الوكلاء المتوافقين مع المهارات. لا يوجد خادم MCP. | خادم MCP بعيد لـ Claude Code و claude.ai و ChatGPT و Codex و Cursor وغيرها من العملاء، وإضافة برمجية (plugin) لـ Claude Code و Codex. |
| إضافة المتصفح | غير متوفر | إضافة Chrome تستخرج علامة التبويب المفتوحة لديك. |
ما يقدّمه designmd.me
- رصيد مجاني عند الزيارة الأولى وعند إنشاء حساب، دون الحاجة إلى بطاقة للبدء.
- عمليات الصفحة الواحدة مقابل رصيد قدره 4 وعمليات الصفحات المتعددة مقابل 8، ولا يُخصم الرصيد إلا عند النجاح.
- صفحة عينة HTML واستيراد إلى Figma للمتغيرات (Variables) والأنماط (Styles)، كلٌّ منهما مقابل رصيد إضافي.
- مقارنات جنبًا إلى جنب بين أنظمة التصميم لموقعين.
- أداة CLI ومهارة وكيل لـ Claude Code و Cursor وغيرهما من الوكلاء المتوافقين مع المهارات.
أين يختلفان
تُعيد الأداتان ملف DESIGN.md من رابط. ويقدّم Design Extractor كل مكوّن يختاره من الصفحة على شكل وصفة ويتحقق منها مقابل الموقع الحي، فيعرف وكيلك أي المكونات يمكنه إعادة بنائها كما هي مكتوبة وأيها عُلِّم، مع السبب. شاهد ذلك على Stripe في المعرض.
ويأتيك Design Extractor أيضًا حيث تعمل. يستطيع وكيلك بدء عملية استخراج وقراءة النتيجة عبر خادم MCP، وإضافة Chrome تستخرج علامة التبويب المفتوحة لديك. شاهد مزيدًا من الملفات المكتملة في المعرض.
كيف تنتقل من designmd.me
- الصق رابط الموقع في الصفحة الرئيسية لـ Design Extractor وشغّل عملية استخراج Pro.
- احفظ النتيجة باسم DESIGN.md في جذر مستودعك بدلًا من الملف القديم. وتظل الإشارة إليه في AGENTS.md أو CLAUDE.md تعمل.
- لكي يُجري وكيلك عمليات الاستخراج بنفسه، اربط خادم MCP بدلًا من أداة CLI الخاصة بـ designmd.me.
الخلاصة
اختر Design Extractor إذا كنت تحتاج إلى ملف DESIGN.md يتبع مواصفات Google، مع وصفة لكل مكوّن يختاره من الصفحة، يُتحقَّق من كلٍّ منها مقابل الموقع الحي أو تُعلَّم مع ذكر السبب. ويصل إلى المواقع المقيّدة جغرافيًا. ويستطيع وكيلك تشغيله عبر MCP. أما designmd.me فيكلّف رصيدًا أقل لكل عملية، كما يوضح الجدول.
مقارنات أخرى
getdesign.md مقابل Design Extractor
مجموعة مختارة من ملفات DESIGN.md الجاهزة مقارنةً بملف DESIGN.md متوافق مع المواصفات من أي رابط، مع وصفات للمكونات مُتحقَّق منها على الموقع الحي.
Refero Styles مقابل Design Extractor
مكتبة مجانية كبيرة لأنماط المواقع مقارنةً بملف DESIGN.md متوافق مع المواصفات من أي رابط، مع وصفات للمكونات مُتحقَّق منها على الموقع الحي.
TypeUI مقابل Design Extractor
إضافة Chrome المجانية من TypeUI، التي تملأ قالبها الخاص من أنماط الصفحة المفتوحة في علامة التبويب، مقارنةً بملف DESIGN.md متوافق مع المواصفات مع وصفات للمكونات مُتحقَّق منها على الموقع الحي.
الأسئلة الشائعة
designmd.me مقابل Design Extractor: أسئلة
إجابات قصيرة عن designmd.me و Design Extractor، تم التحقق منها في 2026-10-20.
يبدأ مجانيًا: في 2026-10-20 حصل الزوار الجدد على رصيد مجاني قدره 4 ورصيد إضافي قدره 20 عند إنشاء حساب، دون بطاقة. بعد ذلك تبدأ باقات الرصيد من 5 $ مقابل رصيد قدره 50. وتكلّف عملية الصفحة الواحدة رصيدًا قدره 4 وعملية الصفحات المتعددة 8.
designmd.me. تبدأ باقاته من 5 $ مقابل رصيد قدره 50، وتبدأ باقاتنا من 5 $ مقابل رصيد قدره 50. تكلّف عملية الصفحات المتعددة في designmd.me رصيدًا قدره 8 وعملية الصفحة الواحدة 4، بينما تكلّف عملية Pro في Design Extractor رصيدًا قدره 10. وتكلّف معاينة HTML والاستيراد إلى Figma لديه رصيدًا إضافيًا.
ملف DESIGN.md يتبع مواصفات Google، مع رموز التصميم في مقدمة YAML، وكل مكوّن يختاره من الصفحة، مثل الترويسة والتذييل والأزرار وحقول الإدخال والبطاقات، على شكل وصفة من شيفرة HTML و CSS مختزلة. يُتحقَّق من كل وصفة مقابل الموقع الحي بمطابقة بنيوية ومقارنة على مستوى البكسل، والوصفة التي لا تجتاز الفحص تُعلَّم مع ذكر السبب.
لا. يقدّم designmd.me أداة CLI ومهارة وكيل، لكن لا يوجد خادم MCP. أما Design Extractor فهو خادم MCP بعيد: يتصل به claude.ai و Claude Desktop و ChatGPT و Claude Code عبر تسجيل الدخول، ويستخدم Codex و Cursor والسكربتات مفتاح API.
يستطيع Design Extractor إجراء عملية الاستخراج من دولة أخرى. بعد أن تفشل عملية لهذا السبب، تعرض صفحة النتيجة أداة لاختيار الدولة، تتصدرها الدول التي تُحمَّل منها الصفحة، ثم تُجري عملية الاستخراج نفسها عبر متصفح هناك. تكلّف العملية عبر دولة أخرى سعر Pro مضافًا إليه رسم إضافي من الرصيد قدره 6 (المجموع: 16 رصيدًا). وإذا فشلت عملية الاستخراج، نعيد إليك رصيدك.
نعم. كلاهما يُنتج ملف DESIGN.md يوضع في مستودعك، فيبقى إعداد وكيلك كما هو. شغّل الموقع عبر Design Extractor واستبدل الملف.
احصل على ملف DESIGN.md للموقع الذي تحتاجه
الصق أي رابط عام. يأخذ مستوى Pro عينات من الصفحات الرئيسية للموقع ويُعيد ملف DESIGN.md متوافقًا مع المواصفات، مع وصفات للمكونات مُتحقَّق منها على الموقع الحي.