Giter VIP home page Giter VIP logo

teachable-machine-p5's Introduction

Teachable Machine + p5.js

This repo holds a few basic p5.js examples that uses the models trained with Google's teachable machine prototype.

List of examples

Here are examples of image, audio, and pose classifier.

  • Image classifier
    • Image classifier on images
    • Image classifier on webcam
    • Image classifier with a lamp
  • Audio classifier
    • Audio classifier on the microphone
  • Poses classifier
    • Poses classifier on webcam

Demo

Get started

Go to your terminal:

$ git clone https://github.com/yining1023/teachable-machine-p5.git
$ cd teachable-machine-p5
$ python -m SimpleHTTPServer     # $ python3 -m http.server (if you are using python 3)

Go to localhost:8000 in your browser, you will see a directory list like this:

  • audioclassifier/
  • imageclassifier/
  • poseclassifier/
  • README.md

Click into each folder, you will see the examples.

More Teachable Machine Prototype + p5.js Projects!

  • [Your full name](Your portfolio link/twitter/Instagram/any link you like), [Project name](Your blog link with images/videos), Project short description, [Live demo](optional, live demo link)
  • Khensu-Ra Inevitable
  • Caleb - Screen Locker
  • Daniel - Create your GUI with OSCAR
  • Dylan - Move the Little Dude, Use hand gestures to move a character.
  • Eva - link
  • Vince - Vince MingPu Shao, Teachable Snake, Teachable Snake is a classic snake game controlled by webcam image, powered by Tensorflow.js and Teachable Machine by Google, using pre-trained neural network models., Live demo
  • Eva Philips, Mood Agent, Keep the ball afloat by saying the word "Happy"
  • Caleb Savage, Screen Locker Obscure the web page when the camera can't recognize my face.
  • Dylan, Duet Machine, Tired of singing duets alone? Try this machine!

teachable-machine-p5's People

Contributors

calebsavage avatar irealva avatar vince19972 avatar yining1023 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

teachable-machine-p5's Issues

Imageclassifier on images decided by user with createFileInput()

Hi

Love these examples!

I have a quick question: If I wanted to have the user interactively select an image from a folder to classify, how would you go about that?

I can get it to run using the code snippets below integrated into your imageclassifier-on-images example, but for some reason the prediction results are different when they are loaded by the user compared to when loaded by the program on setup, even though the images are the same.

input = createFileInput(handleFile); input.position(0, 0);

function handleFile(file) { print(file); if (file.type === 'image') { img = createImg(file.data); predictImage(img.elt, 1); } else { img = null; } }

Have you tried to make something like this work? Or can you spot were I might be doing something wrong? Happy to send you the entire code if it helps.

Best and thanks so much for making these examples!
Andreas

Running examples on mobile phone?

Will these examples work on phone at some point or do they already do so? I tested a few of them on iPhone6 (safari), but they did not work for me. They would output the second class with 100% confidence regardless of what the input (image from phone or live through webcam) was.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.