Xion Nexus - AICraft Experiment

Project Overview

Goal: Create a web app that classifies webcam images using a Teachable Machine model.

Tasks:

• Train an image classification model in Teachable Machine (e.g., cat vs. dog).
• Export the model and get its hosted URL.
• Add Teachable Machine libraries via CDN in the HTML tab.
• Create an HTML UI with a webcam video feed and prediction display.
• Write JavaScript to load the model and show real-time predictions.

Skills Learned: Basic machine learning (training, classification), Teachable Machine, JavaScript (model integration, webcam APIs).

Get Started

Follow these steps to build your image classifier:

1. Train: Visit Teachable Machine to train an image model (e.g., classify two objects).
2. Export: Export the model and copy its hosted URL.
3. Code: Use the OneCompiler editor below, starting from scratch.
4. Add Libraries: In the HTML tab, add Teachable Machine CDNs:

   
   <script src="https://cdn.jsdelivr.net/npm/@teachablemachine/image@0.8/dist/teachablemachine-image.min.js"></script>
                           

5. UI: In the HTML tab, add a <video> for the webcam and a <div> for predictions.
6. Logic: In the JavaScript tab, load the model and display predictions.
7. Learn: Visit the AICraft course on Xion Apex Academy for tutorials.
8. Submit: Share your web app URL for feedback.

Code Workspace

Write your image classifier web app from scratch in the editor below. Use the HTML, CSS, and JavaScript tabs to build your app.

Prefer coding externally? Use Replit or Download Starter Files (includes empty HTML/CSS/JS files).