Skip to content

Mates Studio Commander Editor


Mates Studio's Commander is the simplest among all the environments. Providing a simple user interface for simply adding predesigned pages to the project, it allows project development to finish within seconds. It also provides a quick discussion of each page added and all the widgets it contains making it a perfect choice for those who are just starting with BBM products.

Commander environment offers two main parts, a project editor and a host simulator. This manual will focus on the project editor including how to add built-in and custom pages and checking a short documentation for the page.

Commander Editor

Main Interface

The main editor interface can be divided into the menu bar and two separate columns.

Commander Editor Areas

  1. Project Editor

    This provides a simple way to add or remove pages to the project

  2. Page Discussion

    This area displays a short summary discussion for all the widgets present in the selected page

Commander project windows provides a menu bar for basic functionalities including save, compile, upload and more.

Commander Menu Bar

From left to right, the menu items included are listed below:

Project Tab

Switches to the project editor. This allows developers to add or remove pages to their project.

Control Tab

Switches to controller interface. This allows developers to simulate how a host controller can communicate with a BBM module programmed with the Commander project.


Uploads the project to the module connected to the target port

Create New Project

Opens a new Mates Studio setup window

Open Project

Displays an Open File Window to browse the computer for project files

Save Options

Provides a dropdown menu which provides multiple save functionalities

Item Description
Save Project Save the project
Save Project As Save the project with a new filename
Export as Architect Project Export the project as Architect with a new filename

Tools and Configuration

Provides a dropdown menu which provides tools and project configuration

Tools and Configuration

Item Description
Load PmmC Opens the Load PmmC window for updating firmware
Reverse Orientation Provides option to reverse module orientation
Page Transition Provides option to select transitioning effect (default: None)
Baud Rate Provides option to set baud rate for communicating (default: 9600)
Runtime Mode Provides option to make widget parameters editable or fixed during runtime (default: Fixed)


When using any of these tools and project configurations, it is important to reupload the project.

Software Information

Opens the About window showing the version information of Mates Studio

Port Status

Shows whether the display module is connected successfully for the controller interface

Port Selection

Provides a dropdown selection of all available ports. Selected port is used when programming and when using the controller interface

Port Connect Button

Connects to the module for use with the controller interface

Port Reset Button

Reset connection when using the controller interface

Project Editor

The project editor provides a simple interface allowing developers to select and utilize different page designs/layouts from a built-in collection provided by the Breadboard Mates team and its community. This allows users to quickly produce nice looking GUI applications in seconds.

Adding Pages

By clicking the Add Page button, a collection of pre-made page designs can be browsed.

Add Page

The Page Selection Window will appear as shown:

Select Page Layout

Page designs can be filtered by choosing the category tabs on the left-hand side. A special category, labeled User, contains custom designs made using Architect, Genius and Builder and is saved to:

C:\Users\%USERNAME%\Documents\Mates Studio Pages

By selecting a page design from the list shown in the middle column of the window, a preview of the page will be shown on the right-hand side.

Multiple page layouts can be selected at the same time by holding CTRL key before clicking the page item.

Select Multiple Page Layout

Confirm selections by clicking on the CONFIRM button.

Alternatively, a Browse Computer option is provided to allow loading of page templates located in other PC directories.

Browse Computer

Navigate to the location of the page (matesPage) file.

Open Page File

Confirm selections by clicking on the Open button.

Newly added pages will be added and shown in the project editor.

Removing Pages

Pages not required in the project can easily be deleted by using the delete button included in the page preview shown in the left-hand side of the window.

Delete Page

Page Discussion

A short documentation is also automatically generated for every page that is added. It is displayed in the Page Discussion area.

Page Discussion

By clicking on the page items on the project editor, the documentation will update to match the last clicked page item. The discussion generated contains code snippets that can be used together with Mates Serial Command libraries.

Select Active Page

Save Options

Save Project

Save projects by clicking the Save icon button and selecting Save Project.

Save Project

For a new project, a Save Project window will open to request for the location and filename to use when saving.

Save Project Window

Save Project As

A previously saved project can also be saved to a different location by selecting the Save Project As option instead.

Save Project As

Export as Architect Project

Commander projects can be exported as an Architect project. This allows users to edit individual widgets from pre-made page designs.

Export as Architect

An Export Project window will open to request for the location and filename to use when exporting the project.

Export as Architect Window

Tools and Configuration

This section discusses tools and project configurations which can be used and modified.


When using any of these tools and project configurations, it is important to reupload the project.

Loading (PmmC) Firmware

All BBM products are factory-programmed with the latest stable firmware from 4D Labs. Firmware updates contain improvements and bug fixes. Therefore, it is ideal to load the latest version available during development.

The Commander environment provides a simple way to load any firmware provided with Mates Studio for the target product.

Load PmmC

If there’s currently no COM port selected, an error window will be shown prompting to set a COM port before loading the firmware.

Error: No port selected

Otherwise, the Load PmmC window will open.

Load PmmC Window

As shown, a recommended latest version will be labeled. Click on the target item to select the firmware version.

To proceed with the loading the selected item, click the Upload button.

Load PmmC Upload

Wait until the upload finishes.

Load PmmC Finished

The window will automatically close a few seconds after the upload completes.

Reversing Orientation

The commander environment only allows inverting a project's orientation.

Reverse Orientation

Since this environment does not provide editing capabilities for widgets, rotating the orientation restricted to 180 degrees.

Page Transitions

Commander environments provides different transition effects. By default, None or no transition effect is applied in a project.

Page Transitions

Project Baud Rate

By default, Commander projects use 9600 baud for Mates Serial Command Protocol.

Project Baud Rate

This can be changed by clicking some alternative options as shown.

Runtime Mode

As previously discussed, the Commander environment doesn’t feature design time changes to widgets. Instead, it offers the option to change certain widget parameters during runtime using Mates Serial Commands.

Runtime Mode

By default, the Commander uses Fixed runtime mode. In this mode, widget colors cannot be modified during runtime. This mode consumes less code space and memory and is more stable than the alternative option.

Running the Project

Identifying the Correct Port

To successfully upload a project, update the firmware and control a programmed display, the correct target port needs to be selected. The easiest way to confirm if you are using the correct port is by opening Window's Device Manager.

Before connecting the module to the computer, open Device Manager. Next, connect the module and the window will refresh.

Device Manager

As shown under Ports (COM & LPT), a device is now connected to COM6. If multiple devices are shown, the device recently added is the correct port.

Selecting the Target Port

After identifying the correct port, the target port for the project can be selected.

Select Port

As shown above, there is no port detected. By clicking on the dropdown menu, the application will search for connected ports that the target product might be using.

Select Port Dropdown

Uploading the Project

After finalizing the project, it can be uploaded to the target device specified by the selected port.

Before uploading, the following needs to be confirmed:

  • The port selected is correct and the target product is connected.
  • The port selected is not being used by other applications or other Mates Studio windows.


Refer to Establishing Connection section of the Controller Interface for a tip on how to easily confirm that the port is not busy_)

After checking the items above, upload the project by clicking the Upload button.

Upload Project

Uploading unsaved projects will automatically open a Save Project window before the application proceeds with uploading the project to the target device.

The project will be compiled for graphical resources.

Compiling Graphics

Afterwards, an information window containing the compilation results will be shown.

Compilation Results

Click Proceed to continue with the upload.

Uploading Resources

The graphical resources will be uploaded, and the display will be programmed with the Commander project.

Simply wait for the process to finish successfully. Once it completes, the module will show the first Page of the Commander project.


For instructions on how to test the project, please refer to the Controller Interface documentation.

Additional Options

Creating a New Project

The setup window can be opened from a Commander window by clicking the New Project button as shown:

Create New Project

This will open the Setup Window as shown when opening Mates Studio. Please refer to the Mates Studio User Guide for more information.

Opening a Project

An Open Project window can be opened directly from a Commander project by clicking the Open Project button as shown:

Open Project

This option will open a file selection window for you to find and select a project file to open.

Open Project Window

Software Information

The application version can be checked by clicking the button as shown:

Software Information

This will open a small window containing version and contact information.

About Window