9. Wearables¶
Research¶
Photo from ELE Times
Wearables are technologies designed to be worn on or near the body that integrate electronics, sensors, and digital systems to support interaction, monitoring, communication, or expression. In fashion and textile contexts, wearables often take the form of garments, accessories, or body-adjacent materials that combine traditional textiles with soft electronics, conductive materials, and embedded systems. Designers and researchers use wearables to explore areas such as health monitoring, movement tracking, performance enhancement, and interactive or expressive design. Beyond functionality, wearables also raise important questions about comfort, identity, ethics, and embodiment, encouraging designers to think critically about how technology can be integrated into everyday life in ways that are human-centered, culturally meaningful, and responsive to the body.
References & Inspiration¶
Adidas x Google
Adidas x Google Jacquard is a collaboration that demonstrates how computational textiles can be embedded seamlessly into everyday sportswear. Using Google’s Jacquard technology, conductive yarns are woven directly into the fabric of a jacket sleeve, turning the textile itself into a touch-sensitive interface. Rather than adding visible hardware, the technology remains soft, flexible, and wearable, preserving comfort and aesthetics. The Jacquard sleeve allows users especially cyclists and urban commuters to control music, navigation, and phone functions through simple gestures such as tapping or swiping the fabric. This approach shifts wearable technology away from screens and buttons, emphasizing gesture-based interaction and intuitive use. The project highlights how wearables can enhance performance and safety while remaining unobtrusive. As an example of applied wearable design, Adidas x Google Jacquard bridges fashion, athletics, and human–computer interaction, showing how textiles can function as active interfaces. It serves as a key inspiration for computational couture and e-textiles by proving that smart garments can be scalable, functional, and integrated into real-world use.
Ying Gao
Ying Gao is a Montréal-based fashion designer and researcher whose work focuses on interactive, responsive garments that react to human presence, gaze, sound, and movement rather than direct touch. Her practice sits at the intersection of fashion, technology, philosophy, and performance, using wearables to question how the body communicates with its environment. Unlike many wearable designers who emphasize screens or LEDs, Gao’s garments often rely on subtle mechanical movement, such as unfolding, vibrating, inflating, or shifting surfaces. Using sensors, microcontrollers, and soft actuation, her designs respond when a viewer looks at the garment or speaks near it making the act of observation part of the interaction. This creates a quiet but powerful form of responsiveness that challenges traditional ideas of fashion as static or purely decorative. Gao frequently collaborates with engineers, programmers, and sound artists, and her work is deeply influenced by research and critical theory. Rather than designing for mass production, she treats wearables as experimental interfaces, exploring themes of intimacy, surveillance, perception, and emotional response. Her projects blur boundaries between clothing, installation, and living system.
Photo from yinggao.ca
Tools¶
- Arduino IDE
- Lilypad Protosnap
- Elegoo Uno R3
Create 2 actuator swatches
The two actuator swatches were the servo motor and led light show where each demonstrating different forms of responsive movement and interaction within e-textiles.
The servo motor swatch focused on controlled mechanical movement. By programming the servo to rotate at specific angles, the swatch simulated motion that could be translated into wearable applications—such as lifting, opening, or shifting elements within a textile piece. This has strong potential for my wig project, where subtle movements could mimic the natural flow or repositioning of hair, adding a dynamic, lifelike quality to the design.
The LED light show swatch emphasized visual responsiveness and storytelling. Through programmed light sequences, the LEDs created patterns that could communicate mood, rhythm, or identity. In the context of Afrocentric wig design, this could be used to highlight cultural symbolism, enhance performance aesthetics, or represent emotional expression through color and timing.
Together, these actuator swatches demonstrate how motion (servo) and illumination (LEDs) can transform textiles from static objects into interactive, expressive systems.
Servo motor
Schematic
Using the Arduino IDE with an Elegoo UNO R3 to control a servo motor involves setting up a simple hardware connection and uploading a sketch that sends position commands to the servo. First, the servo is wired to the UNO R3: the red wire connects to 5V, the brown or black wire to GND, and the yellow/orange signal wire to a digital PWM pin (commonly pin 9). This allows the microcontroller to send control pulses that determine the servo’s angle. In the Arduino IDE, the Servo library is used to simplify control. After selecting Board → Arduino Uno and the correct Port, a sketch is written that attaches the servo to the chosen pin and sets its position using degree values (0–180). When the code is uploaded, the servo responds by rotating to the specified angles. This process demonstrates how the Arduino IDE translates simple code into physical movement, reinforcing core concepts such as library usage, pin assignment, and PWM-based control. It serves as an essential foundation for projects involving motion, robotics, and interactive systems.
A servo motor can be controlled using the Elegoo UNO R3 and the Arduino IDE by sending precise position commands through a digital PWM pin. This setup is commonly used in robotics, kinetic design, and interactive systems where controlled movement is required.
The servo has three connections: • Red → 5V (power) • Brown/Black → GND • Yellow/Orange → Digital PWM pin (commonly pin 9)
In the Arduino IDE, the built-in Servo library is used to manage timing and pulse signals automatically. After selecting Board: Arduino Uno and the correct Port, the code is uploaded to the board. The servo is then instructed to rotate to specific angles between 0° and 180°.
Basic Servo Sweep Code (Arduino IDE)
Servo myServo; // Create servo object
int servoPin = 9;
void setup() {
myServo.attach(servoPin); // Attach servo to pin 9
}
void loop() {
myServo.write(0); // Move to 0 degrees
delay(1000);
myServo.write(90); // Move to 90 degrees
delay(1000);
myServo.write(180); // Move to 180 degrees
delay(1000);
}
leds
LED Light Show
Schematic
Arduino UNO 74HC595
--------- ---------
5V ---------------------- 16 (VCC)
GND ---------------------- 8 (GND)
D12 (dataPin) ----------- 14 (DS / SER)
D9 (clockPin) ----------- 11 (SH_CP / SRCLK)
D11 (latchPin) ----------- 12 (ST_CP / RCLK)
5V ---------------------- 10 (MR / SRCLR) [keep HIGH]
GND ---------------------- 13 (OE) [keep LOW]
Outputs to LEDs:
15 (Q0) -> 220Ω -> LED -> GND
1 (Q1) -> 220Ω -> LED -> GND
2 (Q2) -> 220Ω -> LED -> GND
3 (Q3) -> 220Ω -> LED -> GND
4 (Q4) -> 220Ω -> LED -> GND
5 (Q5) -> 220Ω -> LED -> GND
6 (Q6) -> 220Ω -> LED -> GND
7 (Q7) -> 220Ω -> LED -> GND
The first image documents the materials stage: an Elegoo Uno R3 microcontroller, breadboard, USB cable, resistors, jumper wires, and a mixed LED kit. This is the preparation phase where all components are organized before building the circuit. The second image shows the assembled circuit. Multiple LEDs are wired in a row on the breadboard, each connected through resistors and jumper wires to the Arduino. The board is powered via USB and appears to be running a test program, likely for LED sequencing or blinking. This setup demonstrates basic circuit principles: power distribution, grounding, resistor protection for LEDs, and digital output control from the microcontroller. Overall, the photos capture the transition from component layout to a functioning prototype, illustrating foundational skills in Arduino wiring, breadboarding, and LED control.
LED Light Show Code (Arduino IDE)
//www.elegoo.com
//2016.12.9
int tDelay = 100;
int latchPin = 11; // (11) ST_CP [RCK] on 74HC595
int clockPin = 9; // (9) SH_CP [SCK] on 74HC595
int dataPin = 12; // (12) DS [S1] on 74HC595
byte leds = 0;
/* The most common method of using 74CH595
* lctchPin->LOW : Begin transmitting signals.
* shiftOut(dataPin, clockPin, bitOrder, value)
* dataPin: the pin on which to output each bit. Allowed data types: int.
* clockPin: the pin to toggle once the dataPin has been set to the correct value. Allowed data types: int.
* bitOrder: which order to shift out the bits; either MSBFIRST or LSBFIRST. (Most Significant Bit First, or, Least Significant Bit First).
* value: the data to shift out. Allowed data types: byte.
* lctchPin->HIch : The end of the transmission signal.
*/
void updateShiftRegister()
{
digitalWrite(latchPin, LOW);
shiftOut(dataPin, clockPin, LSBFIRST, leds);
digitalWrite(latchPin, HIGH);
}
void setup()
{
pinMode(latchPin, OUTPUT);
pinMode(dataPin, OUTPUT);
pinMode(clockPin, OUTPUT);
}
void loop()
{
//Turn off all led
leds = 0;
updateShiftRegister();
delay(tDelay);
//Create a for loop:i 0 through 7 have gradually increased
for (int i = 0; i < 8; i++)
{
//turn on the led with the i transform
bitSet(leds, i);
updateShiftRegister();
delay(tDelay);
}
}
Results¶
My sketches are ...
This hand-drawn sketch represents the initial concept for a soft, wearable plush swatch designed to integrate basic electronics within a textile form. The character-based silhouette establishes both the aesthetic identity and the functional layout of the piece. Facial features (eyes and nose) define the front-facing interaction area, while the lower central section is reserved for electronic components. The sketch includes labeled positions for the LilyPad ProtoSnap Plus RGB LED pins (6, A7, A8), indicating early planning for color-based light output and circuit routing. This placement reflects intentional separation between expressive elements (face) and technical elements (electronics), supporting clarity and accessibility during fabrication.
Test Code¶
The Arduino IDE Blink test was used to verify basic functionality of the LilyPad ProtoSnap Plus before integrating it into a soft electronic swatch. The test confirms that the board is properly powered, recognized by the Arduino IDE, and capable of running uploaded code. Using the Arduino IDE, the LilyPad Arduino USB board was selected along with the correct serial port. A simple Blink sketch was uploaded to the ProtoSnap, targeting the onboard green LED (pin A7). The program turns the LED on and off at timed intervals, creating a visible blinking pattern. When the LED blinked successfully, it confirmed: • Correct board and port selection • Successful code compilation and upload • Proper power delivery and microcontroller operation • Functional LED output pin
The example of the blink code is below.
// LilyPad ProtoSnap Plus - Blink Test
void setup() {
pinMode(A7, OUTPUT);
}
void loop() {
digitalWrite(A7, HIGH); // LED ON
delay(1000); // wait 1 second
digitalWrite(A7, LOW); // LED OFF
delay(1000); // wait 1 second
}
Results¶
Code
The Color Mixing Lamp project was used to explore how the Arduino IDE and LilyPad ProtoSnap Plus can control multiple outputs to create interactive visual effects. In this project, the onboard RGB LEDs on the ProtoSnap (red, green, and blue channels) were programmed to mix colors by varying their brightness levels. Using the Arduino IDE, each LED channel was assigned to a specific pin on the ProtoSnap (typically R = pin 6, G = A7, B = A8). The sketch uses PWM (Pulse Width Modulation) with analogWrite() to control the intensity of each color. By adjusting the brightness values of red, green, and blue, different colors—such as purple, cyan, yellow, and white—are produced. This project demonstrates key concepts in wearable electronics and physical computing, including: • How RGB color mixing works using additive light • Using multiple outputs from a microcontroller • Applying PWM to smoothly control LED brightness • Translating digital code into visual, interactive feedback
The example of the color mixing lamp code is below...
int ledPins[] = {5, 6, 9, 10, 11, A7};
void setup() {
for (int i = 0; i < 6; i++) {
pinMode(ledPins[i], OUTPUT);
}
}
void loop() {
for (int i = 0; i < 6; i++) {
digitalWrite(ledPins[i], HIGH);
delay(400);
digitalWrite(ledPins[i], LOW);
delay(200);
}
}
