desAIgn - AI-Powered Design Tool

desAIgn is a high-performance AI designer that allows you to create websites, apps, and prototypes using natural language. Instead of generating raw code directly, it uses a unique Design Intent architecture that is token-efficient, predictable, and incredibly fast.

---

🚀 Features

• Prompt-to-Design: Describe your vision in plain English and watch it come to life.
• Design Intent Architecture: Uses structured JSON "blueprints" for high reliability and low token usage.
• Instant Theme Swapping: Change colors and styles globally without re-generating code.
• Zero-Token Code Export: Deterministic client-side generation of clean React/Tailwind code.
• Interactive Canvas: A powerful visual workspace to view and iterate on your designs.
• Project Management: Save, share, and manage multiple design projects.

🛠️ Tech Stack

• Framework: Next.js 15 (App Router)
• Styling: Tailwind CSS 4
• AI Engine: Google Gemini AI via AI SDK
• Database: Neon (PostgreSQL) with Drizzle ORM
• Authentication: Better Auth
• Components: Custom UI library built on Radix UI primitives.

---

🏁 Getting Started

Prerequisites

• Node.js (v18+ recommended)
• npm, pnpm, or yarn
• A Neon database instance (or any PostgreSQL)
• A Google AI Studio API Key for Gemini.

Installation

1. Clone the repository:

   git clone https://github.com/your-repo/desaign.git
   cd desaign

2. Install dependencies:

   npm install

3. Set up environment variables: Create a .env file in the root directory and add the following:

   DATABASE_URL="your-postgresql-url"
   NEXT_PUBLIC_APP_URL="http://localhost:3000"
   BETTER_AUTH_SECRET="your-better-auth-secret"
   BETTER_AUTH_URL="http://localhost:3000"
   GEMINI_API_KEY="your-gemini-api-key"
   
   # Optional: For Auth Providers
   GITHUB_CLIENT_ID="your-github-id"
   GITHUB_CLIENT_SECRET="your-github-secret"
   GOOGLE_CLIENT_ID="your-google-id"
   GOOGLE_CLIENT_SECRET="your-google-secret"

Database Setup

1. Push the schema to your database:

   npm run db:push

2. Seed initial themes and data:

   npm run db:seed

Running the Application

Start the development server:

npm run dev

Open http://localhost:3000 with your browser to see the result.

---

🧠 How it Works

Desaign doesn't just "write code." It generates a Design Intent JSON structure. This approach has several advantages:

• Consistency: AI is better at following a JSON schema than writing complex JSX.
• Performance: Client-side rendering is faster than waiting for a full code generation.
• Flexibility: You can update the renderer independently of the AI's output.

For more technical details, check out DOCUMENTATION.md.

📄 License

This project is licensed under the MIT License.