Kwillo AI Platform — Frontend

The modern, high-performance web interface for the Kwillo AI project management platform.

🚀 Overview

The Kwillo Frontend provides a stunning, premium experience for managing AI-driven projects. Built with Vue 3 and Vite, it features smooth animations, real-time data visualization, and an intuitive interface for interacting with AI agents.

Key Features

• Modern UI/UX: Built with Tailwind CSS and Radix Vue.
• Dynamic Animations: Powered by GSAP for a premium look and feel.
• Data Visualization: Integrated ECharts and Mermaid diagrams.
• 3D Components: Interactive elements using Three.js.
• Type-Safe: Developed with TypeScript and Zod validation.

🛠 Tech Stack

• Framework: Vue 3 (Composition API)
• Build Tool: Vite
• Store: Pinia
• Styling: Tailwind CSS
• Components: Radix Vue & Lucide Icons
• Animations: GSAP
• Charts: Apache ECharts & Mermaid
• 3D: Three.js

📁 Directory Structure

src/
├── assets/          # Styles and static assets
├── components/      # Reusable UI components
├── layouts/         # Page layouts
├── stores/          # Pinia state management
├── views/           # Page views
└── utils/           # Helper functions and API clients

⚙️ Setup

1. Install Dependencies:

   pnpm install

2. Environment: Copy .env.example to .env.local and configure your API URLs.

3. Development:

   npm run dev

4. Build:

   npm run build

🧪 Testing

# Unit tests
npm run test

# E2E tests
npm run test:e2e

📄 License

Private / Proprietary.