User interface

When you open CircuitBlocks, you will see a window that looks like this.
It’s pretty simple – starting a new project (we also call them "sketches") can be done by clicking the ‘New project’ button.
Saved sketches will appear right next to that button and you can access them at any time.
If you encounter any kind of an issue with CircuitBlocks, press the 'Send error report' at the bottom of the main screen. You'll get an error report number - please reach out to us via contact@精品导航.com and provide your error report number. 

Creating a new project (sketch)

Press on the big "New project" button.

You'll get an option to choose the device and sketch type.

For the device, pick Wheelson.

For the Sketch type, choose Block.
Press the Create button.

You'll get a screen that looks like this:

On the top of the screen, there is a toolbar with a few buttons.
The block selection bar is located on the far left - you can take the blocks from there and drop them into the "drawing" area in the middle of the screen. 
In the middle of the screen is where you’ll be “drawing” your code with colorful blocks.
On the right side of the screen, you will see code written in C++ appear magically by itself when you drag and drop the colorful blocks.
C++ is one of the most popular programming languages, but it's fairly complex to understand if you've never coded before.

That's why we've created CircuitBlocks - here you can drag and drop colorful blocks that represent parts of code and see what your program would look like in C++. When you get skilled enough, you will be able to switch directly to textual coding in C++ without the need for colorful blocks.

Toolbar

Here's a short explanation of what the buttons in the window toolbar do

1. Back to the main menu– returns you to the home screen without saving
2. Save/Save As– saves your sketch, make sure to press this button from time to time, and before closing CircuitBlocks
3. Wheelson connection indicator- the red dot turns green if your Wheelson is connected to your computer via a USB cable
4. Export to binary- saves a binary file of your code to your computer. This is a more advanced function that you won't need for now.
5. Serial monitor- this button opens a window that we call the "Serial monitor". "Serial" is a nickname for a type of communication that is happening between Wheelson and your computer. In this window, you will, later on, be able to see the messages that are being sent from Wheelson to your computer via the USB port.
6. Close code- with this button, you can close or re-open the code window on the right of the screen. This is useful if you need more screen space for seeing your colored blocks.
7. Run- This button will translate the code you have constructed in CircuitBLocks tomachine codethat Wheelson understands (beep boop beep boop 1011100101) and send the code to your Wheelson via the USB port.

Code window

The so-called "Code window" has the following parts:

1. Main code screen- code written in C++ will appear here as you drag and drop colorful blocks on the left side of the screen.You'll see that some parts of the code are colored in funny colors. Programmers call thissyntax highlighting.Basically, what is happening is that different categories of code commands are colored differently so that programmers can understand the code more easily.
2. Light/dark theme switch- you can toggle the background and text color of the code window with this button.
3. Expand- stretches the code window across the entire screen. Press it again to resize it to the half-screen again.
4. Close– closes the code window, the same functionality as the ‘Close Code’ button from the toolbar.

Drawing board

The drawing board is where the magic happens.
It has the following parts

1. 积积对积积的桶30分钟无掩盖 bar– type the name of the component you are looking for here.
2. Component selector– the blocks are divided into different categories here. Each category has a specific color designated to it.
3. Drawing area– you will drag the blocks from the component selector and drop them into the drawing area. This is how code is made. Easy peasy!
4. Center tool- if you get lost when scrolling across the drawing area, press this button, and it will center your view on the blocks you have dropped on the drawing area.
5. Zoom buttons- zoom in and out of the drawing area.