Awesome GitHub RepositoriesWireframing Software

This project is a community-driven repository that serves as a comprehensive directory for the design industry. It provides a structured index of software, plugins, and digital assets, helping creative professionals discover and evaluate tools tailored to specific stages of the design process. The collection is maintained through a decentralized, community-driven model where external contributors submit and verify entries to ensure the information remains current. To assist users in navigating the complex ecosystem of design technology, the repository employs a hierarchical taxonomy that orga

draw-a-ui is an AI vision UI generator and sketch-to-code tool that transforms hand-drawn sketches and digital wireframes into functional HTML and CSS. It serves as a mockup-to-HTML converter that interprets user interface layouts from images to produce corresponding web markup. The system utilizes vision-capable language models to automate the transition from visual design to web code. It employs a multimodal inference loop to process canvas snapshots and natural language instructions, generating structural layouts and responsive grid systems without the need for pre-defined component templa

Wired-elements هي مكتبة مكونات ويب مرسومة باليد توفر مجموعة من عناصر HTML المنمقة لبناء الهياكل السلكية (wireframes) والنماذج الأولية. تعمل كإطار عمل لواجهة مستخدم للهيكلة السلكية يتيح إنشاء نماذج أولية منخفضة الدقة بجمالية تخطيطية يدوية. توفر المكتبة مكونات لتصميم الويب المرسوم باليد والنماذج الأولية السريعة لواجهة المستخدم. تم تصميم هذه العناصر لدعم الهيكلة السلكية منخفضة الدقة لتخطيط واجهات المستخدم واختبار التخطيطات قبل التطوير عالي الدقة. يستخدم المشروع بنية مكونات ويب مع رسومات متجهة قائمة على SVG للحفاظ على مظهر مرسوم باليد متسق. ويدعم التكامل في أطر عمل JavaScript مختلفة ويستخدم متغيرات CSS لتصميم سمات سمك الخط والألوان.

Wired Elements is a hand-drawn web component library and custom element UI kit. It provides a set of low-fidelity visual building blocks designed to produce a rough, non-polished aesthetic for early-stage design iterations. The framework enables the creation of rapid UI prototypes, low-fidelity wireframes, and conceptual UX mappings. It uses a sketched appearance to help focus iterations on layout and functionality rather than final visual polish. The library utilizes SVG-based path rendering and web component encapsulation to deliver its hand-drawn style. Visual states are managed through e

Superdesign is an AI-powered design platform that generates UI mockups, wireframes, and multi-page user flows from natural language prompts within a collaborative canvas environment. It functions as a design-to-code exporter, producing production-ready HTML, ZIP archives, or Shopify Liquid templates for direct implementation, and includes an OpenAPI specification importer that automatically generates API documentation and client code from schema definitions. The platform distinguishes itself through a branch-based design exploration system that creates independent design variations from a sin

Redacted-Font هي مجموعة من الخطوط المتخصصة وملفات الخطوط المصممة لعرض النص كأشرطة تنقيح صلبة. تعمل كخط نائب للإطار السلكي يخفي محتوى النص مع الحفاظ على التخطيط والتباعد الأصليين. يوفر المشروع ملفات خطوط متوافقة مع كل من أنظمة التشغيل المحلية ومشاريع الويب. يتيح ذلك إخفاء النص داخل برامج التصميم المكتبي وتضمين أنماط التنقيح في بيئات الويب عبر مجموعات font-face. تُستخدم هذه الخطوط للنماذج الأولية لتخطيط واجهة المستخدم وإخفاء محتوى الإطار السلكي لتحويل التركيز من نص محدد إلى الهيكل البصري العام. يستخدم النظام تعريفات خطوط تعتمد على المتجهات وتعيين unicode لضمان استبدال الأحرف بأشرطة قياس عبر دقات وشاشات مختلفة.

Sketch-code هي أداة للنماذج الأولية للويب تعتمد على التعلم العميق ومحول من الصور إلى HTML، مصممة لتحويل رسومات واجهات المواقع اليدوية إلى كود HTML هيكلي. تستخدم محلل شبكات عصبية للتعرف على العناصر المرئية في الرسومات وربطها بتمثيلات تخطيط الويب المقابلة. يعتمد النظام على بنية مبنية على Keras لتدريب وتقييم نماذج التعرف باستخدام مجموعات بيانات من النماذج الأولية المرسومة يدوياً ومرجعيات HTML. كما يفصل التخطيط الهيكلي عن التصميم المرئي من خلال السماح بحقن طبقات CSS مخصصة أثناء عملية التجميع. يغطي المشروع النماذج الأولية التلقائية للواجهات الأمامية وتوليد تخطيطات UI، بما في ذلك الربط التلقائي بين الصور والكود وتقييم دقة التنبؤ لقياس المخرجات المولدة مقابل المراجع الأساسية.