Interesting GUI programming solution

Hello everybody.

I recently came across an interesting solution for GUI programming using a micro-controller. The authors seem to claim that the application (GUI-O) is compatible with any micro-controller... :thinking: Digging deeper, the solution piqued my interest and I decided to give it a try.

After some additional reading and trying out the application, I believe it is an interesting approach. The gist of it is that all interaction between the micro-controller and application is performed using ASCII protocol. The application is more of a framework that implements various customizable widgets.

In case anybody else is interested, I will briefly describe a simple example (toggling a LED). I used ESP8266 module (with Arduino Uno), but it seems Bluetooth or Bluetooth LE modules can also be used (even with less work comparing to ESP8266 as it seems). The final result is shown in the image below.

Steps:
1.) I programmed the ESP8266 (ESP-01S variant) using the code from https://gitlab.com/gui-o-team-public/guio_esp8266/-/tree/master/guio_esp8266. I used Arduino Uno for ESP programming by removing the ATmega chip... After the ESP is programmed and restarted it boots into AP (access point) mode and can be paired with the application (under application quick pair -> direct device pairing menu). Note that I had to leave the username blank in order for successful pairing (bug?).

2.) I uploaded the following code to the Arduino Uno and connected the ESP8266 module (RX, TX, etc...). The ATmega chip must of course now be present on the Ardiuno uno board. The LED was connected on pin 9 through 220 ohm resistor.

//#define CLEAR_ESP_EEPROM

String inData;
const int ledPin = 9;

void setup() {
  Serial.begin(115200);
  while(!Serial) {}

#ifdef CLEAR_ESP_EEPROM
  delay(3000);
  Serial.println("!CLEAR_PARAMS");
#else
  pinMode(ledPin, OUTPUT);
#endif
}

void loop() { 
#ifndef CLEAR_ESP_EEPROM
  while(Serial.available()) {    
    char c = Serial.read();
    inData += c;

    if(c == '\n') {
      if(inData.startsWith("@init")) {
        // GUI INITIALIZATION
        Serial.println("@cls"); delay(100);
        Serial.println("@guis BGC:#FFFFFF"); delay(100);
        Serial.println("|LB UID:title X:50 Y:15 TXT:\"Simple light switch\" FFA:\"font8\" FSZ:3.5"); delay(100);
        Serial.println("|LB UID:tap_me X:50 Y:70 TXT:\"TAP ME!\" FFA:\"font8\" FSZ:3 FFA:\"font5\""); delay(100);
        Serial.println("|CB UID:brightness X:50 Y:50 W:90 BTH:5 HAH:8 HAW:8 VIS:0 STA:135 ENA:45 FGC:#000000 SFGC:#FFFF00 BGC:#CBCBCB"); delay(100);
        Serial.println("|IM UID:light_off X:50 Y:50 IP:\"https://i.imgur.com/3VbsS0Z.png\" VIS:1"); delay(100);
        Serial.println("|IM UID:light_on X:50 Y:50 IP:\"https://i.imgur.com/gNdck9A.png\" VIS:0"); delay(100);
      }
      else if(inData.startsWith("@light_off")) {
        // TURN ON LIGHT
        Serial.println("@light_off VIS:0"); delay(100);
        Serial.println("@light_on VIS:1"); delay(100);
        Serial.println("@brightness VIS:1 VAL:100"); delay(100);
        analogWrite(ledPin, 255);
      }
      else if(inData.startsWith("@light_on")) {
        // TURN OFF LIGHT
        Serial.println("@light_off VIS:1"); delay(100);
        Serial.println("@light_on VIS:0"); delay(100);
        Serial.println("@brightness VIS:0"); delay(100);
        analogWrite(ledPin, 0);
      }
      else if(inData.startsWith("@brightness")) {
          const int idx = inData.indexOf(' ');
          if(idx > 0) {
            const int val = inData.substring(idx + 1).toInt();

            if(val >= 0 && val <= 100) {
              analogWrite(ledPin, static_cast<int>(val * 2.55));
            }            
          }              
      }

      inData = "";
    }
  }

#endif
}
  1. I went to GUI-O application quick pair menu and pressed connect and closed the settings menu. Then I pressed the "pulsating" button and voila... Interacting with the light bulb toggles my LED and sliding the arc slider controls the brightness.

Note that I uploaded the light bulb images to online image hosting service and the application downloaded (and showed) them automatically by specifying the url (see the code above).

Any thoughts? Does anybody have any experience with this? Any similar apps out there?

Best regards,
kpoopk

edit: the link to the app https://play.google.com/store/apps/details?id=com.guio.guioapp