Introduction: Interactive MBot With JavaScript

In this Instructable, we will build an interactive mBot with JavaScript. With Johnny-Five framework, we are able to program robotics with JavaScript. A web interface based on Socket.io will be set up to interact with mBot. We can play different sounds and push a ball horizontally on the web interface depending on the distance between sonar sensor on mBot and obstacle. The motor speed could be adjusted from the slider on the web interface. So, let’s get started!

Step 1: Initial Setup

    1. Get a mBot with Bluetooth module from Makeblock, follow the user manual and assemble your mBot.

    2. Follow the instruction on https://github.com/Makeblock-official/mbot_nodebots and install dependencies.

    3. Install socket.io and express with commands npm install socket.io@1.3.6 and npm install express@2.5.1.

    Step 2: Program the MBot

    MBot is programmed with JavaScript based on Johnny-Five framework in this project. Basically, we will use motors, sonar sensor and leds on the mBot. Check the APIs and examples in the following websites to get detailed information:

    Motor:
    http://johnny-five.io/api/motor/

    https://github.com/Makeblock-official/mbot_nodebots/blob/master/examples/motors.js

    Sonar sensor:
    http://johnny-five.io/api/proximity/

    https://github.com/Makeblock-official/mbot_nodebots/blob/master/examples/sonar.js

    Leds:
    https://github.com/Makeblock-official/mbot_nodebots/blob/master/examples/leds.js

    You can download the attached file to see all codes. Please make sure the sonar sensor is plugged into port 2.

    Step 3: Create a Web Interface

    In this section, bootstrap-slider and CreateJS are used to set up the web interface. You can find their detailed information in the following websites:

    http://seiyria.com/bootstrap-slider/

    http://createjs.com/getting-started

    Different sounds will be played depending on the distance between sonar sensor and obstacle, and then the red ball will move accordingly. Motor speed and distance are displayed on the web interface.

    You can download the attached file to see all codes. Unzip the file, copy the pubic file and paste it into your project file.

    Step 4: Test and Have Fun

    1. Pair your laptop with Bluetooth module on the mBot, you can follow the instruction on https://github.com/Makeblock-official/mbot_nodebots (see Bluetooth module section).

    2. Turn on mBot, run the move.js with the command node move.

    3. Open your browser(Chrome suggested), input localhost:3000 in the address bar and press enter.

    4. Use up, down, left, right and space keys on your keyboard to control the mBot. We are ready to play musical mBot, change motor speed and interact with ball on the web interface.

    Comments

    author
    seamster (author)2015-10-08

    Very cool robot! Thanks for sharing the details on how you made this!

    About This Instructable

    2,789views

    20favorites

    License:

    More by lifemaker:Interactive mBot with JavaScript
    Add instructable to: