ml5.js サンプル集

機械学習をブラウザで体験しよう!初心者から上級者まで、30個のインタラクティブなサンプルを収録

HTMLファイル1枚で動作

はじめる前に

初心者向け

Beginner
01
Image Classifier 基本
🖼️

MobileNetを使って画像が何かを判定する最小サンプル。機械学習の第一歩に最適です。

ImageClassifier MobileNet
02
Webcam リアルタイム分類
📹

ウェブカメラの映像をリアルタイムで分類。物体を見せると即座に認識します。

ImageClassifier Webcam
03
BodyPose 基本
🧍

体の17箇所のキーポイント(関節)を検出して表示します。

BodyPose MoveNet
04
BodyPose スケルトン
💀

検出したキーポイントを線で繋いで骨格(スケルトン)として表示します。

BodyPose スケルトン
05
HandPose 基本

手の21箇所のキーポイントを検出。指先や関節の位置がわかります。

HandPose
06
FaceMesh 基本
😊

顔の478個のランドマークを検出。目、鼻、口などの位置を詳細に取得できます。

FaceMesh
07
Sound Classifier 基本
🎤

マイクの音声を分類。話し声や特定の音を認識します。

SoundClassifier 音声認識
08
スクワットカウンター
🏋️

BodyPoseを使ってスクワットの回数を自動でカウントします。

BodyPose フィットネス
09
画像アップロード分類
📤

画像をドラッグ&ドロップで分類。上位5件の結果をバーグラフで表示します。

ImageClassifier ファイルアップロード
10
絵文字オーバーレイ
🎭

顔の位置に合わせて絵文字を重ねて表示。好きな絵文字を選べます。

FaceMesh AR

中級者向け

Intermediate
11
フルーツキャッチゲーム
🍎

手を動かして落ちてくるフルーツをキャッチ!BodyPoseを使ったシンプルなゲームです。

BodyPose ゲーム
12
手で描くお絵かき
🎨

人差し指を立てると描画モード。空中に絵を描けます。色や太さも変更可能。

HandPose お絵かき
13
フェイスフィルター
🕶️

サングラス、猫耳、王冠などのフィルターを顔に合わせて表示します。

FaceMesh AR フィルター
14
Neural Network 色分類
🧠

RGB値から色の名前を予測するニューラルネットワークを自分で訓練します。

NeuralNetwork 分類
15
Neural Network 価格予測
🏠

面積と築年数から住宅価格を予測。回帰問題をニューラルネットワークで解きます。

NeuralNetwork 回帰
16
体で音楽を奏でる
🎵

手の位置で音程と音量を操作。体を動かして音楽を奏でましょう。

BodyPose Web Audio
17
ジェスチャー認識
🤟

グー、チョキ、パー、いいね、指差しなどのジェスチャーを認識します。

HandPose ジェスチャー
18
マルチモデル同時使用
🔮

BodyPose、HandPose、FaceMeshを同時に実行。各モデルのON/OFFを切り替え可能。

BodyPose HandPose FaceMesh
19
音声ビジュアライザー
🎧

音声分類と円形ビジュアライザーの組み合わせ。声に反応して美しく表示します。

SoundClassifier ビジュアライザー
20
カスタムUI 画像分類

リッチなUIの画像分類器。ライブモード、キャプチャモード、履歴機能付き。

ImageClassifier UI/UX

上級者向け

Advanced
21
カスタムポーズ分類器
🤖

独自のポーズを登録して訓練。自分だけのポーズ認識モデルを作れます。

NeuralNetwork BodyPose 訓練
22
フィットネストラッカー
💪

複数のエクササイズに対応。回数、カロリー、フォーム品質を計測します。

BodyPose フィットネス
23
バーチャルキーボード
⌨️

空中に表示されたキーボードを指でタップして文字入力します。

HandPose UI
24
頭の向き推定
🗿

Yaw(左右)、Pitch(上下)、Roll(傾き)を計算。3Dキューブで視覚化します。

FaceMesh 3D
25
マルチパーソントラッキング
👥

複数人を同時に追跡し、それぞれの動きや姿勢を個別に分析します。

BodyPose トラッキング
26
時系列予測
📈

過去のデータパターンを学習し、未来の値を予測するニューラルネットワーク。

NeuralNetwork 時系列
27
ポーズマッチングゲーム
🎮

画面に表示されるお題のポーズを真似してスコアを競うゲームです。

BodyPose ゲーム
28
指文字認識
🤙

手の形からアルファベットの指文字を認識。文字を繋げて文を作れます。

HandPose 手話
29
AIお絵かきアシスタント
🖌️

描いている途中でAIが何を描いているか予測。リアルタイムでフィードバックします。

ImageClassifier お絵かき
30
総合AIインタラクティブ体験
🌟

全モデルとエフェクトを統合した総合デモ。モード切替、パーティクル、ミラーなど多彩な機能。

全モデル エフェクト 統合