مراجعة Google Stitch (2026): هل هي مجانية؟ الميزات، تصدير Figma، MCP والبدائل6 min read

Google Stitch هي أداة تصميم مجانية تعمل بالذكاء الاصطناعي من Google Labs تعمل على تحويل مطالبة نصية أو صورة أو مرجع موقع ويب إلى شاشات واجهة مستخدم عالية الدقة، ثم تتيح لك تحسينها على لوحة قماشية لا نهائية وتصديرها إلى Figma أو code أو Google AI Studio أو Antigravity. لقد بدأت في مايو 2025 كتجربة سريعة لواجهة المستخدم وأصبحت لوحة تصميم أصلية للذكاء الاصطناعي في مارس 2026. هذه المراجعة مخصصة للمصممين ومديري المنتجات والمؤسسين الذين يرغبون في معرفة ما يفعله Stitch بشكل جيد وأين يتوقف وما إذا كان يمكن أن يحل محل Figma.

تعكس الحقائق إعلانات Google الخاصة ومستندات مطور Google وتقارير المستخدم العامة اعتبارًا من نوفمبر 2026. يعد Stitch أحد منتجات Google Labs، لذا تتغير الميزات والحدود كثيرًا. قم بتأكيد التفاصيل الحالية على Stitch.withgoogle.com. تعتمد هذه المراجعة على المواد الرسمية لشركة Google وتقارير المستخدمين العامة.

حكمنا في سطر واحد: Stitch هي أفضل طريقة مجانية لاستكشاف اتجاهات واجهة المستخدم بسرعة، كما أن ارتباطاتها مع Google AI Studio وAntigravity مفيدة حقًا للمنشئين. إنه ليس بديلاً لـ Figma. يمكن أن يبدو الإخراج عامًا، وغالبًا ما تصل الصادرات إلى Figma كهيكل مسطح، ولا تنشر Google حدًا ثابتًا للطبقة المجانية أو خطة طويلة المدى. ستجد أدناه الميزات، والحدود، وFigma وتصدير التعليمات البرمجية، وMCP، وإرشادات خطوة بخطوة مع أمثلة للمطالبات، وما يقوله المستخدمون وأفضل البدائل، بما في ذلك Anima Playground.

في عصر الذكاء الاصطناعي، التصميم هو الكود. للتصميم مباشرةً باستخدام التعليمات البرمجية باستخدام الذكاء الاصطناعي، أو لتحويل تصميمات Figma الخاصة بك إلى تعليمات برمجية، استخدم ملعب أنيما: قم بوصف شاشة أو البدء من تصميم Figma، ثم استمر في التكرار على تطبيق قابل للتحرير يمكنك معاينته ونشره.

مراجعة Google Stitch: حكم سريع

الأفضل للاستكشاف المجاني وللمنشئين في حزمة Google. أقل ملاءمة للفرق التي تحتاج إلى مكونات Figma أصلية أو رقابة صارمة على العلامة التجارية أو منتج مضمون طويل الأجل.

ما هو جوجل ستيتش؟

Stitch هي تجربة من Google Labs تعمل على إنشاء واجهات مستخدم من اللغة الطبيعية والصور والسياقات الأخرى. استحوذت Google على Galileo AI في مايو 2025 وأطلقت Stitch في Google I/O في ذلك الشهر، والمبنية على Gemini 2.5. تم منح مستخدمي غاليليو 30 يومًا للترحيل. إذا بحثت عن Galileo AI، فهذا هو المنتج الذي حل محله.

الجدول الزمني لما تغير

ميزات Google Stitch في عام 2026

موجه أو صورة أو عنوان URL أو صوت لواجهة المستخدم

يمكنك البدء بشرح هدف العمل أو الشعور الذي تريده أو المرجع، بدلاً من رسم إطار سلكي. يقبل Stitch أيضًا الصور والنصوص والتعليمات البرمجية كسياق على اللوحة القماشية، ويمكنك التحدث إلى اللوحة القماشية للحصول على الانتقادات والتغييرات المباشرة. يحتوي مربع المطالبة على تبديل للتطبيقات والويب ومحدد نموذج، والذي تعرضه العروض التوضيحية الخاصة بشركة Google كخيارات مثل 3 Flash و3.1 Pro.

لوحة Infinite ووكيل التصميم ومدير الوكيل

تحتوي اللوحة القماشية على شاشات ومراجع وأفكار في مكان واحد. يقوم وكيل التصميم بالتفكير في المشروع بأكمله، ويقوم مدير الوكيل بتتبع العديد من الاستكشافات بالتوازي. في مؤتمر I/O 2026، أضافت Google ميزة البث في الوقت الفعلي، بحيث يمكنك مشاهدة Stitch وهي تنشئ صفحة ويمكنك توجيهها قبل أن تنتهي.

أنظمة التصميم و DESIGN.md

يمكن لـ Stitch استخراج نظام تصميم من أي عنوان URL، ويستخدم DESIGN.md، وهو ملف Markdown مع رموز التصميم المميزة في YAML بالإضافة إلى الأساس المنطقي المكتوب للألوان والنوع والمسافات والمكونات. يمكنك تصديره أو استيراده إلى مشروع Stitch آخر أو مشاركته مع وكيل ترميز. قامت Google بفتح مسودة المواصفات في أبريل 2026 حتى تتمكن الأدوات الأخرى من استخدامها.

نماذج أولية فورية

يمكنك ربط الشاشات معًا والضغط على تشغيل للنقر خلال التدفق. يمكن لـ Stitch أيضًا إنشاء شاشات تالية منطقية بنقرة واحدة، والتي تحدد الرحلة بسرعة. لمعرفة سبب أهمية التدفقات والنماذج الأولية في مراحل مختلفة، راجع الإطارات السلكية مقابل النماذج الأولية.

المشاركة والنشر والتصدير

من اللوحة، يمكنك إنشاء رابط قابل للمشاركة من خلال Google AI Studio، أو التصدير إلى Google Antigravity لإضافة منطق الواجهة الخلفية، أو النشر على الويب باستخدام Netlify. تسرد لوحة التصدير الخاصة بشركة Google في عرض I/O التجريبي Google AI Studio وGoogle Antigravity عبر MCP وFigma.

هل جوجل ستيتش مجاني؟ التسعير والحدود

نعم. Stitch مجانية باستخدام حساب Google على Stitch.withgoogle.com ولا توجد خطة مدفوعة. إنه أحد منتجات Google Labs، وهو متاح للأشخاص الذين تبلغ أعمارهم 18 عامًا أو أكثر في عدد كبير من البلدان، لذلك قد لا يتم تقديمه في كل مكان.

النصيحة العملية هي الاستكشاف في الوضع السريع، وحفظ النموذج الاحترافي للشاشات التي تخطط لشحنها، وتصدير العمل النهائي في نفس اليوم.

Google Stitch to Figma: كيف يعمل التصدير

يدعم Stitch النسخ إلى Figma واللصق، ويعرض Google Figma في لوحة التصدير الخاصة به. في الممارسة العملية، التفاصيل مهمة:

• تشير التقارير الواردة في منتدى مطوري Google وReddit إلى أن النسخ إلى Figma غير متاح للتصميمات التي تم إجراؤها في وضعي Thinking أو Pro، لذا فإن الجودة وتصدير Figma يمكن أن يسيرا في اتجاهين متعاكسين.
• يصف مستخدمو Reddit عمليات الاستيراد حيث يصل النص كمتجهات ويتم استخدام الإطارات كمسافات داخل التخطيط التلقائي، لذلك يجب إعادة بناء جزء كبير من النتيجة.
• الحل الشائع هو تنزيل كود Stitch وإحضاره إلى Figma باستخدام مكون إضافي مثل html.to.design، والذي يميل إلى توفير استيراد أكثر دقة.

يتمثل سير العمل المعقول في إنهاء التكرار في Stitch، والتصدير مرة واحدة، ثم إعادة بناء المكونات والرموز المميزة المناسبة في Figma. تؤدي كل عملية تجديد إلى إبطال عملية التنظيف اليدوي التي أجريتها في عملية تصدير سابقة. إذا كنت تريد وكيلًا داخل Figma يحترم مكوناتك بالفعل، فانظر إلى Anima’s Buddy أو عقدة UX Pilot.

تصدير كود Google Stitch وMCP

أنتجت Stitch رمزًا للواجهة الأمامية منذ إطلاقها، وتصف المراجعات HTML مع فئات Tailwind التي يمكن للمطورين استخدامها كنقطة بداية. تعامل معها على أنها سقالات: يعد مكون كبير يحتوي على بيانات ثابتة نتيجة شائعة، لذا خطط لتقسيم المكونات وحالة السلك.

يعد خادم Stitch MCP وSDK قصة المطورين الأكثر إثارة للاهتمام. يمكن لوكيل ترميز مثل Google Antigravity جلب مشروعك، وقراءة الرموز المميزة للتصميم والشاشات، والبناء منها. يقوم برنامج Google الخاص بالبرمجة عبر إنشاء مفتاح API في إعدادات Stitch، وإضافة Stitch MCP في Antigravity، وإنشاء DESIGN.md، وإنشاء موقع React وTailwind. يسرد مرجع MCP أدوات لإنشاء المشاريع، وإنشاء شاشات من النص، وتحرير الشاشات، وإنشاء المتغيرات وإدارة أنظمة التصميم، بما في ذلك تحميل DESIGN.md.

إذا كان هدفك النهائي هو تطبيق React أو HTML فعال وليس ملف تصميم، فقارن هذا المسار بـ ملعب أنيما، الذي ينشئ التطبيق القابل للتحرير مباشرةً.

كيفية استخدام Google Stitch: إرشادات خطوة بخطوة

تتبع هذه الإرشادات إعلانات Google ومستندات المطورين ومقاطع الفيديو التوضيحية الخاصة بـ I/O. تمثل المطالبات الواردة أدناه نقاط بداية لتجربتها بنفسك، وتختلف النتائج من تشغيل لآخر. الصور هي العناصر المرئية الرسمية لشركة Google، وتُنسب إليها هذه الصفة، بالإضافة إلى عرض واحد للصفحة المقصودة العامة. تتغير الغرز كثيرًا، لذا قد تختلف أسماء الأزرار وأسماء النماذج عند فتحها.

إذا كنت تريد أيضًا مقارنة الأدوات، فجرّب نفس مطالبة تبديل النباتات الموضحة أدناه في Stitch وفي UX Pilot. ملكنا مراجعة تجربة المستخدم التجريبية يوضح كيف تم ظهور هذه المطالبة هناك، حتى تتمكن من مقارنة الاثنين بقائمة التحقق في النهاية.

الخطوة 1: افتح Stitch وقم بتسجيل الدخول

انتقل إلى Stitch.withgoogle.com وقم بتسجيل الدخول باستخدام حساب Google. Stitch هو أحد منتجات Google Labs للأشخاص الذين تبلغ أعمارهم 18 عامًا أو أكثر في البلدان المدعومة. الصفحة المقصودة العامة عبارة عن مربع مطالبة واحد يحتوي على تبديل للتطبيق والويب وشريحة نموذجية وبعض الاقتراحات المبدئية.

في وقت كتابة هذا التقرير، تقرأ شريحة النموذج الموجودة على الصفحة العامة متوازن، بينما تعرض إطارات الإدخال/الإخراج التجريبية من Google أسماء النماذج مثل 3 Flash و3.1 Pro. تتغير الأسماء والخيارات بين الإصدارات، لذا اختر أيًا من الخيارات السريعة وعالية الجودة التي يقدمها التطبيق في اليوم.

الخطوة 2: اختر التطبيق أو الويب والنموذج

يخبر التبديل Stitch ما إذا كنت تصمم تطبيقًا جوالًا أصليًا أو صفحة ويب. يستخدم العرض التوضيحي الخاص بشركة Google الويب. بالنسبة لمطالبة تبديل المصنع أدناه، اختر التطبيق. لحماية أجيالك الحرة، استكشف باستخدام النموذج الأسرع واحتفظ بالنموذج عالي الجودة للشاشات التي تخطط لشحنها. تمت تغطية الحدود أعلاه في قسم التسعير.

الخطوة 3: اكتب مطالبة مع السياق

تتمثل إرشادات Google في البدء بهدف العمل، أو الشعور الذي تريد أن يشعر به المستخدمون، أو أمثلة لما يلهمك، بدلاً من الإطار السلكي. يقبل Stitch أيضًا الصور والنصوص والتعليمات البرمجية كسياق على اللوحة القماشية، ويمكنه استخراج نظام تصميم من عنوان URL. إليك المطالبة التجريبية الخاصة بشركة Google من فيديو الإدخال/الإخراج، كما هو موضح على الشاشة في صورة مربع المطالبة سابقًا في هذه المراجعة:

قم بإنشاء صفحة مقصودة سريعة الاستجابة لشركة Willamette Pizza Co. بالنسبة للوحة الألوان، فلنجعل الخلفية الأساسية هي اللون الأبيض الفاتح الدافئ، والخلفية الثانوية تكون زرقاء سماوية ساطعة وناعمة ولها لون أزرق سماوي نابض بالحياة…

وإليك ملخصًا يمكنك تجربته على كل من Stitch وUX Pilot. اختر التطبيق والصقه ثم أرسل:

تطبيق جوال لمجتمع تبادل النباتات في الحي: موجز منزلي، وصفحة تفاصيل النبات، وشاشة الدردشة. لهجة نظيفة وودية وخضراء.

النصائح التي تتبع إرشادات Google: قم بتسمية الشاشات التي تريدها، وحدد الشعور (نظيف، ودود)، وحدد لونًا مميزًا، وأرفق صورة مرجعية إذا كان لديك واحدة.

الخطوة 4: شاهده وهو ينشئ ويوجه

في مؤتمر I/O 2026، قالت Google إن Stitch الآن يقوم ببث أعماله مباشرة إلى اللوحة القماشية، حتى تتمكن من مشاهدة الصفحة وهي تتشكل. يتيح لك Stitch Agent توجيه التكرارات قبل أن تصبح النتيجة نهائية، ويقوم مدير Agent بتتبع العديد من الاستكشافات بالتوازي. في العرض التجريبي لـ Google، يمكنك أيضًا التحدث إلى اللوحة لطلب انتقادات أو تغييرات.

الخطوة 5: التعديل باستخدام مطالبات المتابعة

بمجرد وجود الشاشات، قم بتحسينها من خلال متابعات قصيرة في الدردشة، أو حدد شاشة واطلب التغيير. يسرد مرجع MCP الخاص بـ Stitch أيضًا أدوات لتحرير الشاشات وإنشاء المتغيرات، وهو أمر مفيد عندما تريد عدة اتجاهات لشاشة واحدة. متابعة يمكنك تجربتها على نتيجة مبادلة النبات:

اجعل تغذية المنزل عبارة عن شبكة مكونة من عمودين وأضف شريط بحث

عند مقارنة الأدوات، لاحظ ما إذا كانت بقية الشاشة ستظل كما هي بعد التعديل، لأن تعديلات نمط إعادة الإنشاء يمكن أن تغير المناطق التي لم تسأل عنها.

الخطوة 6: تطبيق نظام التصميم باستخدام DESIGN.md

يمكن لـ Stitch سحب نظام تصميم من عنوان URL، ويقوم بتخزين قواعد التصميم في DESIGN.md، وهو ملف Markdown يحتوي على رموز مميزة ومبررات مكتوبة. يمكنك تصديره أو استيراده إلى مشروع Stitch آخر أو تسليمه إلى وكيل البرمجة. يطبق العرض التوضيحي من Google نظام تصميم على موقع كامل من خلال مطالبة بلغة بسيطة:

تطبيق نظام التصميم هذا على الموقع بأكمله.

الخطوة 7: اربط الشاشات واضغط على تشغيل

تقول Google أنه يمكنك تجميع الشاشات معًا في ثوانٍ والنقر فوق “تشغيل” لمعاينة التدفق. يمكن لـ Stitch أيضًا إنشاء شاشات تالية منطقية بنقرة واحدة، مما يساعدك على رسم خريطة لرحلة سريعة. بالنسبة لتطبيق تبادل النباتات، قم بربط الموجز بصفحة التفاصيل وصفحة التفاصيل بالدردشة، ثم انقر فوقه.

الخطوة 8: المشاركة والتصدير

عند الانتهاء، افتح التصدير. يُظهر العرض التوضيحي لـ I/O من Google Google AI Studio وGoogle Antigravity عبر MCP وFigma. يمكنك أيضًا إنشاء رابط قابل للمشاركة من خلال AI Studio، أو النشر على الويب باستخدام Netlify. بالنسبة للمطورين، يحتاج Stitch MCP وSDK إلى مفتاح API من إعدادات Stitch، كما يصف ذلك برنامج Google Codelab. اقرأ ملاحظات تصدير Figma أعلاه قبل الاعتماد على Copy to Figma.

قائمة مرجعية للحكم على النتيجة الخاصة بك

• هل كل شاشة قمت بتسميتها موجودة، وتحتوي على محتوى واقعي بدلاً من النص النائب؟
• هل لون التمييز ونوعه متسقان عبر الشاشات؟
• بعد مطالبة التعديل، هل تغيرت المنطقة المطلوبة فقط؟
• كم عدد الأجيال التي استخدمت فيها عملية الاستكشاف، وكم استغرقت عملية التنظيف في فيجما؟

المصادر: جوجل إعلان تصميم فيبي، ال تحديث تصميم الإدخال/الإخراج في الوقت الفعلي و إعلان DESIGN.md.

ماذا يقول المستخدمون عن Google Stitch

• أشاد: السرعة، وطبقة مجانية سخية، وتوليد شاشات متعددة، واللوحة، واستخراج نظام التصميم، وروابط المطورين بـ AI Studio، وAntigravity، وMCP.
• انتقد: مخرجات عادية أو عامة حتى مع المراجع، وضعف التحكم في SaaS والتصميمات المؤسسية المعقدة، وصادرات Figma التي تحتاج إلى إعادة البناء، وبلوغ الحد الأقصى للجيل الشهري، والإبلاغ عن أخطاء الإنشاء العرضية في منتدى Google.

يقول أحد المصممين في r/UX_Design إن Stitch هي “أداة رائعة للتفكير والتكرار السريع” ولكن النتائج ظلت “بسيطة وعامة جدًا” حتى بعد إضافة المراجع. يقول أحد مستخدمي r/StitchAI إن الكثير مما استعادوه يجب إعادة إنشائه من الصفر بعد الاستيراد إلى Figma. كلاهما تقارير فردية، وليست معدلات مقاسة.

جوجل ستيتش إيجابيات وسلبيات

Google Stitch vs Figma: هل يمكن لـ Stitch استبدال Figma؟

لا، وجوجل لا تضع الأمر على هذا النحو. تمتلك Stitch مرحلة صفر إلى واحد: استكشاف الاتجاهات والحصول على التصميم الأول وتسليمه إلى الكود. تمتلك Figma التحسينات والمكونات والمتغيرات والتعاون والتسليم للفرق الكبيرة. يلتقي الاثنان عند خطوة التصدير، حيث يوجد معظم الاحتكاك.

إذا كنت تريد رؤية أداة النموذج الأولي للذكاء الاصطناعي الخاصة بـ Figma، فاقرأ دليلنا صنع فيجما.

أفضل بدائل جوجل ستيتش

1. ملعب أنيما

اختر Anima Playground عندما تريد التصميم مباشرة بالكود. قم بوصف شاشة أو ابدأ من تصميم Figma أو صورة أو عنوان URL لموقع ويب، ثم استمر في التكرار على تطبيق HTML أو React قابل للتحرير يمكنك معاينته ومشاركته ونشره. Stitch هي أداة استكشاف التصميم التي تصدر التعليمات البرمجية. يتعامل تطبيق Playground مع تطبيق العمل باعتباره التصميم، بحيث تكون المسافات والحالات والسلوك المستجيب مرئية أثناء التكرار. إنه ليس مصدرًا لطبقات Figma الأصلية، لذا قم بإقرانه مع المكون الإضافي Anima Figma أو Buddy إذا كنت بحاجة إلى ذلك.

2. تجربة المستخدم

أفضل للفرق التي تركز على Figma: يعمل Nodey داخل Figma، ويستورد مكوناتك وينشئ طبقات أصلية. يكلف أرصدة تتجاوز البدل اليومي المجاني. انظر لدينا مراجعة تجربة المستخدم التجريبية.

3. صنع الشكل

نماذج أولية تفاعلية داخل Figma. يقرأ ما هو صنع فيجما أو مقارنة بين Figma Make و Anima Playground.

4. كلود ديزاين

المفاهيم والشرائح والنماذج الأولية التي تقودها الدردشة مع تسليم كلود كود. انظر لدينا مراجعة كلود ديزاين.

5. الأصدقاء من أنيما

وكيل تصميم AI داخل Figma يستخدم سياق نظام التصميم الخاص بك. اختره إذا كنت تريد البقاء على لوحة Figma.

من يجب عليه استخدام Google Stitch؟

• المؤسسون ورؤساء الوزراء الذين يحتاجون إلى تصميم أولي موثوق به دون دفع ثمن الأداة.
• المصممين استكشاف العديد من الاتجاهات قبل فتح الشكل.
• المطورين الذين يريدون سياق التصميم لـ Antigravity أو وكيل آخر قادر على MCP.

ابحث في مكان آخر إذا أنت بحاجة إلى رقابة صارمة على العلامة التجارية، أو مكونات Figma الأصلية، أو القدرة المضمونة، أو منتج مستقر طويل الأجل.

الحكم النهائي: هل يستحق Google Stitch ذلك؟

نعم، كأداة استكشاف مجانية. استخدمه للحصول على عدة اتجاهات بسرعة، ثم انقل الفائز إلى Figma أو وكيل الترميز، وقم بالتصدير في نفس اليوم. لا تخطط لسير عمل الوكالة حول هذا الموضوع حتى تنشر Google الحدود وخريطة الطريق. إذا كنت تريد أن يظل التصميم والتطبيق العامل معًا، فجرّب Anima Playground بعد ذلك.

التصميم مباشرة بالبرمجة باستخدام الذكاء الاصطناعي

التصميم باستخدام الذكاء الاصطناعي: قم بوصف شاشة أو تحويل تصميمات Figma إلى تعليمات برمجية.

الأسئلة الشائعة حول Google Stitch

ما هو جوجل ستيتش؟

Google Stitch هي إحدى أدوات Google Labs AI التي تنشئ تصميمات عالية الدقة لواجهة المستخدم وأكواد الواجهة الأمامية من المطالبات النصية والصور والسياقات الأخرى على لوحة قماشية لا حصر لها. تم إطلاقه في مايو 2025 ليحل محل Galileo AI، الذي استحوذت عليه Google.

هل جوجل ستيتش مجاني؟

نعم. Stitch مجاني باستخدام حساب Google وليس لديه خطة مدفوعة. يتم تطبيق حدود الإنشاء الشهرية، وقد أشار دعم Google إلى 350 جيلًا قياسيًا و50 جيلًا تجريبيًا شهريًا في أغسطس 2025. تختلف التقارير اللاحقة، لذا تحقق من الحد الحالي في التطبيق.

كيف يمكنني تسجيل الدخول إلى Google Stitch؟

انتقل إلى Stitch.withgoogle.com وقم بتسجيل الدخول باستخدام حساب Google. Stitch هو أحد منتجات Google Labs للمستخدمين الذين تبلغ أعمارهم 18 عامًا أو أكثر، وقد لا يكون متاحًا في كل البلدان.

هل يمكن لـ Google Stitch التصدير إلى Figma؟

نعم، مع النسخ إلى الشكل واللصق، ولكن تم الإبلاغ عن عدم توفره في بعض الأوضاع وغالبًا ما يصل كطبقات مسطحة. يقوم العديد من المستخدمين بتنزيل الكود واستيراده باستخدام مكون إضافي مثل html.to.design بدلاً من ذلك.

هل لدى Google Stitch خادم MCP؟

نعم. يتيح خادم Stitch MCP وSDK لوكلاء البرمجة مثل Google Antigravity قراءة مشاريعك وإنشاء الشاشات واستخدام نظام التصميم الخاص بك. يمكنك إنشاء مفتاح API في إعدادات Stitch للاتصال.

ما هي أفضل بدائل Google Stitch؟

يعد Anima Playground خيارًا قويًا إذا كنت تريد تطبيق HTML أو React قابلاً للتحرير من تصميم موجه أو Figma. يناسب UX Pilot فرق Figma، ويناسب Figma Make النماذج الأولية التفاعلية في Figma، ويناسب Claude Design المفاهيم التي تقودها الدردشة.