ds_task_ai_design_ai_finetune/README.md

AI Design & AI Fine-tuning

This repository contains two taks:

1. AI Design Analyzer - Convert wireframes/screenshots to detailed UI requirements and React code
2. BaaS(Backend As A Service) AI Fine-tuning - Fine-tune and generate backend endpoints based on existing schemas

Project Overview

AI Design Analyzer

• Takes wireframe/website screenshots as input
• Analyzes and extracts UI requirements including:
  • Typography
  • Color schemes
  • Button & Input styles
  • Icons & Images
  • Layout & Sections
  • Interactive elements
• Generates production-ready React components

AI BaaS Endpoint Fine-tuner

• Fine-tunes existing backend endpoints
• Generates new endpoints based on schema definitions
• Reuses existing services when applicable
• Creates new services only when necessary

🚀 Getting Started

Prerequisites

• Python 3.10+

📋 Model Training

AI Design Model

The AI Design analyzer uses a model fine-tuned on UI wireframes and designs. The model is trained to detect:

• UI elements and their relationships

• Style properties and patterns

• Layout structures

• Interactive components

  Note: Take any samples of data(Wireframe Image) and then do the above. For example: You can take example of UI from there: https://dribbble.com/tags/ui

  Basically the flow will look like that:

  

AI BaaS Fine-tuning Model

The BaaS fine-tuning uses a CodeGen-based model trained to:

• Understand existing endpoint patterns
• Recognize schema relationships
• Generate consistent API endpoints
• Maintain service architecture Note: For fine-tuning use the data in the /ai_finetunining/dataset directory

The flow looks like this: