Decoding Vision, Delivering Insight
iSense is an AI-powered image analysis platform that combines advanced computer vision with natural language processing to provide intelligent insights about your images. Upload any image, ask questions, and get detailed, contextual responses powered by cutting-edge AI technology.
- 🧠 AI-Powered Image Understanding: Advanced image analysis using Groq AI with LLaMA models
- 💬 Intelligent Q&A: Ask natural language questions about your uploaded images
- 📸 Image Upload: Support for various image formats with real-time preview
- 🔐 Secure Authentication: User management powered by Clerk
- 📱 Fully Responsive: Seamless experience across desktop, tablet, and mobile
- 🎨 Modern UI: Beautiful, animated interface with Tailwind CSS
- 📜 Chat History: Keep track of your conversations (coming soon)
- Next.js 15 - React framework with App Router
- TypeScript - Type-safe development
- Tailwind CSS - Utility-first CSS framework
- Clerk - Authentication and user management
- Lucide React - Modern icon library
- Custom animations - Smooth, engaging user experience
- Next.js API Routes - Serverless API endpoints
- Groq SDK - AI-powered image analysis
- LLaMA 4 Scout - Advanced language model for image understanding
- ESLint - Code linting and formatting
- PostCSS - CSS processing
- tw-animate-css - Enhanced Tailwind animations
-
Clone the repository
git clone <repository-url> cd isesnse
-
Install dependencies
npm install
-
Set up environment variables Create a
.env.local
file in the root directory:# Clerk Authentication NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key CLERK_SECRET_KEY=your_clerk_secret_key # Groq AI GROQ_API_KEY=your_groq_api_key
-
Run the development server
npm run dev
-
Open your browser Navigate to http://localhost:3000
- Sign Up/Sign In: Create an account or sign in using Clerk authentication
- Navigate to Chat: Click on "Chat" in the navigation or "Start Analyzing" on the home page
- Upload an Image: Click the "+" button to upload an image (supports JPG, PNG, WebP, etc.)
- Ask Questions: Type questions about your image in natural language
- Get Insights: Receive detailed AI-generated responses about your image
- "What objects can you see in this image?"
- "Describe the mood and atmosphere of this photo"
- "What colors are dominant in this image?"
- "Can you identify any text in this image?"
- "What's happening in the background?"
├── app/ # Next.js App Router
│ ├── api/ # API routes
│ │ └── chat/ # Chat API endpoint
│ ├── about/ # About page
│ ├── chat/ # Chat interface
│ ├── history/ # Chat history (coming soon)
│ ├── globals.css # Global styles
│ ├── layout.tsx # Root layout
│ └── page.tsx # Home page
├── components/ # Reusable React components
│ ├── Header.tsx # Navigation header
│ ├── chatBox.tsx # Chat interface component
│ ├── InputBox.tsx # Message input component
│ └── comingSoon.tsx # Coming soon placeholder
├── lib/ # Utility libraries
│ ├── groq.ts # Groq AI integration
│ └── utils.ts # Utility functions
├── public/ # Static assets
├── middleware.ts # Clerk authentication middleware
└── package.json # Dependencies and scripts
npm run dev
- Start development server with Turbopacknpm run build
- Build the application for productionnpm run start
- Start the production servernpm run lint
- Run ESLint for code quality
iSense uses Clerk for authentication, providing:
- Email/password authentication
- Social login options
- Secure user sessions
- Profile management
The platform integrates with Groq using the LLaMA 4 Scout model for:
- Image Description: Automatic caption generation for uploaded images
- Question Answering: Contextual responses based on image content
- Natural Language Processing: Understanding user queries in conversational format
- Chat History: Save and retrieve previous conversations
- Export Functionality: Download chat transcripts
- Advanced Filters: Search through chat history
- Profile Customization: Personalized AI preferences
- Batch Processing: Upload and analyze multiple images
- API Access: Public API for developers
- Connect your repository to Vercel
- Add environment variables in the Vercel dashboard
- Deploy automatically on every push
The application can be deployed on any platform supporting Next.js:
- Netlify
- Railway
- DigitalOcean App Platform
- AWS Amplify
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature
) - Commit your changes (
git commit -m 'Add some amazing feature'
) - Push to the branch (
git push origin feature/amazing-feature
) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- 🐛 Bug Reports: Open an issue on GitHub
- 💡 Feature Requests: Submit an issue with the enhancement label
- 📧 Contact: Reach out via social media links in the footer
- Next.js - The React framework for production
- Groq - AI inference platform
- Clerk - Authentication made simple
- Tailwind CSS - Utility-first CSS framework
- Lucide - Beautiful & consistent icons
©iSense 2025