9. Wearables¶

I. Inspiration and References¶

II. Introdution to ''Wearables''¶

Simply defined, Wearables are all kinds of technology built into things we wear to create a certain function or statement. This week came with a lot of new and honestly a bit overwhelming things to try out. After getting a nice high school refresher on electronics through e-textiles, we jumped into how all of this tech can actually live on the body. It felt like a natural continuation, aiming to turn our small fabric tests into interactive wearable pieces. This week also pushed things further as we explored different sensors and actuators, learning how to build more elaborate, responsive circuits that come alive through interaction.

Some of the most useful components we will deal with this week:

Actuators¶

An actuator is any output component in a circuit that converts electrical energy into a physical action (light, sound, movement, heat). Example of some useful actuators:

Sensors¶

Sensors are devices that detect changes in the environment by measuring physical qualities such as light, touch, sound, temperature, movement, pressure, or distance, and converting them into electrical signals that a microcontroller, computer, or machine can understand and act upon.

Microcontrollers¶

The microcontroller is the “brain”, it reads inputs from sensors, processes the data, and sends outputs to things like LEDs, motors, or screens. Within this week we deal with two microcontrollers:

1. Arduino Uno¶

A microcontroller board based on the ATmega328P chip. It features digital and analog input/output pins, a USB connection for programming, and a simple interface that makes it ideal for beginners to build interactive electronic projects.

Set Up Arduino Uno in the Arduino IDE

Open the Arduino IDE and launch the program.
Select the correct board Tools → Board → Arduino AVR Boards → Arduino Uno (If “Arduino Uno” already has a checkmark next to it, it’s already set.)
Select the processor (usually automatic) For Uno, it’s already: ATmega328P, you normally don’t need to change this.
Select the correct Port If your Uno is connected: Tools → Port → (your COM port) Example: COM3 (Arduino Uno)
Check that the IDE now shows the board, at the bottom right corner, you should see: Arduino Uno on COMX.

2. Seeed Studio XIAO (XIAO-ESP32-C3)¶

The Seeed Studio XIAO ESP32-C3 is a compact, Wi-Fi and Bluetooth-enabled microcontroller that packs a lot of power into a very small footprint. It’s built around the ESP32-C3 chip, giving you wireless connectivity, several digital and analog pins, low power consumption, and USB-C programming. Its tiny size makes it ideal for wearables, E-textiles, and any interactive designs and prototypes.

XIAO-ESP32-C3 Features

Powerful CPU: ESP32-C3, 32bit RISC-V singlecore processor that operates at up to 160 MHz.
Complete WiFi subsystem: Complies with IEEE 802.11b/g/n protocol and supports Station mode, SoftAP mode, SoftAP + Station mode, and promiscuous mode.
Bluetooth LE subsystem: Supports features of Bluetooth 5 and Bluetooth mesh.
Ultra-Low Power: Deep sleep power consumption is about 43μA.
Better RF performance: External RF antenna included.
Battery charging chip: Supports lithium battery charge and discharge management.
Rich on-chip resources: 400KB of SRAM, and 4MB of on-board flash memory.
Ultra small size: As small as a thumb(21x17.8mm) XIAO series classic form-factor for wearable devices and small projects.
Reliable security features: Cryptographic hardware accelerators that support AES-128/256, Hash, RSA, HMAC, digital signature and secure boot.
Rich interfaces: 1xI2C, 1xSPI, 2xUART, 11xGPIO(PWM), 4xADC, 1xJTAG bonding pad interface.
Single-sided components, surface mounting design.

Set Up XIAO-ESP32-C3 in the Arduino IDE¶

Set Up XIAO-ESP32-C3 in the Arduino IDE

First, we are going to connect XIAO ESP32C3 to the computer.
Launch the Arduino application.
Add ESP32 board package to your Arduino IDE: Navigate to File > Preferences, and fill "Additional Boards Manager URLs" with the url below: https://jihulab.com/esp-mirror/espressif/arduino-esp32.git
Navigate to Tools > Board > Boards Manager..., type the keyword "esp32" in the search box, select the latest version of esp32, and install it.
Select your board and port: Board: Navigate to Tools > Board > ESP32 Arduino and select "XIAO_ESP32C3". The list of board is a little long and you need to roll to the buttom to reach it. Port: Navigate to Tools > Port and select the serial port name of the connected XIAO ESP32C3. This is likely to be COM3 or higher (COM1 and COM2 are usually reserved for hardware serial ports).

Blink Code for Testing if Xiao is working well after soldering

int ledpin = D5;

// the setup function runs once when you press reset or power the board
void setup() {
  // initialize digital pin LED_BUILTIN as an output.
  pinMode(ledpin, OUTPUT);
}

// the loop function runs over and over again forever
void loop() {
  digitalWrite(ledpin, HIGH);  // turn the LED on (HIGH is the voltage level)
  delay(1000);                      // wait for a second
  digitalWrite(ledpin, LOW);   // turn the LED off by making the voltage LOW
  delay(1000);                      // wait for a second
}

Transistors¶

A transistor is an electronic switch or current amplifier. It controls how much current flows in a circuit based on a small signal at its base/gate. It’s not an input or an output, yet a middle component that helps the microcontroller. Within this week we deal with two transistors:

BJT Transistor¶

A BJT transistor is a semiconductor device that uses a small current at its base to control a larger current flowing between its collector and emitter, acting as an electronic switch or amplifier.

MOSFET Transistor¶

A MOSFET transistor is a voltage-controlled semiconductor device that uses an electric field at its gate to regulate current flow between its drain and source, making it ideal for fast switching and high-efficiency power control.

III. Class Experimentation¶

1. Soft Speaker with Arduino¶

Tools and Components used:¶

For this experiment are needed the following tools:

Building Process¶

Step by Step:

Building the Soft Speaker Process

Using the components and materials required, start creating ''Circuit A'' as shown in the images.
Arrange the conductive tape as shown and keep testing the connectivity with each step.
Apply insulation tape to avoid connectivity between the overlapping paths.
Arrange the components ( Resistor and Transistor ).
Solder the components on the conductive traces as shown ( Resistor and Transistor).
Build the coil.
Cut a continuous coil from conductive tape (have small space between the coil traces).
Connect the two ends of the coil to “Circuit A” by soldering wires from each coil end to the points labeled Speaker Lead 1 and Speaker Lead 2 on the conductive tape.
Connect the Speaker Circuit to Arduino Uno and check that it's well connected by running simple code.
Connect the Speaker Circuit to Power supply (3V maximum) to the points labeled Speaker Lead + and - on the conductive tape.
Run a melody code on Arduino and compile
Move the permanent magnet closer to the center of the coil and in round movement.

Arduino Code and Measures¶

Arduino Harry Potter Melody Code

int led_pin1 =2;
int led_pin2 =3;
int buzzer_pin = 11;
struct MusicStruct {  //generating tones
 int A = 550;
 int As = 582;
 int B = 617;
 int C = 654;
 int Cs = 693;
 int D = 734;
 int Ds = 777;
 int E = 824;
 int F = 873;
 int Fs = 925;
 int G = 980;
 int Gs = 1003;
 int A2 = 1100;
 int A2s = 1165;
 int B2 = 1234;
 int C3 = 1308;
 int C3s = 1385;
 int D3 = 1555;
}Music;
struct LengthStruct {
 float half = 0.5;
 float one = 1.0;
 float one_half = 1.5;
 float two = 2.0;
 float two_half = 2.5;
}Length;
int tempo = 400;
void setup() {
 pinMode(led_pin1, OUTPUT); // set led as output
 pinMode(led_pin2, OUTPUT);
 pinMode(buzzer_pin, OUTPUT);
 digitalWrite(led_pin1,HIGH); // and conditions for led
 delay(1000);
 digitalWrite(led_pin2,LOW);
 delay(1000);
 digitalWrite(led_pin2,HIGH);
 delay(1000);
 digitalWrite(led_pin1,LOW);
 delay(1000);
}
void setTone(int pin, int note, int duration) {
 tone(pin, note, duration);
 delay(duration);
 noTone(pin);
}
void loop() {  //putting the buzzer conditions
 setTone(buzzer_pin, Music.B, tempo * Length.one);
 setTone(buzzer_pin, Music.E, tempo * Length.one_half);
 setTone(buzzer_pin, Music.G, tempo * Length.half);
 setTone(buzzer_pin, Music.F, tempo * Length.one);
 setTone(buzzer_pin, Music.E, tempo * Length.two);
 setTone(buzzer_pin, Music.B2, tempo * Length.one);
 setTone(buzzer_pin, Music.A2, tempo * Length.two_half);
 setTone(buzzer_pin, Music.Fs, tempo * Length.two_half);
 setTone(buzzer_pin, Music.E, tempo * Length.one_half);
 setTone(buzzer_pin, Music.G, tempo * Length.half);
 setTone(buzzer_pin, Music.F, tempo * Length.one);
 setTone(buzzer_pin, Music.Ds, tempo * Length.two);
 setTone(buzzer_pin, Music.F, tempo * Length.one);
 setTone(buzzer_pin, Music.B, tempo * Length.two_half);
 delay(5000);
}

Result¶

Harry Potter Melody:

Observations and Result Notes

After building the green-sheet version of “Circuit A” and connecting it to the coil, it didn’t work due to poor trace connectivity. I rebuilt the circuit more carefully on an orange sheet (as shown in the video), checking each trace with a multimeter and ensuring proper continuity.
The Larger the magnet, the louder the volume.
The volume will be louder the closer the magnet is to the center of the coil, however avoid direct touch between the magnet and the coil to avoid burning.
The stiffness of the material affects the loudness.
The tighter the coil the louder.

2. Lighting Neopixel with Arduino¶

Tools and Components used:¶

For this experiment are needed the following tools:

Building Process¶

Lighting Neopixel with Arduino Process

Unplug the Arduino from USB while wiring.
On the NeoPixel strip, locate the pads labeled 5V, GND, and DIN (or “DI” / data in) on the input end (follow the arrow direction on the strip).
Connect Arduino 5V → strip 5V pad
Connect Arduino GND → strip GND pad
Choose a digital pin for data (e.g. D6). Connect Arduino D6 → strip DIN pad Optional but recommended: put a 330 Ω resistor in series with this data line.
Now plug the USB cable into the Arduino to power it.
Upload the specific code (e.g. using pin 6 and 10 pixels) and the strip should light up.

Arduino Code and Measures¶

Install needed libraries

Install the Adafruit Arduino Library

Open Arduino IDE.
Go to Library Manager
In the Library Manager search bar, type: “Adafruit NeoPixel”.
Find “Adafruit NeoPixel” by Adafruit in the list.
Click Install (choose latest version if it asks).
Wait for it to finish, then close the Library Manager.
To confirm, go to File → Examples → Adafruit NeoPixel – example sketches should appear.

Lighting the 10 Neopixel Strip in Green Code

#define PIN 6
#define N_LEDS 10 // Change this to the number of LEDs in your strip
Adafruit_NeoPixel strip = Adafruit_NeoPixel(N_LEDS, PIN, NEO_GRB + NEO_KHZ800);
void setup() {
strip.begin();
}void loop() {
 for(int i=0; i<strip.numPixels(); i++) {
 strip.setPixelColor(i, strip.Color(0, 255, 0)); // Green color
strip.show();
delay(250);
  strip.setPixelColor(i, strip.Color(0, 0, 0)); // Turn off
 }
}

Change the neopixel light color

You can change the light to any color by adjusting the RGB values in the following line of code:

strip.setPixelColor(i, strip.Color(0, 255, 0)); // Green color

For Example if I want to change the color to red it becomes:

strip.setPixelColor(i, strip.Color(255, 0, 0)); // Red color

Lighting the 10 Neopixel Strip in Rainbow Code

#include <Adafruit_NeoPixel.h>

#define LED_COUNT 6
#define LED_PIN    PIN_NEOPIXEL

Adafruit_NeoPixel strip(LED_COUNT, LED_PIN, NEO_GRB + NEO_KHZ800);

void setup() {
  strip.begin();
  strip.show();
  strip.setBrightness(50);
}


void loop() {
  rainbow(10);
}

void rainbow(int wait) {
  for(long firstPixelHue = 0; firstPixelHue < 5*65536; firstPixelHue += 256) {
    for(int i=0; i<strip.numPixels(); i++) { 
      int pixelHue = firstPixelHue + (i * 65536L / strip.numPixels());
      strip.setPixelColor(i, strip.gamma32(strip.ColorHSV(pixelHue)));
    }
    strip.show();
    delay(wait);
  }
}

Result¶

Lighting the 10 Neopixel Strip in Green:

Lighting the 10 Neopixel Strip in Rainbow:

Observations and Result Notes

When attaching alligator clips to the NeoPixel pads, avoid bridging two pads together and handle the connections gently, as the clips can disconnect with even slight movement.

3. Using LDR Sensor to control Neopixel with Arduino¶

Tools and Components used:¶

Building Process¶

Using LDR Sensor to control Neopixel with Arduino Process

Unplug Arduino from USB while wiring.
Wire the NeoPixel strip (use the INPUT end of the strip):
Arduino 5V → NeoPixel 5V pad.
Arduino GND → NeoPixel GND pad.
Arduino D6 → NeoPixel DIN/DI pad (data in).
Create the LDR voltage divider on the breadboard: Connect one leg of the LDR → 5V rail. Connect one leg of a fixed resistor (e.g. 10kΩ) → GND rail. Connect the other leg of the LDR and the other leg of the resistor together on the same row → this junction goes to Arduino A0 (sensor signal).
Make sure 5V and GND from Arduino are also connected to the breadboard’s power rails so the LDR circuit shares the same ground as the NeoPixel strip.
Plug in the USB cable, upload your Arduino code (using pin 6 for NeoPixel and A5 for LDR). The strip brightness/color can now be controlled by the light level on the LDR.

Arduino Code and Measures¶

LDR Sensor to control Neopixel with Arduino Code

Adafruit_NeoPixel strip(NUM_LEDS, LED_PIN, NEO_GRB + NEO_KHZ800);

void setup() {
  strip.begin();       // Initialize the LED strip
  strip.show();        // Turn off all LEDs initially
  Serial.begin(9600);  // For debugging the LDR readings
}

void loop() {
  int lightLevel = analogRead(LDR_PIN);  // Read the light level (0-1023)
  Serial.println(lightLevel);            // Print the value for debugging

  int threshold = 440; // Adjust this value based on your environment

  if (lightLevel > threshold) {
    // Room lights are ON, turn off LEDs
    for (int i = 0; i < NUM_LEDS; i++) {
      strip.setPixelColor(i, strip.Color(0, 0, 0)); // White light
    }
  } else {
    // Room lights are OFF, turn on LEDs
    for (int i = 0; i < NUM_LEDS; i++) {
      strip.setPixelColor(i, strip.Color(255, 0, 0, 50)); // On
    }
  }

  strip.show(); // Update LED strip
  delay(100);   // Small delay for stability
}

Result¶

Using LDR Sensor to control Neopixel with Arduino:

4. Using Ultrasonic Sensor (HC-SR04) to control Neopixel with Arduino¶

Tools and Components used:¶

Building Process¶

Using Ultrasonic Sensor (HC-SR04) to control Neopixel with Arduino Process

Unplug the Arduino from USB before wiring.
Wire the ultrasonic sensor (HC-SR04): Sensor VCC → connect to the + rail of the breadboard → this + rail is connected to Arduino 5V Sensor GND → connect to the breadboard – rail → this – rail is connected to Arduino GND Sensor TRIG → Arduino digital pin 11 Sensor ECHO → Arduino digital pin 12
Wire the NeoPixel strip (use the INPUT end): Arduino 5V → NeoPixel 5V pad Arduino GND → NeoPixel GND pad (same ground as sensor) Arduino D7 → NeoPixel DIN/DI pad (data in)
Plug in the USB cable → and upload the code.
Move your hand in a steady motion back and forth in front of the sensor and observe the change in the NeoPixel’s light color.

Arduino Code and Measures¶

lighting 10 strip NeoPixel according to hand movement with Ultrasonic Sensor (Hot Pink when far, Blue when near) Code

// by Simone
// Ultrasonic HC-SR04 + NeoPixel (Hot Pink when far, Blue when near)

#include <Adafruit_NeoPixel.h>

#define LED_PIN     6         // NeoPixel data pin
#define NUMPIXELS   10         // number of LEDs

int trigPin = 11;             // Trigger
int echoPin = 12;             // Echo
long duration, cm;

Adafruit_NeoPixel pixels(NUMPIXELS, LED_PIN, NEO_GRB + NEO_KHZ800);

void setup() {
  Serial.begin(9600);

  pinMode(trigPin, OUTPUT);
  pinMode(echoPin, INPUT);

  pixels.begin();
  pixels.show(); // turn all off
}

void loop() {

  // Trigger ultrasonic
  digitalWrite(trigPin, LOW);
  delayMicroseconds(5);
  digitalWrite(trigPin, HIGH);
  delayMicroseconds(10);
  digitalWrite(trigPin, LOW);

  // Read echo
  duration = pulseIn(echoPin, HIGH);

  // Convert time to cm
  cm = (duration / 2) / 29.1;

  Serial.print(cm);
  Serial.println(" cm");

  pixels.clear();

  // -----------------------------
  // LIGHT LOGIC
  // Near (<15 cm)  → BLUE
  // Far (>=15 cm) → HOT PINK
  // -----------------------------

  if (cm > 0 && cm < 15) {
    // BLUE
    for (int i = 0; i < NUMPIXELS; i++) {
      pixels.setPixelColor(i, pixels.Color(0, 0, 255));
    }
  } 
  else {
    // HOT PINK (R + some B)
    for (int i = 0; i < NUMPIXELS; i++) {
      pixels.setPixelColor(i, pixels.Color(255, 20, 147));  
      // 255,20,147 = hot pink / deep pink
    }
  }

  pixels.show();
  delay(100);
}

Result¶

Lighting 10 strip NeoPixel according to hand movement with Ultrasonic Sensor (Hot Pink when far, Blue when near):

5. Powering Motion Actuator (Servo Motor) with Arduino¶

Tools and Components used:¶

Building Process¶

Powering Motion Actuator (Servo Motor) with Arduino Process

Unplug the Arduino from USB before wiring.
Connect the servo’s red wire (VCC) to the 5V pin on the Arduino.
Connect the servo’s brown/black wire (GND) to one of the GND pins on the Arduino.
Connect the servo’s orange/yellow wire (signal) to digital pin 9 (~9) on the Arduino.
Plug the USB cable into the Arduino and upload the code.

Arduino Code and Measures¶

Powering Servo Motor with Arduino Code:

#include <Servo.h>

Servo servo;
int angle = 10;
void setup() {
servo.attach(8);
servo.write(angle);
}
void loop()
{
// scan from 0 to 180 degrees
for(angle = 10; angle < 180; angle++)
{
servo.write(angle);
delay(15);
}
// now scan back from 180 to 0 degrees
for(angle = 180; angle > 10; angle--)
{
servo.write(angle);
delay(15);
}
}

Result¶

Powering Motion Actuator (Servo Motor) with Arduino:

6. Using Sound Sensor to control LED with Arduino¶

Tools and Components used:¶

Building Process¶

Using Sound Sensor to control LED with Arduino Process

Unplug the Arduino before wiring.
Wire the sound sensor module: VCC (+) on the sensor → 5V on the Arduino. GND on the sensor → GND on the Arduino. A0 (analog out) on the sensor → 2 on the Arduino.
Wire the LED on the breadboard: Connect the short leg (cathode) row → GND on the Arduino. Connect one end of a 120-320 Ω resistor to the long leg (anode) row. Connect the other end of the resistor → digital pin 7 on the Arduino.
Plug in the USB cable, then upload the code.

Arduino Code and Measures¶

Sound Sensor to control LED with Arduino Arduino Code:

int sensor = 2; // Connected to digital output of KY-038 sound sensor module
int led = 7; // Connected to postive of led
boolean is_on = false; //To determine/track if led is on or off

void setup() {
  pinMode(sensor, INPUT); //Setting the pin to input for reading data
  pinMode(led, OUTPUT); //Setting the pin to output for turning the led on/off

}

void loop() {

  int data = digitalRead(sensor); //Reading data from sensor and storing in variable

  if (data == 1) { // 1 is sent from sensor when loud noise is detected
    if (is_on == true) { // If led is on then turn it off
      digitalWrite(led, LOW);
      is_on = false;
    }
    else { // else if led is off then turn it on
      digitalWrite(led, HIGH);
      is_on = true;
    }
  }
}

9. Wearables¶

I. Inspiration and References¶

II. Introdution to ''Wearables''¶

Actuators¶

Sensors¶

Microcontrollers¶

1. Arduino Uno¶

2. Seeed Studio XIAO (XIAO-ESP32-C3)¶

Set Up XIAO-ESP32-C3 in the Arduino IDE¶

Transistors¶

BJT Transistor¶

MOSFET Transistor¶

III. Class Experimentation¶

1. Soft Speaker with Arduino¶

Tools and Components used:¶

Building Process¶

Arduino Code and Measures¶

Result¶

2. Lighting Neopixel with Arduino¶

Tools and Components used:¶

Building Process¶

Arduino Code and Measures¶

Result¶

3. Using LDR Sensor to control Neopixel with Arduino¶

Tools and Components used:¶

Building Process¶

Arduino Code and Measures¶

Result¶

4. Using Ultrasonic Sensor (HC-SR04) to control Neopixel with Arduino¶

Tools and Components used:¶

Building Process¶

Arduino Code and Measures¶

Result¶

5. Powering Motion Actuator (Servo Motor) with Arduino¶

Tools and Components used:¶

Building Process¶

Arduino Code and Measures¶

Result¶

6. Using Sound Sensor to control LED with Arduino¶

Tools and Components used:¶

Building Process¶

Arduino Code and Measures¶

Result¶

IV. Week Project (Time in a bottle)¶

Tools¶

Fabrication files¶