Hari Babu C H

Project Case Study
2025

Nexus AI:
An AI-Powered SaaS Dashboard
for Project & Team Management

9
Dashboard Views
4
User Roles
100%
Responsive Design
Run Your Business on Intelligence: A Unified AI Workspace

Nexus AI is a fully front-end SaaS dashboard concept that brings projects, analytics, files, and an AI assistant together in one cohesive workspace. The build includes a complete authentication layer with sign in, registration, and password recovery flows, plus a role-based experience for Admin, Manager, Member, and Client demo accounts. From the main dashboard, users get an at-a-glance view of revenue, active users, active projects, and AI request usage, alongside recent activity feeds and a personal task list. The interface was designed to feel like a polished, production-grade product — dark themed, glassmorphic, and animated — while remaining entirely client-side.

  • Design a cohesive multi-view SaaS dashboard with sidebar navigation
  • Build a complete authentication system: login, registration, and password reset
  • Implement role-based access for Admin, Manager, Member, and Client users
  • Visualize business and usage data with interactive charts
  • Create an AI assistant interface that delivers simulated project insights and recommendations

The dashboard was built using modern front-end fundamentals paired with lightweight libraries for charts and icons:

HTML5 CSS3 (Glassmorphism & Theming) Vanilla JavaScript Chart.js Font Awesome
  • Authentication UI design (login, registration, password recovery)
  • Role-based dashboard architecture and access control
  • Data visualization with revenue, growth, and usage charts
  • Kanban-style project and task management interfaces
  • Responsive, accessible, dark-themed SaaS UI design
Repository Layout
📁 nexus/
├── 📄 index.html
└── 📂 files/
    ├── style.css
    ├── script.js
    └── 📂 screenshot/
        ├── img1.jpeg
        ├── img2.jpeg
        ├── img3.jpeg
        ├── img4.jpeg
        └── img5.jpeg
Project Visuals

A visual walkthrough of the Nexus AI workspace — from the authentication screen to the dashboard, analytics, and AI assistant views.

Authentication Screen
Authentication Screen
Dashboard Overview
Dashboard Overview
Analytics & AI Usage
Analytics & AI Usage
What We Discovered

The dashboard view consolidates monthly revenue, active users, active projects, and AI credit usage into clear summary cards, paired with a six-month revenue trend chart and a live task list. The analytics view extends this with revenue breakdowns by MRR and add-ons, user growth trends, a project status donut chart, and a radar chart of AI feature usage. The AI Assistant view simulates a co-pilot that analyzes workspace health, completion rates, and overdue tasks, then surfaces prioritized recommendations — demonstrating how AI-driven insights can be woven naturally into everyday SaaS workflows.

Nexus AI demonstrates how a fully client-side front end can deliver the look, feel, and interaction depth of a modern AI-powered SaaS product. By combining a complete authentication flow, role-based views, rich data visualizations, and a simulated AI assistant within a single glassmorphic dark theme, the project showcases strong UI/UX design instincts alongside practical front-end engineering. It serves as a strong foundation for a real production dashboard and highlights the kind of polished, intelligence-driven interfaces increasingly expected of business software today.