Skip to content

Latest commit

Β 

History

History
170 lines (125 loc) Β· 5.18 KB

File metadata and controls

170 lines (125 loc) Β· 5.18 KB

SnapSign

🀟 Realtime Indian Sign Language to Speech Converter An easy web based app that converts Indian Sign Language into Speech in real time, we have trained our own model with huge database of about 40,000+ images, An effort to make a change.

Bridging communication gaps with AI and Computer Vision by converting Indian Sign Language into speech in real-time. Built using React, Flask, OpenCV, and MediaPipe.


🌟 Demo


🧠 Project Overview

Millions of people in India rely on sign language for communication, but there's a lack of tools that allow seamless interaction between them and the hearing population. This project offers a real-time sign-to-speech translation tool specifically designed for Indian Sign Language (ISL).

Key objectives:

  • Detect hand signs using MediaPipe
  • Translate them into readable text
  • Convert the text into spoken audio using Web Speech API

πŸš€ Key Features

βœ… Real-time hand tracking using MediaPipe
βœ… Gesture classification using OpenCV and custom logic
βœ… Instant speech conversion using Web Speech API
βœ… Smooth UI with React + Tailwind CSS
βœ… Flask backend to handle recognition logic
βœ… Designed for Indian Sign Language (ISL)


πŸ”§ Tech Stack

Layer Technology
πŸ–₯ Frontend React.js, Tailwind CSS, JavaScript
βš™ Backend Flask (Python), REST API
πŸ‘ Computer Vision MediaPipe, OpenCV
πŸ”Š Speech Web Speech API (Text-to-Speech)

🧩 Architecture

+-------------+      Video Feed      +---------------+
|  React App  |  ----------------->  |   MediaPipe   |
| (Frontend)  |                      | (Hand Tracking)|
+-------------+                      +---------------+
        |                                   |
        | Detected Landmarks                |
        v                                   v
+-------------+      API Call       +---------------+
| Flask Server|  <---------------   |  Gesture Logic |
|  (Backend)  |                     |  (OpenCV)      |
+-------------+                     +---------------+
        |
        | Predicted Sign
        v
+----------------+
| Text-to-Speech |
|  (Web API)     |
+----------------+

πŸ› οΈ Installation & Setup Guide
git clone https://github.com/yourusername/indian-sign-language-to-speech.git
cd indian-sign-language-to-speech

πŸ–₯ Frontend Setup (React)
cd frontend
npm install
npm start

βš™ Backend Setup (Flask + OpenCV)
cd backend
python -m venv venv
source venv/bin/activate  # On Windows: venv\Scripts\activate
pip install -r requirements.txt
python app.py

πŸ“¦ Backend Requirements
pip install flask opencv-python mediapipe numpy

πŸ“‚ Folder Structure
indian-sign-language-to-speech/
β”‚
β”œβ”€β”€ frontend/                  # React frontend
β”‚   β”œβ”€β”€ src/
β”‚   └── public/
β”‚
β”œβ”€β”€ backend/                  # Flask backend
β”‚   β”œβ”€β”€ app.py
β”‚   └── gesture_logic.py
β”‚
β”œβ”€β”€ assets/                  # Sample ISL images or demos
β”‚
└── README.md

πŸ“ˆ Future Improvements
βœ… Add a machine learning model for dynamic gesture recognition

βœ… Create a dataset specific to Indian Sign Language (ISL)

🌍 Multilingual speech support (Hindi, Bengali, etc.)

πŸ“² Convert to mobile app using React Native or Flutter

πŸ§ͺ Add automated testing for Flask API

🀝 Contributing
Contributions are what make the open-source community such an amazing place to learn and grow. If you’d like to:

πŸš€ Improve the gesture recognition algorithm

πŸ§ͺ Add unit tests

🎨 Enhance UI/UX

Feel free to open an issue or submit a PR!

πŸ“œ License
This project is licensed under the MIT License - see the LICENSE file for details.

πŸ™ Acknowledgements
MediaPipe

OpenCV

React

Flask

Inspiration from the Indian Deaf community

βœ‰οΈ Contact
For queries or collaboration ideas:

πŸ“§ rishitraj002@gmail.com
πŸ”— LinkedIn : https://www.linkedin.com/in/rishitraj/
🌐 Portfolio: [yourwebsite.com](https://rajrishit.netlify.app/) || www.rishitraj.tech


---

### πŸ”§ Customization Options:
- Want to **add a dataset or model training section**? I can include that.
- Need a **GitHub Actions CI/CD workflow** for Flask/React? I can help.
- Want a **dark/light switchable README theme** with embedded links to component files? That's also possible.

Let me know what extras you’d like β€” I can personalize this further based on your deployment or project goals.