Run any Skill in Manus with one click

mediapipe-tasks-vision-web

Stars15

Forks0

UpdatedMarch 29, 2026 at 20:44

Implement and debug MediaPipe Tasks Vision gesture recognition in Amy's Echo webapp. Use when changing webcam capture, landmark extraction, gesture recognizer setup, model loading, runtime confidence logic, or detection diagnostics tied to MediaPipe behavior.

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

voku

voku/AmysEcho

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Software DevelopersComputer and Mathematical Occupations·SOC 15-1252

File Explorer

4 files

SKILL.md

readonly

name	mediapipe-tasks-vision-web
description	Implement and debug MediaPipe Tasks Vision gesture recognition in Amy's Echo webapp. Use when changing webcam capture, landmark extraction, gesture recognizer setup, model loading, runtime confidence logic, or detection diagnostics tied to MediaPipe behavior.

MediaPipe Tasks Vision Web

Use this skill when a change touches gesture detection runtime behavior in the webapp.

1) Confirm the runtime surface

Inspect these files first:

webapp/src/gesture/core/GestureDetector.ts
webapp/src/hooks/useSignLanguageDetector.ts
webapp/src/gesture/installMlp.ts
webapp/src/gesture/modelClient.ts

2) Follow a deterministic debug sequence

Reproduce with fixture-based tests before camera-based manual testing.
Verify detector init order (resource loading, model path resolution, warmup).
Verify confidence threshold and abstention logic.
Verify fallback behavior when profile model is unavailable.
Verify diagnostics output stays actionable and German for user-facing text.

3) Apply MediaPipe-specific guardrails

Keep frame processing latency predictable (avoid extra heavy sync work in hot loop).
Preserve handedness/landmark shape contracts across transforms.
When changing ROI/cropping behavior, capture before/after benchmark evidence.

4) Validate end-to-end behavior

Run focused tests for touched detection files.
Run npm --prefix webapp run diagnose:fixtures.
Run npm test --prefix webapp for regression confidence.

References

Official library docs: references/official-mediapipe-docs.md
Runtime troubleshooting flow: references/runtime-troubleshooting.md

More from this repository

same repository

amy-first-delivery

voku/AmysEcho

Apply Amy's Echo Amy-first delivery workflow for implementation and review tasks. Use when changing code, tests, or docs in this repository. Enforce discovery, planning, Amy-impact validation, and mandatory verification before merge.

2026-04-0515

model-training-workflow

voku/AmysEcho

Execute Amy's Echo model training workflows end-to-end with reproducible evidence. Use when changing trainer code, training metadata contracts, model artifact handling, few-shot evaluation, or release-readiness checks for training outputs.

2026-04-0515

express-zod-api-hardening

voku/AmysEcho

Build and harden Amy's Echo backend APIs using Express 5 and Zod contracts. Use when adding or modifying server routes, middleware, request validation, auth/profile checks, error handling, and response-shape guarantees.

2026-03-2915

identity-boundary-guard

voku/AmysEcho

Protect Amy's Echo account-versus-profile identity boundaries. Use when working on auth, settings, profile switching, uploads, training sync, or API flows where session/token and profileId can diverge.

2026-03-2915

sign-language-ml-detection

voku/AmysEcho

Diagnose and improve Amy's Echo web sign-language ML detection quality. Use when working on MediaPipe landmarks, MLP inference thresholds, confidence/margin behavior, detector telemetry, fixture diagnostics, or profile-aware recognition regressions.

2026-03-2915

testing-quality-gate

voku/AmysEcho

Run Amy's Echo testing and quality gates with clear evidence reporting. Use when preparing a change for commit/PR, diagnosing regressions, or deciding the minimum safe check set for touched webapp, server, or integration areas.

2026-03-2915

name	mediapipe-tasks-vision-web
description	Implement and debug MediaPipe Tasks Vision gesture recognition in Amy's Echo webapp. Use when changing webcam capture, landmark extraction, gesture recognizer setup, model loading, runtime confidence logic, or detection diagnostics tied to MediaPipe behavior.

MediaPipe Tasks Vision Web

Use this skill when a change touches gesture detection runtime behavior in the webapp.

1) Confirm the runtime surface

Inspect these files first:

webapp/src/gesture/core/GestureDetector.ts
webapp/src/hooks/useSignLanguageDetector.ts
webapp/src/gesture/installMlp.ts
webapp/src/gesture/modelClient.ts

2) Follow a deterministic debug sequence

Reproduce with fixture-based tests before camera-based manual testing.
Verify detector init order (resource loading, model path resolution, warmup).
Verify confidence threshold and abstention logic.
Verify fallback behavior when profile model is unavailable.
Verify diagnostics output stays actionable and German for user-facing text.

3) Apply MediaPipe-specific guardrails

Keep frame processing latency predictable (avoid extra heavy sync work in hot loop).
Preserve handedness/landmark shape contracts across transforms.
When changing ROI/cropping behavior, capture before/after benchmark evidence.

4) Validate end-to-end behavior

Run focused tests for touched detection files.
Run npm --prefix webapp run diagnose:fixtures.
Run npm test --prefix webapp for regression confidence.

References

Official library docs: references/official-mediapipe-docs.md
Runtime troubleshooting flow: references/runtime-troubleshooting.md