🌿
🌿 MidoriPhotoArt.
試験的な実験。拡張現実のインターフェース考察。AIを活用した手の動き検出システム。手の動きによって、画像や動画を表示させる。
🏠 新サイトへ
📚 旧サイトへ
📖 コンテンツ
💡 解説
システムステータス
🌿
システムを初期化中...
カメラとAIモデルを準備しています
🔄 システム再起動
🐛 デバッグ表示切替
📷 カメラ切替
カメラを選択...
🌿 高精度手の動き検出システム - midori270
✨ システムの特徴
💻
MediaPipe Hands
による高精度なリアルタイム手検出
🎯
複数条件の総合判定
:角度・距離・位置をスコアリングして精度向上
🎨
カラフルなランドマーク表示
:指ごとに色分けされた常時表示
✨
スムージング機能
:ノイズを除去して滑らかな動き追跡
📷
カメラ切り替え対応
:複数カメラやフロント/リア切替が可能
⚡
高速反応
:3フレームで確定、従来より40%速い応答
🐛
詳細デバッグモード
:各指の状態(伸/曲)をリアルタイム表示
📊
リアルタイムステータス
:システムログで動作状況を確認
🎯 検出可能なポーズ(7種類)
✌️
ピースサイン
:人差し指と中指を伸ばす → 📸 画像表示
🤘
ロックサイン
:人差し指と小指を伸ばす → 🎬 動画表示
👍
グッド
:親指だけを立てる
👆
No.1
:人差し指だけを伸ばす
👌
OKサイン
:親指と人差し指で輪を作る
✊
グー
:すべての指を曲げる
🖐️
パー
:すべての指を伸ばす
※ 各ポーズは複数の判定基準(角度・距離・位置)を組み合わせて高精度に認識します
🎨 ランドマーク表示の色分け
親指
- 赤色
人差し指
- 青緑色
中指
- 青色
薬指
- オレンジ色
小指
- 緑色
※ 指先は大きく表示され、骨格線も色分けされているので視覚的に分かりやすい
🔧 使い方
起動
:ページを開くとカメラアクセスが要求されます
許可
:カメラへのアクセスを許可してください
検出
:カメラに手を映すと自動的にランドマークが表示されます
ポーズ
:様々な手のポーズを試してみてください
カメラ切替
:「📷 カメラ切替」ボタンで別のカメラに変更可能
デバッグ
:「🐛 デバッグ表示切替」で各指の状態を確認できます
再起動
:問題が起きたら「🔄 システム再起動」で初期化できます
💡 ポーズ認識のコツ
明るい場所で使用すると認識精度が向上します
手をカメラの中央に配置すると安定して検出できます
ポーズを3フレーム(約0.1秒)保持すると確定します
背景がシンプルな方が認識しやすくなります
デバッグモードで各指の状態を確認しながら調整できます
🔬 技術詳細
検出アルゴリズム
:MediaPipe Hands(Google開発)
ランドマーク数
:21点(手首+各指4点×5本)
判定方式
:角度・距離・位置のスコアリング総合判定
スムージング
:係数0.3の指数移動平均
フレームレート
:カメラのfpsに依存(通常30fps)
確定閾値
:3フレーム連続で同一ポーズ
検出信頼度
:0.5以上(バランス重視)
⚠️ トラブルシューティング
映像が映らない
:カメラの許可設定を確認してください
検出が不安定
:明るい場所で、背景をシンプルにしてください
認識しない
:手をカメラ中央に配置し、ポーズを3フレーム以上保持してください
カメラが切り替わらない
:ブラウザを再読み込みしてください
エラー表示
:「🔄 システム再起動」ボタンをクリックしてください
動作確認
:ステータスパネルでシステムログを確認できます
デバッグ
:デバッグモードで各指の状態を確認して問題を特定できます
🎓 バージョン情報
プロジェクト
:MidoriPhotoArt - midori270
ベース
:midori269の改良版
主な改善点
:
高精度なポーズ認識アルゴリズム(複数条件の総合判定)
カラフルなランドマーク常時表示
カメラ切り替え機能の追加
スムージング機能による安定性向上
反応速度の40%向上(5フレーム→3フレーム)
使用技術
:MediaPipe Hands, JavaScript, Canvas API