Interface and Application Programming

Group assignments

compare as many tool options as possible

My group assignments

west-harima week-assignments 14

Individual　Assignments

write an application that interfaces a user with an input &/or output device that you made

Have you answered these questions?

Linked to the group assignment page.
Documented your process.
Explained the UI that you made and how you did it.
Explained how your application communicates with your embedded microcontroller board.
Explained any problems you encountered and how you fixed them.
Included original source code (or a screenshot of the app code if that's not possible).
Included a ‘hero shot’ of your application running & communicating with your board.

PC working environment

PC: MacBook Pro(16-inch,2019)
OS: Sonoma 14.7.2
Terminal: zsh

hero video

Blynk

alt text

download

What is Blynk?

Blynk is a platform that makes it easy to operate and monitor IoT devices such as Arduino and ESP32 from a smartphone. It consists of a smartphone app, cloud, and a library for microcontrollers, and can communicate in real time using Wi-Fi and BLE. Since the operation screen can be created with no code, even beginners can easily realize LED ON/OFF, check sensor information, etc.

alt text

How to use

board : XIAO ESP32C3
IDE : Arduino IDE

Register my account on Blynk
Open Arduino IDE, I installed Blynk Library

alt text

Connect hardware
Setting Blynk (The details below)

1.Try Blynk

This time I tried buzzer using Blynk.

PC setting

In PC, login Blynk

Create Template

alt text

Datastreams

In this time, I choose Virtual Pin

alt text

Setting for buzzer

Name: Any name is OK.
PIN: 21 (For PIN, enter the GPIO number from the datasheet.)

alt text

Web Dashboard

Drag the Widget(switch and LED) to Dashboard and setting

alt text

Switch Settings details

alt text

LED Settings details

akt text

Smartphone setting

Install Blynk App (Only the first time).
Then, Login Blynk App.

1.Select "Developer Mode".
2.Choose template I made in PC. (-> Edit view of Dashboard is opened.)
3.Add Switch and LED. (Switch is a alternative of switch )

alt text

4.Click Button and setting.
5.Click LED and setting.
6.Once the buttons and LEDs are tied to the pins configured on the PC, the setup is complete.

alt text

Create a new device

Return to the Blynk' management page in PC to work again.

Create a new device from template.

alt text

Choose template.

alt text

Auth Token is appeared.

alt text

In order for Blynk to communicate with each target device, an Auth Token must be planted on the target device side.Copy this AuthToken and insert it into the Arduino IDE code.

2.Arduino IDE

Reference site(code)
Replace AuthToken, Lines 7-9.

/*************************************************************
  This is a simple demo of sending and receiving some data.
  Be sure to check out other examples!
 *************************************************************/
// Template ID, Device Name and Auth Token are provided by the Blynk.Cloud
// See the Device Info tab, or Template settings
#define BLYNK_TEMPLATE_ID "TMPL6mfpLRZRp"
#define BLYNK_TEMPLATE_NAME "week14LED"
#define BLYNK_AUTH_TOKEN "zrzT9HbkGFmcr14SVQwjE803HekDSkEs"

// Comment this out to disable prints and save space
#define BLYNK_PRINT Serial

#include <WiFi.h>
#include <WiFiClient.h>
#include <BlynkSimpleEsp32.h>
#include <math.h>

char auth[] = BLYNK_AUTH_TOKEN;

// Your WiFi credentials.
// Set password to "" for open networks.
char ssid[] = "your Wi-Fi name";
char pass[] = "your Wi-Fi password";

BlynkTimer timer;

// the number of the LED pin (GPIO number)
const int ledPin = 2;

// This function is called every time the Virtual Pin 1 state changes
BLYNK_WRITE(V1) ///LightPin:Relay_operates_on_LOW_Input_Voltage_coneccted_NC
{
  int buttonState = param.asInt();
  // Update state
  if(buttonState == HIGH){
     digitalWrite(ledPin, HIGH);
     Serial.println("HIGH");
  }else{
     digitalWrite(ledPin, LOW);
     Serial.println("LOW");
  }
}

// This function is called every time the device is connected to the Blynk.Cloud
BLYNK_CONNECTED()
{
  Serial.println("Connected!");
}
//////////////////////////////////////////////////////////////////////

void setup() {
  // Serial port for debugging purposes
  Serial.begin(115200);

  //pinMode setting
  pinMode(ledPin , OUTPUT);

  //WiFI Setting
  Blynk.begin(auth, ssid, pass);
  // You can also specify server:
  //Blynk.begin(auth, ssid, pass, "blynk.cloud", 80);
  //Blynk.begin(auth, ssid, pass, IPAddress(10,0,1,28), 8080);
  //Blynk.begin(auth, ssid, pass, IPAddress(10,0,1,28));

  // Setup a function to be called every second
  //  timer.setInterval(1000L, myTimerEvent);
}

void loop() {
  Blynk.run();
}

result

Problems I faced and solutions

Problems	solutions
Will not go online	Change Wi-Fi to 4G

At first, I was using 5G.
However, the XIAO ESP32C3 only supports 4G connections.

Once connected, it will appear online as shown below.

alte text

STEP RESPONSE

I used Adrian's Step Response as a reference to see the response in Processing.

For more information on step response, please refer to week9 for more information on the step response.

Arduino IDE

code (referenceAdrian)
The first time we tried this, the value on line 59 was changed because it was over displayed in Processing.

//tx_rx03  Robert Hart Mar 2019.
//https://roberthart56.github.io/SCFAB/SC_lab/Sensors/tx_rx_sensors/index.html

//Modified by Adrián Torres Omaña
//Fab Academy 2023 - Fab Lab León
//Step Response TX, RX
//Fab-Xiao

//  Program to use transmit-receive across space between two conductors.
//  One conductor attached to digital pin, another to analog pin.
//
//  This program has a function "tx_rx() which returns the value in a long integer.
//
//  Optionally, two resistors (1 MOhm or greater) can be placed between 5V and GND, with
//  the signal connected between them so that the steady-state voltage is 2.5 Volts.
//
//  Signal varies with electric field coupling between conductors, and can
//  be used to measure many things related to position, overlap, and intervening material
//  between the two conductors.
//


long result;   //variable for the result of the tx_rx measurement.
int analog_pin = A1; //  GPIO 27 of the XIA0 RP2040 or ESP32-C3 pin A1
int tx_pin = D2;  //     GPIO 28 of the XIAO RP2040 or ESP32-C3 pin D2
void setup() {
pinMode(tx_pin,OUTPUT);      //Pin 2 provides the voltage step
Serial.begin(115200);
}


long tx_rx(){         //Function to execute rx_tx algorithm and return a value
                      //that depends on coupling of two electrodes.
                      //Value returned is a long integer.
  int read_high;
  int read_low;
  int diff;
  long int sum;
  int N_samples = 100;    //Number of samples to take.  Larger number slows it down, but reduces scatter.

  sum = 0;

  for (int i = 0; i < N_samples; i++){
   digitalWrite(tx_pin,HIGH);              //Step the voltage high on conductor 1.
   read_high = analogRead(analog_pin);        //Measure response of conductor 2.
   delayMicroseconds(100);            //Delay to reach steady state.
   digitalWrite(tx_pin,LOW);               //Step the voltage to zero on conductor 1.
   read_low = analogRead(analog_pin);         //Measure response of conductor 2.
   diff = read_high - read_low;       //desired answer is the difference between high and low.
 sum += diff;                       //Sums up N_samples of these measurements.
 }
  return sum;
}                         //End of tx_rx function.


void loop() {

result = tx_rx();
result = map(result, 17000, 23000, 0, 128);  //I recommend mapping the values of the two copper plates, it will depend on their size
Serial.println(result);
delay(100);
}

Processing

code (referenceAdrian)
Port is changed to the Port you use.

//Fab Academy 2021 - Fab Lab León
//Step Response
//Adrianino
//ATtiny1614

import processing.serial.*;

float sensorValue; //variable for the serial data
Serial myPort;

void setup() {  //as dynamic/setup function called initially, only once
  size(1024, 200);// is the window (1024=sensor max. value)
  //replace the port String with the port where your Arduino is connected
  //myPort = new Serial(this, "/dev/tty.wchusbserial1450", 115200);
  myPort = new Serial(this, "/dev/cu.usbmodem14201", 115200); // serial port
  background(255);  //set background white

}

void draw() {  //draw function loops 

  noStroke(); // outline
  fill(255,0,0,20); // color inside
  rect(0, 0, sensorValue, height); //position and size

  fill(255,70);
  rect(sensorValue, 0, width-sensorValue, height);

  println(sensorValue);
  fill(0,0,0);// these are the colors inside
  text(sensorValue + " " , sensorValue, height/2);
  textSize(32);

}

void serialEvent(Serial myPort) { // sketch read the serial data
  String inString = myPort.readStringUntil('\n');
  if (inString != null) {
    inString = trim(inString);
    float[] values = float(split(inString, ","));
    if (values.length >=1) {
      sensorValue = values[0]; //first value in the list
    }
  }
}

Result

I thought it was better than looking at it on a serial monitor because it is much easier to understand.

impressions

I thought it was interesting that the system works in conjunction with a smartphone.
I thought it would be easier to understand changes if they were visible as a form rather than a number.

Interface and Application Programming

Group assignments

My group assignments

Individual Assignments

Have you answered these questions?

PC working environment

hero video

Blynk

How to use

1.Try Blynk

PC setting

Smartphone setting

Create a new device

2.Arduino IDE

result

Problems I faced and solutions

STEP RESPONSE

Arduino IDE

Processing

Result

impressions

Individual　Assignments