pdf-icon

UIFlow Guide

UIFlow 1.0 Quick Start

1. UIFlow Web IDE 1.0

UIFlow 1.0 Blockly

Event

Event
Blockly Custom

UIFlow 2.0 Quick Start

1. UIFlow Web IDE 2.0

UIFlow 2.0 Blockly

UIFlow 2.0 API Docs

UIFlow 2.0 Project

Import & Export Project
Device Share
Project Zone

M5Burner

Firmware Export
Firmware Publish

Desktop IDE

UIFlow 1.x Desktop IDE
1. UIFlow Web IDE 1.0
step_done
2. M5StickCPlus2 Firmware & Program
step_run

M5StickCPlus2 Firmware Burning and Program Pushing

1. Preparation

  • Refer to the UIFlow Web IDE Tutorial to understand the basic workflow of using UIFlow and complete the installation of the M5Burner firmware burning tool.
  • Download the firmware compatible with M5StickCPlus2 in M5Burner, as shown below.

2. USB Driver Installation

Click the link below to download the driver program matching your operating system. The CP34X (for CH9102) driver package. After extracting the package, choose the installation package corresponding to your operating system's bit version to install. If you encounter problems downloading the program (such as timeout or "Failed to write to target RAM"), try reinstalling the device driver.
Driver Name Compatible Chip Download Link
CH9102_VCP_SER_Windows CH9102 Download
CH9102_VCP_SER_MacOS v1.7 CH9102 Download

3. Port Selection

  1. Connect the device to the computer via USB, in M5Burner select the Burn button for the corresponding firmware, fill in WiFi information, and select the corresponding device port.

4. Firmware Burning

  1. Click the Start button to begin burning. Note: If burning fails or connection times out during the process, please check for port occupation, try updating the USB cable, or reduce the baud rate.

5. API KEY

  1. After completing the firmware burning, the device will reboot and maintain the USB connection. Use M5Burner to click the Configure option, select the corresponding port, and click Load to load the current device configuration. Once obtained, a pop-up will display the current device's API KEY, Start Mode, and other information. At this point, we can copy and save the device's API KEY information for later use. Note: In this example, we will use UIFlow Web IDE (online version) for programming, therefore, Start Mode needs to be set to Internet Mode.

  1. After configuring the device for online programming mode, we need to use the API KEY to establish a connection between the device and UIFlow, allowing it to push programs to the specified device. Users need to visit flow.m5stack.com in a web browser on their computer to enter the UIFlow programming page.

  2. Click the settings button in the upper right corner of the page, enter the API KEY we obtained in the previous step, click OK to save, and wait for the connection to succeed.

6. RUN

  1. After completing the above steps, you can start programming with UIFlow. Below is a simple program to demonstrate how to drive the M5StickCPlus2 to light up an LED indicator. (1. Drag the LED lighting block 2. Attach it to the Setup initialization program. 3. Click the run button in the upper right corner.)
On This Page