ashnkumar/sketch-code
Sketch Code
Sketch-code هي أداة للنماذج الأولية للويب تعتمد على التعلم العميق ومحول من الصور إلى HTML، مصممة لتحويل رسومات واجهات المواقع اليدوية إلى كود HTML هيكلي. تستخدم محلل شبكات عصبية للتعرف على العناصر المرئية في الرسومات وربطها بتمثيلات تخطيط الويب المقابلة.
يعتمد النظام على بنية مبنية على Keras لتدريب وتقييم نماذج التعرف باستخدام مجموعات بيانات من النماذج الأولية المرسومة يدوياً ومرجعيات HTML. كما يفصل التخطيط الهيكلي عن التصميم المرئي من خلال السماح بحقن طبقات CSS مخصصة أثناء عملية التجميع.
يغطي المشروع النماذج الأولية التلقائية للواجهات الأمامية وتوليد تخطيطات UI، بما في ذلك الربط التلقائي بين الصور والكود وتقييم دقة التنبؤ لقياس المخرجات المولدة مقابل المراجع الأساسية.
Features
- Sketch-to-HTML Converters - Transforms hand-drawn website sketches into structured HTML code using a deep learning model for rapid prototyping.
- Mockup-to-HTML Converters - Provides a deep learning model that translates visual mockups of website layouts into functional HTML code.
- Keras Model Implementations - Uses the Keras API to define and optimize the neural network layers responsible for visual-to-code translation.
- Image-to-Code Networks - Implements a neural network specialized in mapping visual pixels from hand-drawn sketches to structural markup language.
- Visual Element Recognition Training - A capability in the project to train a network to identify wireframe elements using custom datasets and pretrained weights.
- Wireframe Parsers - Utilizes a neural network designed to recognize hand-drawn visual elements and map them to web layout representations.
- Deep Learning Design Tools - Acts as a deep learning-powered prototyping tool that converts sketches into functional HTML.
- Hand-Drawn Code Conversion - Turns hand-drawn sketches of website layouts into functional HTML code using deep learning.
- Frontend Prototyping Tools - Provides automated tools to convert visual mockups and sketches into functional frontend code to accelerate prototyping.
- Hybrid CNN-RNN Architectures - Implements a hybrid CNN-RNN architecture to translate visual wireframe features into structural HTML sequences.
- Vision Model Training - Implements a framework for training vision models to recognize hand-drawn wireframes and map them to HTML.
- Image-To-Code Model Training - Trains a neural network to map hand-drawn visual elements to HTML representations using specialized datasets.
- CSS Styling - Supports applying custom visual styles through a decoupled CSS injection layer during the compilation process.
- Generative UI Layouts - Generates structural UI layouts from image inputs, allowing for a separate layer of visual design.
- CSS Style Injections - Provides a mechanism to inject custom CSS layers post-generation to decouple structural layout from visual styling.
