Gesture Slides Controller Using PictoBLox AI Extension

by theSTEMpedia in Circuits > Assistive Tech

16 Views, 0 Favorites, 0 Comments

Gesture Slides Controller Using PictoBLox AI Extension

Gesture Slides Controller

Gesture Slides Controller is an interactive presentation system built in PictoBlox that lets you move through slides using only your finger gesture. Instead of using a keyboard or mouse, the presenter can simply slide a hand left or right in front of the camera to control the presentation.

This project is especially useful for smart classrooms, STEM demonstrations, interactive workshops, and contact-free presentations. It combines computer vision, human body detection, and backdrop-based slides in a simple and engaging way.

What it does

  1. Detects the hand using PictoBlox’s Human Body Detection extension.
  2. Tracks the index finger horizontal position on the camera feed.
  3. Moves to the next slide when the finger moves to the right side beyond a set threshold.
  4. Moves to the previous slide when the finger moves to the left side beyond a set threshold.
  5. Uses 10 images stored as backdrops inside PictoBlox to simulate a slideshow.

Supplies

  1. A laptop or desktop with camera support.
  2. PictoBlox software.
  3. Human Body Detection extension in PictoBlox.
  4. 10 slide images added as backdrops.
  5. A working webcam or built-in camera.

How It Works

When the project starts, the camera is turned on and the video is displayed on the stage with full transparency. The camera resolution is set to SVGA (800x600), and the horizontal flip is turned off. The first backdrop is selected as the starting slide.

Inside the forever loop, PictoBlox analyzes the camera image for a hand. If a hand is detected, it checks the x-position of the index finger. If the finger moves beyond the right threshold, the backdrop number increases by 1 and the next slide appears. If the finger moves beyond the left threshold, the backdrop number decreases by 1 and the previous slide appears.

A 2-second wait is added after each slide change to prevent rapid switching. This makes the gesture control more stable and easier to use during a presentation.

Code Logic

Screenshot 2026-06-12 125617.png
Screenshot 2026-06-12 125630.png
  1. Start the project when the green flag is clicked.
  2. Turn on camera input and hide the camera feed on the stage.
  3. Set camera resolution to SVGA.
  4. Load the first backdrop.
  5. Continuously detect the hand.
  6. Read the index finger’s horizontal position.
  7. If the finger is on the right side, go to the next slide.
  8. If the finger is on the left side, go to the previous slide.
  9. Keep showing the current backdrop as the active slide.

Threshold Values Used

  1. Right movement trigger: finger x-position greater than 120.
  2. Left movement trigger: finger x-position less than -120.
  3. Slide delay after change: 2 seconds.

Build Steps

1.jpg
2.jpg
3.jpg
4.jpg
5.jpg
6.jpg
7.jpg
8.jpg
9.jpg
10.jpg
  1. Open PictoBlox and create a new project.
  2. Add the Human Body Detection extension.
  3. Import your 10 slide images into the Backdrop library.
  4. Write the script to start the camera and initialize the first backdrop.
  5. Add the hand detection block in a forever loop.
  6. Use the index finger x-position to control slide movement.
  7. Test the gesture direction and adjust the threshold values if needed.

Tips for Better Results

  1. Keep the hand visible and well lit.
  2. Use a plain background for better hand detection.
  3. Adjust the threshold values if the slide changes too quickly or too slowly.
  4. Make sure the slides are ordered correctly in the backdrop list.

Applications

  1. Classroom teaching.
  2. Project presentations.
  3. Interactive exhibitions.
  4. Smart seminar control.
  5. Contactless slide navigation.

Conclusion

Gesture Slides Controller is a simple but powerful example of gesture-based interaction using PictoBlox. It shows how human body detection can be used in a practical way to control a slideshow without touching the keyboard or mouse.

Click -> here to download the Code file (sb3)