ML5.js: Machine Learning for the Web

Published: January 27, 2025 at 12:55 PM UTC+0200
Last edited: 5 February, 2025 at 10:57 AM UTC+0200
Author: Richard Djarbeng

ML5.js is an open-source JavaScript library designed to make machine learning accessible to a broad audience, including artists, creative coders, and students. It leverages TensorFlow.js to bring machine learning models directly into the browser, offering an API inspired by Processing and p5.js, which makes it particularly friendly for those with a background in creative coding.

ML js home page screenshot

Applications of ML5.js

1. Image Classification

ML5.js simplifies the process of image classification in web applications. It allows developers to use pre-trained models like MobileNet for recognizing objects within images. This can be used for:

2. Pose Estimation

Using models like PoseNet, ML5.js can detect human poses within video or images, which has numerous applications:

3. Text Generation

ML5.js includes text generation capabilities, allowing for:

4. Sound Classification

The library can classify sounds, opening up applications like:

5. Style Transfer

This feature allows for the artistic transformation of images, applying the style from one image onto the content of another:

6. Sentiment Analysis

For text data, ML5.js can perform sentiment analysis:

7. Generative Art

With its neural network capabilities, ML5.js can be used to create generative art:

8. Educational Workshops

ML5.js’s simplicity and integration with p5.js make it an excellent tool for educational purposes:

My usage of ML5.js- Richard

I experimented with hand gesture recognition using ML5.js and P5.js and a laptop webcam, which is shown in action by the addition of digital elements to the user’s hand when a gesture is recognized. This technology has the potential to extend to sign language translation and enhance human-computer interaction using cameras to better understand spoken speech.

I also explored face mesh detection, where the camera detected and placed green dots on my face, tracking its contours and features. This technology has numerous applications, from facial recognition to augmented reality experiences.

face mesh detection p5js with Richard Djarbeng

Special thanks to Denis Musinguzi for his assistance in testing out hand gesture recognition using P5.js

Denis Musinguzi testing hand gesture recognition with p5.js

Community and Learning Resources

ML5.js has a vibrant community and a wealth of learning resources:

By providing a straightforward interface to complex machine learning algorithms, ML5.js democratizes access to AI technology, allowing more people to experiment, learn, and innovate with machine learning on the web.

References