The future of project management is here - just speak your mind!
VoiceProj revolutionizes project management by bringing natural voice commands to your workflow. No more clicking through endless menus or typing repetitive commands - just speak naturally and watch your projects come to life!
- 🎙️ Natural Voice Commands - Create tasks, manage projects, and navigate with your voice
- 🎨 Neo-Brutalism Design - Bold, accessible, and visually striking interface
- 👥 Team Collaboration - Share projects and collaborate with team members
- 🌍 Multi-language Support - Works in 25+ languages
- 📱 Responsive Design - Perfect on desktop, tablet, and mobile
- 🔒 Secure & Private - Your data stays in your browser
- ⚡ Lightning Fast - Built with modern web technologies
- 🎯 Accessibility First - Designed for users of all abilities
Try these voice commands:
- "Create task: Design new homepage"
- "Show me all projects"
- "Mark task complete"
- "New project: Mobile App Development"
- Frontend: React 18 with TypeScript
- Styling: Tailwind CSS with custom Neo-Brutalism design
- Build Tool: Vite
- Voice Recognition: Web Speech API
- Speech Synthesis: Web Speech Synthesis API
- Icons: Lucide React
- Storage: LocalStorage (client-side)
- Node.js 18+
- npm or yarn
-
Clone the repository
git clone https://github.com/mobeen-asghar/VoiceProj.git cd VoiceProj -
Install dependencies
npm install
-
Start the development server
npm run dev
-
Open your browser Navigate to
http://localhost:5173 -
Enable microphone permissions Allow microphone access when prompted to use voice features
- Sign Up: Create your account on the landing page
- Create a Project: Click "NEW PROJECT" or say "Create project [name]"
- Add Tasks: Use "NEW TASK" button or voice command "Create task [description]"
- Voice Control: Click the microphone icon and start speaking!
| Command | Action |
|---|---|
"Create task [name]" |
Creates a new task |
"New project [name]" |
Creates a new project |
"Show projects" |
Lists all projects |
"Mark task complete" |
Completes the first pending task |
"Open settings" |
Opens the settings page |
"Search [query]" |
Opens search with query |
src/
├── components/ # React components
│ ├── LandingPage.tsx # Marketing landing page
│ ├── VoiceInterface.tsx # Voice recognition UI
│ ├── TaskCard.tsx # Individual task display
│ ├── ProjectCard.tsx # Project display component
│ ├── Dashboard.tsx # Main dashboard
│ ├── Header.tsx # Navigation header
│ ├── SettingsPage.tsx # User settings
│ └── ...
├── contexts/ # React contexts
│ └── AuthContext.tsx # Authentication state
├── hooks/ # Custom React hooks
│ ├── useVoiceRecognition.ts
│ └── useSpeechSynthesis.ts
├── services/ # Business logic
│ ├── authService.ts # Authentication
│ └── dataService.ts # Data management
├── types/ # TypeScript definitions
└── styles/ # CSS and styling
VoiceProj embraces Neo-Brutalism design principles:
- Bold Typography: Heavy, impactful fonts that demand attention
- High Contrast: Black borders and vibrant colors for maximum accessibility
- Geometric Shapes: Clean lines and sharp edges
- Playful Interactions: Hover effects and micro-animations
- Accessibility First: High contrast ratios and keyboard navigation
VoiceProj works best in modern browsers with Web Speech API support:
- ✅ Chrome 25+
- ✅ Edge 79+
- ✅ Safari 14.1+
- ✅ Firefox 49+ (limited support)
Create a .env file in the root directory:
VITE_APP_NAME=VoiceProj
VITE_APP_VERSION=1.0.0Customize voice recognition in src/hooks/useVoiceRecognition.ts:
recognition.lang = 'en-US'; // Change language
recognition.continuous = true; // Continuous listening
recognition.interimResults = true; // Show interim resultsWe welcome contributions! Here's how to get started:
- Fork the repository
- Create a feature branch
git checkout -b feature/amazing-feature
- Make your changes
- Add tests (if applicable)
- Commit your changes
git commit -m 'Add amazing feature' - Push to the branch
git push origin feature/amazing-feature
- Open a Pull Request
- Follow the existing code style
- Write meaningful commit messages
- Add JSDoc comments for new functions
- Test voice commands thoroughly
- Ensure accessibility compliance
| Command | Description |
|---|---|
npm run dev |
Start development server |
npm run build |
Build for production |
npm run preview |
Preview production build |
npm run lint |
Run ESLint |
- Voice recognition may not work in noisy environments
- Some browsers require HTTPS for microphone access
- Speech synthesis voices vary by operating system
- Real-time Collaboration - Live project sharing
- Mobile App - Native iOS and Android apps
- AI Assistant - Smart task suggestions
- Integrations - Slack, Trello, GitHub connections
- Advanced Analytics - Project insights and reporting
- Offline Mode - Work without internet connection
This project is licensed under the MIT License - see the LICENSE file for details.
- Web Speech API - For making voice recognition possible
- Tailwind CSS - For the utility-first CSS framework
- Lucide React - For the beautiful icons
- Pexels - For the stock photography
Having issues? We're here to help!
- 📧 Email: support@voiceproj.com
- 🐛 Bug Reports: GitHub Issues
If you find VoiceProj helpful, please consider:
- ⭐ Starring this repository
- 🐦 Sharing on social media
- 🤝 Contributing to the project
- 💝 Sponsoring development