احصل على تصميم الذكاء الاصطناعي: التقاط واجهة المستخدم الحية وتحويلها إلى كود قابل للاستخدام
احصل على تصميم AI، بواسطة فيكتور أودايني، يربط واجهات الويب الحية بعملاء البرمجة الذكية لوظائف نماذج الواجهة الأمامية. يستخرج أجزاء الواجهة المرئية من صفحات الويب ويحولها إلى مقتطفات من الشيفرات يمكن للمطورين إعادة استخدامها في المشاريع والنماذج المدعومة بالذكاء الاصطناعي. تركز الإضافة على الالتقاط السريع، والتصدير إلى تنسيقات الشيفرات الشائعة على الويب، وعملية عمل جاهزة للحافظة لأدوات الذكاء الاصطناعي. تستهدف مطوري الواجهة الأمامية، ومصممي واجهات المستخدم، ومبرمجي الأجواء الذين يستخدمون عملاء الذكاء الاصطناعي لتسريع بناء الواجهات.
ماذا يمكن أن تلتقط الإضافة من صفحة حية؟
تستخدم الأداة محددًا عند التمرير للسماح للمستخدمين باختيار عناصر واجهة فردية على موقع ويب مباشر ونسخ هيكل العنصر وأنماطه إلى الحافظة، دون الحاجة إلى الوصول إلى كود مصدر الموقع. يدعم هذا السلوك سير العمل الذي يأخذ عينات من الصفحات الحقيقية مباشرة في المتصفح، مما يسمح للمطورين والمصممين باختبار الأجزاء المستخرجة على مشاريع تجريبية أو محلية قبل دمجها في التطبيقات.
كيف تتناسب مع سير العمل المدفوع بالذكاء الاصطناعي؟
تم بناء الإضافة لسير عمل مباشر من المتصفح إلى وكيل الذكاء الاصطناعي وهي محسّنة للصق النتائج في مساعدي الترميز. تشمل المنصات المتوافقة:
- Lovable
- v0
- Cursor
- Claude و Gemini (أيضًا مدرجة كمتوافقة)
ما هي تنسيقات الكود ومخرجات المكونات التي تنتجها؟
تقوم الإضافة بتصدير العناصر الملتقطة كـ HTML، وCSS مضمن، وTailwind CSS، أو React/JSX، ويمكنها تجميع أنماط واجهة المستخدم المعقدة كـ مكونات JSX قابلة لإعادة الاستخدام. يصف المصدر الناتج بأنه مناسب للاستخدام في الإنتاج، والأداة مصممة للعمل بشكل جيد مع الأطر التي تركز على الأدوات مثل Tailwind عندما يقوم المستخدمون بتكييف المقاطع المستخرجة في قواعد كود أكبر.
لمن وأي المتصفحات تم تصميمها؟
تستهدف الإضافة مهندسي الواجهة الأمامية، ومصممي واجهة المستخدم/تجربة المستخدم، ومبرمجي الأجواء وتعمل على Google Chrome ومتصفحات أخرى قائمة على Chromium بما في ذلك Brave وEdge وVivaldi. يرتبط المطور بحركة برمجة الأجواء ونظام DESIGN.md. يوصف المشروع بأنه خفيف الوزن ومصمم للعمل عبر أي موقع ويب مباشر، ويخدم حاليًا قاعدة مستخدمين صغيرة ومتخصصة مع تقييمات عامة محدودة.
عملي لتصميم النماذج الأولى المعتمدة على الذكاء الاصطناعي، ولكن في مرحلة الاعتماد المبكر
يعد Get Design AI خيارًا عمليًا للمطورين والمصممين الذين يعتمدون على وكلاء الذكاء الاصطناعي لتسريع بناء الواجهات، حيث يربط بين التقاط المتصفح وتدفقات عمل الوكلاء. أحد المقايضات هو بصمته في مرحلة مبكرة: قاعدة مستخدمين صغيرة ومتخصصة وتقييمات عامة محدودة تشير إلى أن الاعتماد لا يزال في طور النشوء. من أجل تكامل أكثر أمانًا، اختبر الاستخراجات على صفحات غير إنتاجية وراجع المقاطع التي تم إنشاؤها قبل إضافتها إلى قاعدة الشيفرة.
