adding images and further edits

Author: shiffman

content/videos/ml5/hand-pose/images/handpose-drawing.png

@@ -1,9 +1,9 @@
 {
   "title": "Hand Pose Detection with ml5.js",
-  "description": "Hand Pose video",
+  "description": "In this video, I explore the HandPose model using ml5.js. I'll demonstrate how to track hand keypoints and create an interactive painting sketch using gestures.",
   "videoId": "vfNHdVbE-l4",
   "nebulaSlug": "",
-  "date": "2024-10-28",
+  "date": "2024-10-27",
   "languages": ["ml5.js", "JavaScript"],
   "topics": ["machine learning (ML)", "webcam", "pose detection", "ml5.js", "HandPose"],
   "canContribute": true,
@@ -21,38 +21,44 @@
   "codeExamples": [
     {
       "title": "HandPose - Keypoints",
-      "description": "Sketch demonstrating use of HandPose model to find finger keypoints.",
-      "image": "",
+      "description": "This sketch demonstrates how to render all of the 21 keypoints detected by the handPose model.",
+      "image": "handpose-keypoints.png",
       "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/o5wnL6esQ" }
     },
     {
       "title": "HandPose - Painting",
-      "description": "Sketch demonstrating use of HandPose model to draw using index finger and thumb keypoints.",
-      "image": "",
+      "description": "This sketch demonstrates how to draw using the index finger tip and thumb tip keypoints.",
+      "image": "handpose-drawing.png",
       "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/LCEHJm6PA" }
     },
     {
       "title": "Simple painting",
-      "description": "Sketch demonstrating drawing using mouseX, mouseY, pmouseX, pmouseY.",
-      "image": "",
+      "description": "This sketch demonstrates drawing with mouseX, mouseY, pmouseX, pmouseY.",
+      "image": "simple-painting.png",
       "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/3VcKxx_GY" }
     },
     {
-      "title": "HandPose Painting - StrokeWeight",
-      "description": "Sketch demonstrating how to use the hand keypoints to adjust strokeWeight.",
-      "image": "",
+      "title": "HandPose Painting - Stroke Weight",
+      "description": "This sketch demonstrates how to change the stroke weight with the left hand.",
+      "image": "painting-stroke-weight.png",
       "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/-C3Og5Wzs" }
     },
     {
       "title": "HandPose Painting - Color",
-      "description": "Sketch demonstrating how to use the hand keypoints to adjust color.",
-      "image": "",
+      "description": "This sketch demonstrates how to change colors with left hand taps.",
+      "image": "painting-color.png",
       "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/InzaVXI-R" }
     },
     {
       "title": "HandPose - Thumbs up or Thumbs Down",
-      "description": "Sketch demonstrating how recognize gestures based on the relative positions of the hand keypoints",
-      "image": "",
+      "description": "This sketch demonstrates how to recognize a gesture based on the relative positions of two keypoints.",
+      "image": "thumbs-up.png",
+      "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/0_qPHtsF_" }
+    },
+    {
+      "title": "HandPose - Particles",
+      "description": "This sketch demonstrates how to emit particles from the keypoints of the hand.",
+      "image": "handpose-particles.png",
       "urls": { "p5": "https://editor.p5js.org/codingtrain/sketches/0_qPHtsF_" }
     }
   ],
@@ -83,6 +89,12 @@
           "title": "On-Device, Real-Time Hand Tracking with MediaPipe",
           "url": "https://research.google/blog/on-device-real-time-hand-tracking-with-mediapipe/",
           "description": "Google Research blog post covering the technical details of the HandPose model."
+        },
+        {
+          "icon": "📄",
+          "title": "3D Hand Pose with MediaPipe and TensorFlow.js",
+          "url": "https://blog.tensorflow.org/2021/11/3D-handpose.html",
+          "description": "Tensorflow Blog post covering the 2021 updates to hand detection model."
         }
       ]
     }