Project Info

Euclid

This project did not submit a demo video on Devpost.

Inspiration

We built Euclid because everyone deserves high-quality, one-on-one math tutoring—no matter where they live or what resources they have available. Many students struggle with learning math, and while private tutoring can be greatly beneficial, the cost is often prohibitive. By combining voice interaction with real-time canvas snapshots, Euclid feels like it's truly present: speaking naturally, listening attentively, and annotating each student’s work. This lets it deliver instant, tailored guidance and personalized feedback. But Euclid does more than just solve math problems—it encourages students with gentle, confidence-boosting prompts, breaks every problem into bite-sized steps, and celebrates each win, keeping learners motivated. This dynamic, multimodal experience replicates the best parts of private tutoring while being more accessible than ever and far more effective than simple LLM Q&A.

What it does

Euclid is a collaborative math problem space where students can: Upload notes or PDFs to generate practice problems. Sketch solutions on a whiteboard-like interface powered by Tldraw. Ask for help from an AI tutor who can view their current whiteboard and provide hints. Check their work, get feedback, and receive new problems based on their progress. Everything happens in-context—on the canvas—through arrows, equations, and agent feedback, mimicking how a tutor might work alongside you on a physical whiteboard.

How we built it

Frontend: React + Tldraw for the canvas-based UI, using custom shapes and math rendering via KaTeX. Conversational Agent: Built with Vapi, using Claude 4 with vision to process current whiteboard state and provide hints, guidance, or feedback. Practice Problem Generation: Claude 4 processes uploaded PDFs of math notes to extract concepts and generate new LaTeX-formatted practice questions. Authentication and Storage: Supabase stores user accounts, problem spaces, and canvas snapshots for each question.

Challenges we ran into

Getting usable context into the LLM agent: we explored both passing images of the canvas and using snapshot.json state.

Accomplishments we're proud of

Created a somewhat working and deployed web application

What we learned

Tldraw is very cool but also incredibly complicated especially when it comes to saving and loading canvas states. Using vision description as context worked surprisingly well when it comes to getting context from the canvas to the voice agent.

What's next

Add a social layer: allow users to share their problem spaces with friends or tutors for collaborative solving. Improve agent grounding: extract and annotate key steps or errors in student work over time.

React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

@vitejs/plugin-react uses Babel for Fast Refresh
@vitejs/plugin-react-swc uses SWC for Fast Refresh

Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

export default tseslint.config({
  extends: [
    // Remove ...tseslint.configs.recommended and replace with this
    ...tseslint.configs.recommendedTypeChecked,
    // Alternatively, use this for stricter rules
    ...tseslint.configs.strictTypeChecked,
    // Optionally, add this for stylistic rules
    ...tseslint.configs.stylisticTypeChecked,
  ],
  languageOptions: {
    // other options...
    parserOptions: {
      project: ['./tsconfig.node.json', './tsconfig.app.json'],
      tsconfigRootDir: import.meta.dirname,
    },
  },
})

You can also install eslint-plugin-react-x and eslint-plugin-react-dom for React-specific lint rules:

// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default tseslint.config({
  plugins: {
    // Add the react-x and react-dom plugins
    'react-x': reactX,
    'react-dom': reactDom,
  },
  rules: {
    // other rules...
    // Enable its recommended typescript rules
    ...reactX.configs['recommended-typescript'].rules,
    ...reactDom.configs.recommended.rules,
  },
})

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
HTMLIn code
JavaScriptIn code
PythonIn code
ReactIn code
SupabaseIn code
Tailwind CSSIn code
TypeScriptIn code
AnthropicClaimed

8 of 9 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

109 KB

Source files

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