Project Info

idontwantanipadbaby

This project did not submit a demo video on Devpost.

Inspiration

The idea for idontwantanipadbaby came from a desire to provide children with a fun, interactive, and educational drawing experience that doesn’t just rely on screens for entertainment. We wanted to create a virtual teacher that goes beyond just instructing; it engages with kids in a meaningful way, helps them express their creativity through drawing, and provides constructive feedback to improve their skills. The goal was to design an AI-powered tool that encourages hands-on activity while fostering artistic development.

What it does

idontwantanipadbaby is an AI-powered virtual drawing tutor that interacts with children to help them learn how to draw. The process involves: The AI asking the child what they would like to draw. Taking the child's voice input to understand the drawing concept. Waiting for the child to draw the chosen concept. Analyzing the hand-drawn sketch and providing feedback on its accuracy and aesthetic qualities using a LLM. Offering suggestions on how the child can improve their drawing skills using Voice AI text-to-speech.

How we built it

We utilized a variety of tools and technologies to bring this project to life: Deepgram API for live voice transcription, converting the child's spoken input into text. Groq API to process the transcribed text and understand the drawing concept. JavaScript and React for the front-end interface, providing an intuitive and interactive experience. Node.js on the back end to integrate various API calls and manage real-time interactions.

Challenges we ran into

Real-time Voice Processing: Getting the live voice transcription to work smoothly was challenging, especially handling background noise and ensuring accurate speech recognition. Drawing Analysis: It was tricky to evaluate freehand drawings in a meaningful way. We had to fine-tune the drawing analysis to balance between providing helpful feedback and encouraging creativity. Integrating Multiple APIs: Combining different services and ensuring smooth communication between them was difficult. Each API had its own requirements, and coordinating these services to work seamlessly took some effort. User Experience for Young Children: Designing a user interface that is simple enough for children to use, yet robust enough to support our AI’s functionalities, required careful consideration.

Accomplishments we're proud of

End-to-End Functionality: We successfully built a prototype that guides a child through the entire drawing process, from voice input to drawing analysis and feedback. Seamless Voice Interaction: We achieved a smooth voice-to-text and text-to-feedback loop using the Deepgram and Agora APIs, enhancing the interactivity of the project. Impactful User Interface: The user interface was designed with young users in mind, making it visually appealing and easy to navigate.

What we learned

AI Integration in Education: We gained valuable insights into the challenges of using AI to teach creative skills like drawing and how to provide constructive feedback in a way that encourages rather than discourages. API Communication: Working with multiple APIs taught us how to effectively manage API calls, error handling, and asynchronous programming in a real-world project. Voice and Visual Processing: We improved our understanding of voice recognition and image analysis techniques, especially in adapting these technologies for young users.

What's next

Enhanced Drawing Analysis: We plan to improve our drawing analysis algorithms to better assess sketches based on style, color use, and overall composition. Expanded Educational Content: Adding more topics, fun facts, and interactive lessons could make the experience richer and more educational. Voice Customization: We aim to personalize the virtual tutor's voice, allowing children to choose different voices and even languages for a more tailored experience. Parental Dashboard: We are considering adding a dashboard where parents can monitor their child’s progress and see how their drawing skills are developing over time. AR Integration with Snap AR: We want to explore augmented reality to make drawing even more interactive, such as projecting a 3D model of the concept for children to follow.

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

Next.js Documentation - learn about Next.js features and API.
Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Analysis

Compare with all teams

View

Metric

Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.

Technology

Found in codeClaimed only

CSSIn code
Next.jsIn code
ReactIn code
Tailwind CSSIn code
TypeScriptIn code
JavaScriptClaimed

5 of 6 appear in the indexed code. 1 claimed on Devpost could not be matched to code, which may simply mean the tool leaves no trace in the repository.

AI coding agents

No AI coding agent signals were found in this repository.

Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.

Codebase size

Source size

111 KB

Source files

Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.

Feature verification

8 Verified3 Code-supported1 Claimed only

AI asks child what to draw / voice-driven concept captureVerified
The AI asking the child what they would like to draw; taking the child's voice input to understand the drawing concept
Claimed on Devposthigh confidence
- src/app/page.tsx:159 — UI prompts 'What would you like to draw today?' and records voice via handleRecord/getUserMedia
- src/app/context/UserChoiceContext.tsx — Stores the transcribed voice input as userChoice, consumed elsewhere as the drawing concept
Drawing canvas for the child to draw onVerified
Waiting for the child to draw the chosen concept
Claimed on Devposthigh confidence
- src/app/components/draw-canvas.tsx:28 — Renders an HTML canvas bound to useDrawEditor for freehand drawing
- src/app/components/let-me-guess.tsx:15 — DrawCanvas is wired into LetMeGuess, feeding currentImage from the canvas
Groq API processes transcribed text to understand drawing concept / generate tutor feedbackVerified
Groq API to process the transcribed text and understand the drawing concept
Claimed on Devposthigh confidence
- src/app/components/TutorLLM.tsx:93 — askLLM() POSTs the transcript-based prompt to api.groq.com chat completions endpoint using a Groq model
Live voice transcription via DeepgramVerified
Deepgram API for live voice transcription, converting the child's spoken input into text
Claimed on Devposthigh confidence
- src/app/page.tsx:4 — Imports @deepgram/sdk and uses createClient, ListenLiveClient, LiveTranscriptionEvents
- src/app/page.tsx:66 — initializeDeepgram() opens a live Deepgram connection and streams MediaRecorder audio chunks to it, updating transcript state on Transcript events
Next.js project scaffold (create-next-app)Verified
This is a Next.js project bootstrapped with create-next-app
Claimed on readmehigh confidence
- next.config.mjs — Next.js config file present
- package.json:23 — next dependency and dev/build/start scripts using next CLI
React/JavaScript front-end interfaceVerified
JavaScript and React for the front-end interface, providing an intuitive and interactive experience
Claimed on Devposthigh confidence
- package.json:24 — react/react-dom dependencies present
- src/app/page.tsx:1 — Client React component using hooks, JSX UI
TypeScript usageVerified
typescript listed under Built With
Claimed on Devposthigh confidence
- tsconfig.json — TypeScript config present
- src/hooks/use-llava.ts — .ts file with typed function signatures
Voice AI text-to-speech suggestions via LMNTVerified
Offering suggestions on how the child can improve their drawing skills using Voice AI text-to-speech
Claimed on Devposthigh confidence
- src/app/components/TutorLLM.tsx:24 — synthesizeSpeech() calls the LMNT API (api.lmnt.com/v1/speech/synthesize) with the LLM's feedback text and plays the returned audio
- src/app/components/TutorLLM.tsx:117 — synthesizeSpeech is invoked with the LLM response after askLLM completes
Context-aware conversation history for the tutorCode-supported
implied end-to-end functionality with continuous feedback loop (not explicitly named but part of 'what it does')
Claimed on Devpostmedium confidence
- src/app/components/TutorLLM.tsx:11 — getStoredContext/storeContext persist prior LLM responses in sessionStorage and feed them into generatePrompt, but this context is only referenced descriptively and not actually injected as chat history into the Groq request body
LLM-based analysis of hand-drawn sketchCode-supported
Analyzing the hand-drawn sketch and providing feedback on its accuracy and aesthetic qualities using a LLM
Claimed on Devpostmedium confidence
- src/providers/let-me-guess-provider.tsx:50 — Sends canvas image to callLlamaVision (Groq vision model) for interpretation
- src/hooks/use-llava.ts:9 — callLlava sends image_url plus prompt to a Groq vision model (llava-v1.5-7b) for image description
- src/app/components/TutorLLM.tsx:70 — Prompt to the text LLM references imageInterpretation to generate feedback, but the vision prompt itself only asks for a one-word description (line 32), not accuracy/aesthetic feedback, so the 'analysis' is shallow
Next.js/Node.js back end integrating API callsCode-supported
Node.js on the back end to integrate various API calls and manage real-time interactions
Claimed on Devpostlow confidence
- package.json:23 — Next.js dependency present, implying a Node.js runtime, but API calls (Deepgram, Groq, LMNT) are made directly from client components with hardcoded keys, not through dedicated Node.js backend API routes
- src/app/api/groq-chat.tsx — A file suggests an API route exists, but naming/extension (.tsx) is atypical for a Next.js API route and was not confirmed to be a real server route
Agora API for voice interactionClaimed only
We achieved a smooth voice-to-text and text-to-feedback loop using the Deepgram and Agora APIs
Claimed on Devposthigh confidence

An AI agent derived these features from the project’s Devpost page and readme, then searched the code for each one. Verified features are backed by cited code; claimed-only features had no supporting code, which is not by itself proof a feature is missing.