Secret Code

Visuino

Visual Programming

Liam Davies

Issue 70, May 2023

This article includes additional downloadable resources.
Please log in to access.

Log in

Learn a unique style of Arduino programming with Visuino, a clever and incredibly intuitive software that lets you make awesome projects without a single line of code!

We’ve written literally hundreds of projects that use the Arduino programming language and its environment over the past six years. It’s adaptable, powerful and, because it’s written in C/C++, it’s compatible with just about everything. So, needless to say, at DIYODE, we’ve accumulated a bit of expertise with it.

However, as we’ve heard from readers, programming is a big obstacle to learning the Arduino platform. This seems to be a broader problem within the beginner Arduino community. While the platform is accessible, it still requires awareness and consideration of what can sometimes be a mystifying language. Some makers may not be interested in it at all, while others simply don’t like the logic that ‘thinking’ in code requires. For instance, we see many automotive and woodworking projects that require some electronic functionality - think lighting, displays or sensors - but the code required to make it run is just viewed as an obstacle, not as a learning challenge. In other words, some makers are concerned with just the result, and aren’t interested in the coding process. There is nothing wrong with this, as everyone has different approaches to making projects.

This is where Visuino comes in! We recently had a reader email us about this awesome software, so we spent some time experimenting with it and exploring its capabilities.

First Impressions

Visuino, as the name suggests, is a block-and-flowchart based approach to Arduino programming. The Windows-based software allows makers to drag and drop blocks into a workspace, which can be connected with nodes. We’ve seen systems like this many times before, for a huge variety of applications. Everything from game engines like Unreal Engine to video editing like DaVinci Resolve uses node and block-based editing systems.

Because of the inherently visual logic style, it’s incredibly intuitive, especially for those who have never touched a line of code in their life. Even if you are an experienced programmer, using Visuino to rapidly deploy a project is incredibly easy, especially when prototyping.

Installation

Installing Visuino comes in the form of a ZIP file that must be downloaded and extracted. Once extracted, we can run the included ‘setup.exe’ file to install it on our computer. Immediately, we noticed that the user interface uses an early-2000s style of interface elements. Users of Windows 2000 and XP will recognise this style.

There isn’t anything inherently ugly about the design of Visuino, and some may prefer the older Windows design language. However, it is definitely ageing and looks somewhat out of place on a modern Windows 10 or 11 system. Once the software has finished installing, the custom icons representing the node functionalities are highly detailed, a clear departure from the simplified interface that most modern IDEs have.

This isn’t a graphic design magazine though, and most makers won’t mind the distinctive icons - they make everything easier to find!

In the main editing window, the Arduino is represented by a singular, tall, blue block. It contains connection points for the input and output of each pin and interface onboard the Arduino.

To make a new connection, we can click and drag on a node to draw a new wire - we can connect this to another block, or we can just connect it back to an Arduino node.

For example, if we wanted to read the analog voltage of a pin, and output a PWM signal with a duty cycle proportional to its voltage, we can do that with just one wire. Visuino also intelligently lays out the node wires that you draw, which is a nice change from the spaghetti code that often gets written with Arduino code.

This program will act as a simple LED dimmer.

Project 1: Dimmer

Parts Required for Project 1:JaycarAltronicsPakronics
1 x 10kΩ PotentiometerRP3510R2204ADA5263
1 x Arduino Nano (or compatible)XC4414Z6372SS102010268
1 x Red LED*ZD0150Z0800ADA777*
1 x 220Ω Resistor*RR0556*R0542*SS110990043

Parts Required for Project 1:

* Quantity shown, may be sold in packs. You’ll also need a breadboard and prototyping hardware.

To make this circuit, you’ll need a potentiometer, an LED and an appropriate current-limiting resistor. We chose a 10kΩ potentiometer and a 220Ω resistor.

We first inserted our Arduino Nano into the breadboard, and added an LED, 220Ω resistor and the wire connecting it to the Arduino’s D3 pin.

We’ll also need to connect both the Ground and the 5V wire to the breadboard rails, which we’ll use for the potentiometer in the next step.

There are many different types of potentiometers that can be used for this project, but we used a basic wiper potentiometer that can be used with a knob and attached to a panel. The left pin is connected to ground, and the right pin connects to 5V. This way, as we move the knob, the voltage on the middle pin goes between 0 and 5V.

If you’re not happy with the pins used for our circuit, all you have to do is change the location of the nodes that connect to the Arduino block. As long as the physical hardware supports whatever you’re connecting to it - for example, a PWM signal will only work on a PWM pin - it will work fine. Note that in our Fritzing circuit, we ended up changing the input pin from A0 to A4, and the output pin from D11 to D3 to make connections easier. We changed the Visuino program accordingly.

Let’s upload this program and give it a go! To do this, press the “Compile and Upload” button at the bottom of the window.

And, within seconds, we have a working Arduino project!

By changing the knob, we can alter the brightness of the LED. This is a great starting point for more advanced LED dimmers, especially if you were to say, hook an LED strip up to a MOSFET.

Something that’s worth noting is that Visuino takes care of the nitty-gritty maths details for us in this project. Normally, reading the value of a potentiometer gives us a value from 0-1023, which we have to convert into a range of 0-255 for a suitable PWM output to our LED. To an experienced Arduino programmer, this will be obvious, but to those who are still getting into electronics, this is just one more detail that would cause problems otherwise.

However, we haven’t even scratched the surface of what’s possible in Visuino.

Blocks

There are a large variety of blocks available in Visuino, ranging from basic mathematics operations to advanced communication blocks.

These blocks contain inputs on the left side, and outputs on the right side. These can be considered functions, but will handle all of the data management for you!

To use them, head to the right side panel and drag your desired block to the working space.

Note that the space around the Arduino’s main block will expand automatically! This removes the need to constantly resize the main page as you add more blocks.

Project 2: Accelerometer

Additional Parts Required for Project 2:JaycarAltronicsPakronics
1 x Arduino Nano (or compatible)XC4414Z6372SS102010268
1 x Accelerometer (or compatible)-Z6321ADA163

Additional Parts Required for Project 2:

To make a more advanced program, we’re going to use an ADXL345 accelerometer to gather acceleration values from the Arduino and output them onto the terminal. But first, we need to build the circuit!

The accelerometer itself comes in a few different forms and with different compatible chip series, but if you’ve got one marked ADXL345 it should work fine. We’re using the VCC, Ground, SDA and SCL pins on this breakout board. Excuse the horrible soldering - it was used as soldering practice a few years back!

On the breadboard itself, we removed the LED and potentiometer as part of the last project. We also rearranged the wires to make it easier to see what we were doing.

We then inserted the Accelerometer into the board, ensuring that the header pins make good contact. Some of these sensor boards will need to have header pins soldered on.

We connected the 5V wire and Ground, along with the SDA and SCL wires to pins A4 and A5 respectively. To those new to Arduino wiring, the SDA and SCL pins are needed for use with the I2C bus, which can carry digital information to and from sensors connected to the Arduino. On an Arduino Nano, the I2C bus is on pins A4 and A5, but on other boards, it may be different. You should check a pinout diagram of your board online to verify this.

After verifying the circuit is configured correctly, we can move to Visuino to program it.

We are showing a basic setup for our Accelerometer project. There are three blocks used - a ClockGenerator, the Accelerometer block and the Arduino block itself.

Let’s start at the left-most block. The ClockGenerator block outputs a signal at a specified number of pulses per second. We set ours to 5Hz.

When connected to a sensor, this pulse tells the sensor to poll values and output them to whatever we have connected to the other side.

On the other side, we have an I2C wire connected to the Arduino for communication, and a red Analog wire for outputting to the terminal. This outputs the X-axis (the horizontal acceleration) to the Serial Console for us to see in the Visuino window. However, we can do better than that! What if we wanted to see all axes output to the Serial console? To do this, we can use a bunch of AnalogToText blocks to convert each axis to text, before combining each in a Multi-Merger Block. Finally, we can feed that to our Serial block and output it to the terminal. Easy!

To test this, we uploaded the code and clicked on the “Connect” button in the Serial Monitor window. This causes the Arduino to output accelerometer values for each axis, one at a time. No code or messing around with connection settings needed!

We tried moving around the breadboard quickly, and orienting it in different directions to try out the project. Notice that even when the sensor is lying on the desk, one value hovers around 1 - this is the constant force of gravity! Using this and some extra maths (if that’s your thing), it’s a great way to determine the orientation of the Arduino.

There are also many other data outputs available on the ADXL345’s block, such as a free-fall detection sensor.

We can, of course, hook this up to a ton of other gadgets to further explore Visuino and its capabilities. Using a Bar Graph block, we could output the magnitude of the acceleration to an LED bar graph!

It’s also very easy to use other sensors you have available in your workshop.

For an experiment, we dragged a BME280 block into the workspace. The BME280 is an environment sensor that is used in many weather station systems. Most we see on the maker market are I2C-based, however, there are others that are SPI-based, too.

The data from this module can easily be configured to be output to an OLED screen, to the Serial console, or for use with automated projects such as an automatic humidity controller. Awesome!

Compatibility

Visuino is compatible with a lot of different Arduinos, which makes it fairly easy to interface with most boards you have available in your workshop. To change the board you’re using just head into the boards menu in Visuino and change to the required board that you want to use.

It's worth noting that the programming block that Visuino uses automatically adapts to the board type that you are using. This makes it fairly easy to understand the pin requirements of specific boards as well as the capabilities of each pin. Most popular board manufacturers have their board types available on Visuino, however, their implementation quality may differ and may need specific knowledge or fixes for each.

Limitations

As with any software intended to simplify the process of doing something, there will be inherent limitations in a variety of ways. However, it’s important to weigh these limitations with the fact that many potential users of Visuino will not be concerned with them - they just want a working project.

The first limitation of Visuino is optimization. Because the code it uploads to your Arduino is built automatically, it won’t be as fast or as optimised as a version that is written by a knowledgeable programmer. Additionally, because of the libraries and additional Visuino code that is uploaded to your Arduino, there is an additional amount of Flash memory usage consumed by Visuino. It’s up to you to determine whether the convenience of visual programming is worth the additional processing overhead added by Visuino.

The second limitation mainly depends on how you’ve decided to pay for the different tiers of Visuino. The free tier of Visuino is, thankfully, quite flexible with the options it provides. The primary limitation the free tier has is a maximum of 20 components. However, for simple projects, we would argue this is enough. The free version also doesn’t include features such as SubDiagrams (i.e. encapsulating blocks inside other blocks) and more advanced computations such as the Fast Fourier Transform.

Please visit the Visuino website for more information about the capabilities of each tier. Higher tiers offer these features, although none offer lifetime update support. Those looking to use Visuino long-term may consider purchasing additional yearly update packages.

Final Thoughts

While there will always be die-hard enthusiasts shouting down at users of visual programming software, it continues to be popular for beginners and experts alike. And for good reason - software like Visuino provides the means to produce functional and easy-to-understand Arduino projects without writing a single line of code. Those who are not interested or confident in their programming abilities will find Visuino an awesome way of getting started with Arduino and any interfaces connected to it. On the other end of the spectrum, those who are well-versed in programming but need a quick, effective implementation will still benefit from the incredibly simple interface of Visuino.

Visuino is an excellent tool to have in any Maker’s arsenal, regardless of programming experience. We’d definitely recommend downloading it and giving it a go!

Reading & Resources: