🧩 About the Project 💡 Inspiration
The idea for Studio came from a simple real-life struggle—managing handwritten notes, signatures, and personalized writing digitally. As students, we often switch between handwritten and typed work—writing assignments, exchanging notes, and creating digital posters. We wanted a platform where users could:
Convert handwriting or signatures into digital text.
Generate text in their own handwriting, and
Easily share notes with peers.
Thus, Studio was born—an AI-powered workspace that bridges creativity, learning, and collaboration.
🛠️ How We Built It
We divided the work into three key modules:
Backend (Flask & Python) – built by Aisha Sultana, using:
Flask for API handling
OpenCV, NumPy, and Pillow for image and handwriting processing
A lightweight OCR engine (Tesseract) for text extraction
Frontend (React.js & Tailwind CSS) – led by Shaima Fatima, built using:
React.js for dynamic rendering
Tailwind CSS for a modern, responsive interface
Framer Motion for animations
UI/UX and Notes Exchange Module – designed and developed by Safa Aman, focusing on:
Clean layout and intuitive user flow
Peer-to-peer notes upload and preview system
🧠 What We Learned
Throughout the process, we learned how to combine AI-based image processing with a modern frontend framework. We also explored:
Flask–React integration and handling CORS
File uploads and asynchronous request handling
Using OpenCV for pre-processing handwritten data
Implementing responsive UI design for usability
On a broader level, we learned how to collaborate efficiently as a team, manage version control with GitHub, and troubleshoot deployment issues.
⚙️ Challenges We Faced
Integrating AI with Frontend: Connecting Flask’s backend image processing with React’s upload interface required debugging CORS and JSON serialization issues.
Signature and Handwriting Accuracy: Extracting clean handwriting strokes was tricky due to lighting, background noise, and image resolution.
Time Constraints: Building this project in just 10 hours meant quick decisions, efficient teamwork, and real-time problem-solving.
Dependency Conflicts: Managing Node.js and Python environments simultaneously required careful setup of versions and requirements.
🌟 Outcome
Studio successfully combines:
AI-based handwriting recognition,
Text-to-handwriting synthesis, and
Peer-based notes exchange
into one unified digital workspace. It stands as a testament to what’s possible when AI meets creativity and collaboration.
Log in or sign up for Devpost to join the conversation.