How To

Start with your idea right away.

How to use blokdots

blokdots is a simple software to programm hardware. To understand how that works just a few basic infos how its setup is.

The app is set up in two main windows, the Live View and the Project window.

Here is a typical setup. The Live View is the smaller one (left) and the Project window is the bigger one.

The Live View displays all hardware components that are currently connected to your board. From here you can also connect new ones, disconnect some others and most importantly, you can see the current values of sensors as well as manipulate the values of actutators.

The Project displays the actual algorithm you want to create. Here your connections are built and the setup for your prototype is defined.

How to set up hardware

First of all, you will need an Arduino Uno, a basic microcontroller used in many prototyping projects.

blokdots is intended to use the Grove components by Seeed Studio, since no wiring is needed. To begin the Starter Kit for Arduino is suggested.

Of course you can also use regular components, but here you need to wire them up yourself. The pins are named the same as when using the Grove shield.

Put the Grove shield on top of your Arduino Uno.

Put the Grove shield on top of your Arduino Uno, and plug it in to your computer, the correct firmware will automatically uploaded to your board once started the software.

Just plug in the components to the grove shield. Digital components to slots marked with a "D", analog components to a slot marked with an "A". Some special PWM components just can connected to the slots 3, 5 and 6.

See here what components need to be connected to which slots, if you are not certain.

How to use the Live View

The Live View shows you which components are currently connected to your board. When connecting an new component, click on "Setup" and select the component you just plugged in.

Once connected, you will see here the current values (if the component is an input) or manipulate the values of the output.

Clicking on the arrow even gives you more options, like changing the display value or change some of the basic settings of the component.

Acutators allow it to be manipulated. E.g. this servo can adjust its angle.
Using the extra menu (arrow) you can select the unit. [more options are going to come]
Sensors only show their values.

To disconnect a component, simply hover over the top right corner of a slot and click the appearing "x" to close the slot. Now you can reset a different component again.

How to build a project

Setup Components

To use a component into a project, click "use" either within the setup in your project window, or within the live view. Once set, you can now use your hardware to build connections.

Build Connection

Connections are built in simple IFTTT (if this then that) ways, meaning your relations form simple sentences like "If one thing happens, then an other thing should react".

Simply click through the wizard until your final result is happening for one relation. There can be as many of these relations as you want. Also there is no limit on how many reactions happen onto the same kind of action.

There will be more variants of these relations in the future, e.g. an if / else relation or multiple reactions to one trigger.

Run Project

Once you want to test your project, click the "Play" button on the upper left. Code is getting compiled and your project will immediately start.

Before testing changes, stop and restart the project, otherwise the new code will not be compiled.

Change Names

For better structuring your project, you can rename the project itself, the IFTTT cards and components. Simply click on the name and start typing.

Save / Open Projects

To save your project hit the "Save" button and select a location. A folder will be generated where then two files will be saved.
To reopen your project, just load the .json file from the folder.

The buttons right below "Run Project" allow to save and load.

How to export code

When saving a project, apart from the .json file, also a .js file is saved. This file contains the exact code built using the app, but in plain javascript.

To be able to use it, you need to install Node js. When you have it installed you can start using the script by opening your terminal and type the following:


$ cd your/project/folder

$ npm install johnny-five --save

$ node project-file.js

Now the project should run exactly the same way as using the blokdots app.

You can adjust the code here as you want using the Johnny-Five API or use other node modules to control a webinterface with your hardware.