ICM Final Wk 10-11: Progress

This is an update on the progress I’ve made thus far on the schematic and website of the solar project.

1.) First things first was to just quickly mockup in Illustrator and Sketch what I wanted the design to look like. I tackled it in Illustrator initially since I’m faster there and because it is somewhat difficult to illustrate shapes in Sketch. Then I copy and pasted the vector shapes into Sketch to be able to get the exact coordinates. Small design changes were made to help me be more accurate.

sketches for websiteScreenshot 2018-11-18 19.28.40

2.) My next important step was to make a list of to do items to tackle for the weekend.


3.) I then got to work on my first step: drawing the solar cell schematic. Using the coordinates off of sketch I was able to have a rough estimate of where to put the shapes based on the canvas size of a tablet (1024 x 768 px). Some coordinates for the shape were still unknown so I still needed to calculate and map them out.

map of drawing's coordinates

4.) I decided to work on Atom this time, because I wanted to get comfortable with using a text editor and being able to connect to the site through the local host. I also added text for the coordinates as a guide to help me with drawing. See below for sketch.

Screenshot 2018-11-18 19.27.33

5.) I also tried to center the drawing on the canvas using this positioning your canvas code I found: https://github.com/processing/p5.js/wiki/Positioning-your-canvas. I also used beginShape(), endShape() so that in case I need to move or scale the schematic I could easily do so even though I hard coded coordinates.

6.) After finishing the drawing, I tried to make the animated waves for the photons coming from the sun. I did this in a separate sketch file. I refracted the code from a codepen piece: https://codepen.io/xhepigerta/pen/EWZMLE

7.) I made a separate sketch just to get an animated moving arrow: https://editor.p5js.org/elinsterz/full/SJvNQTJC7

Here it is combined: https://editor.p5js.org/elinsterz/full/Hyu3g0yAX 

7.) A separate sketch for the part where the electron moves through the circuit: https://editor.p5js.org/elinsterz/sketches/rkecEHER7

8.) A separate sketch for the part of the animation that requires the electrons (placed in different locations) to travel to the beginning of the circuit that is on the front contact. I just focused on the code for “tweening”, since I would need to change the start and stop coordinates once I combine the sketch.

Code: https://editor.p5js.org/elinsterz/sketches/HyS4EEIRm 

9.) Now that all the animation elements are in their own sketch files, it is time to combine them all into one code. In order to have my code be easier to manage, I transferred the files onto Atom and am coding from there now.

I first created a class for the photon, the electron, the sun, and the cell drawing. the electron class has multiple functions, such as tweening, generate and circuit.

Then, I strung the sequences together in the “sketch.js” file using boolean statements that trigger a bunch of if statements.


10.) The hard next step was trying to get the animation to loop through after one round. I had to reset the variables and have the boolean statement return back to true. Below is the result of that:

11.) Next, is trying to create a slider version that will loop. This requires a lot of revisiting classes and trying to read where the photon position lands in order to generate the electron hole pairs. The struggle is currently still continuing, but so far I have the slider generating more photons. Next step is having each photon that is generated also create an electron hole pair that loops through the circuit.

PCM Final Wk 11: Playtest, Revisions, Prototype


My first play test for the solar interactive was extremely helpful. Since I last blogged, the idea has changed from using the polarizing filters within the box format to having a rotating light source that users could interact with. Below is a video of what I had play tested (minus the flashlight and screen).



The play test in class on Wednesday, 11/13/2018, was very helpful. The biggest takeaways were:

  1. Everyone pressed the battery button first. This was not the intention. I need to make it more clear that the button is for backup storage. Perhaps the battery will light up when there is no light. One user suggested that he would like to see the battery being charged when there is light shining on the house; this I think was a good suggestion.
  2. Users felt a disconnect between the screen + model. People often focused fully on either the house or the screen. There has to be a good enough reason for people to look at the screen, so have more connection between the two or add more info.
  3. Users liked the idea of having the moveable light source be on a track, they all agreed it would be more fun.
  4. A few users mentioned that they would like to see a # that tells them how much energy is being generated from the solar panels.

After the play test, I immediately focused on redesigning the interactive so it would be: 1.) Making the battery interactive less important and a secondary element, 2.) Connecting the screen with the house, 3.) prototyping the light on a track or handle idea and connecting it with time of day.

Below are a few sketches that try to solve for these issues:


After creating many sketches of the model I wanted, I focused on creating a working prototype. I was especially looking forward to prototyping the handle, because that was the hardest part for me to visualize in my head. Below are some process photos.



Below is a look at how the handle was put together. I placed the lock washer and washer on both ends of the bolt. I had to tighten the nut a lot in order for the handle to stay in place when my hand wasn’t holding it.


I am thinking that the lamp could be made of LED strips. On making this handle and trying to understand how to make the lamp, I used this video as a resource (also, how cool is Darbin?!) : https://www.youtube.com/watch?v=XHeJn1Hnfh0

However, my version has less arms and rotates on y axis, not z or x. I also intend for mine to be in a circular shape. Like her, I will also use plexiglass with magnets as a way to protect the LED lights, and I will use the eyelet hooks as a way to string the wire along the handle.

After assembling it all together, I tried play testing again on Monday (11/19/18). Here’s how it went:



This was helpful, but I do think it would’ve been more informative if I had a working version of the screen. Currently, making moves on the ICM front as well. Much more to do!


Fab Wk 3: Laser Cutting

For this week’s project to work with the laser cutter, I used laser cut acrylic and LED strips to create a light box. I jumped around between several ideas, but eventually landed on the idea of doing animal shaped night light/ light box.

Final result:


final hedhego


  1. First was sketching out the animals on illustrator. I tried to keep the style simple and graphic. I played around with the idea of making an oil diffuser with these wooden laser cut leaves in a jar, which is why there is a leaf on the side. Eventually that idea was dumped. The blue are the small marks for the engraving. I thought it’d be nice to add some minimal lines and textures.

Screenshot 2018-11-15 11.56.11

2. Then I laser cut a cardboard prototype of the animal (just to be safe).


3. Next was making the laser cut acrylic version.

acrylic laser cut

4.) Then I measured and calculated the dimensions for the lightbox using Illustrator.

5.) I laser cut the box using 1/8″ wood. Then I soldered my LED strip to the adaptor cable and attached it to the wood base.


6.) Last part was assembling it all together and making sure the light works. And it did!

This slideshow requires JavaScript.

PCM + ICM Final Wk 10: Proposal, Prototype, Production, Process

Updates on Week 10
a.) Project Proposal
b.) Schematic Diagram
c.) Diagrams for Production
d.) Timeline + Bill of Materials
e.) Prototypes
f.) Analog Input
g.) Web Design


a.) Proposal Presentation:

This proposal pdf was put together for ICM, but serves as a helpful guide of the project’s why, what, for who, and how.

Solar_Proposal_Presentation_20181113 EL2


b.) Schematic Diagram:


c.) Diagrams for Production

diagram display20181112_display_diagram_v2_frontdiagramThe below image is the original diagram drawn for the version of the house with a lamp and fan. This plan has changed. See new diagram below.


d.) Timeline + Bill of Materials: https://docs.google.com/spreadsheets/d/1zA4OJrYoYLFRfl6XcdlWMDRCV-Dq8sbgWobO5o2G_kc/edit#gid=0

Screenshot 2018-11-12 15.48.58

timeline and tasks

Screenshot 2018-11-12 15.49.10

bill of materials



e.) Prototype:

Initial cardboard prototype to better understand the scale, proportions and positioning. The house is missing from this because I realized that the house would need to hide the wires of the fan and lamp as well as the Arduino.  I found a ball bearing at Canal Plastics that I thought would work great for the polarizing filters.

cardboard prototype

Here are some process photos, which include the sketches with rough dimensions.


Prototype of the house:

Knowing what to do with the house has been tricky. I did this wooden prototype but felt that it was too tall. I did a cardboard version that had an attic and an extra bottom layer so that I could hide the motor and the arduino and lamp. What I don’t like about both designs is how much shadow is created by the roof. The lamp and fan will be barely visible when seen from above. See images below.


So after doing these prototype houses I decided to switch the design of the house so that it will not have the front open. Instead, there will only be windows that will dim or light up depending on the reading from the sensor. This change was also partially influenced by this inspirational piece below. This simply and beautifully communicates the idea.



f.) Analog Input with Light + Solar Panel:

First was following along analog input to serial lab again in order to have the p5js sketch communicate with the serial connector and arduino. Below is the video for that


Below is the video and arduino code that reads the analog input from the solar panel and writes analog write (PWM) to have the LED light correspond to the sensor reading.


p5js code: https://editor.p5js.org/elinsterz/sketches/ryirTRP6Q

Arduino code:

“void setup() {

void loop() {
int solar = analogRead(A1);
int mapSolar = map (solar, 0, 1023, 1, 255);
Serial.write(mapSolar); //translates to binary

analogWrite(9, mapSolar);



h.) Web Design

Rough look and feel of the diagram and site is below. Steps will be revealed when the user hovers over the number icon. The motion of: photon —> electron-hole pairs –> traveling through circuit –> reunite at the rear will still continue and be dependent on how much light is showing through.

rough skin design

Fab Wk 2: Modular

For this week’s assignment to make 5 identical objects, I decided to make hexagon ping pong paddles! The final result is below.





Originally, I was planning to do five bird houses, and even got so far as doing 1 birdhouse. See image below.


I was not happy with the end result of the first birdhouse, so immediately switched to my more feasible plan B.

For the ping pong paddles, I decided to make them hexagonal because: a.) it’d be fun to make “designer-y” ping pong paddles that weren’t the typical oval shape, b.) I am not yet skilled or comfortable enough to do perfectly symmetrical rounded shapes. With that in mind, I began!

1.) Draw a template for myself in illustrator. The sizes were based on an online template I found. However, that version was much more curvy and made for a CNC router. I just needed the dimensions.

Screenshot 2018-11-09 10.59.16

2.) Then, I printed the paper out, traced it on the wood and began cutting the overall shape and the rectangular handles individually. I used the bandsaw to cut because the wood I got (1/8″ plywood is very soft). When I used it on the chop saw, too much of the wood would disappear.


3.) I then cut the handles and created an angle using the sand blaster. I tried to create the same angle for the handles by sticking an angled piece of tape to the machine. See image below. Not sure if there was a better way to do this (there probably is).



4.) I went to Canal Rubbers (amazing store, btw!) to get some rubber for the ping pong paddles. It’s so great over there! They have so many choices, tons of colors, and knowledgeable people working there. After my trip there, I started to cut and glue the rubber to the ping pong paddles. I first traced the ping pong paddle onto the back of the rubber. Then I used rubber cement to glue to stick the cutouts onto the wood.

It was so fun to do stripes and different colorful designs for it.



5.) After gluing the rubber, I stuck the 2 handles to the sides using wood glue. I taped it together to have it dry nicely. In hindsight I should have clamped it down.

6.) Then I sanded  the handles. Some of them I used the sand blaster to sand, which I now think was not the smartest thing for me to do because it made a weird groove when I sanded too much. So, I then hand sanded it to create a nice smooth paddle. Below is the result.


PCM Wk 9 Final: System Plan, Timeline, Materials

Solar Energy Learning Table


I aim to create an interactive learning table that explains how solar panels work and how energy is converted into electricity.

Specific Points to Communicate:

Main objective: Learn about the science of solar cells and how it can impact our lives if we incorporate it into our lifestyle.

1.) Science of solar cells: how light is turned into electrical energy through the use of semiconductors.

2.) Prove that solar energy can impact our lives by symbolically showing how much energy a rooftop solar panel will generate for a small size house.

3.) Show the effect of light on solar cells by altering the intensity of light through polarizing  filters and rotation of light. Show schematic of what happens scientifically when light hits the cell.

4.) Provide a thought experiment: what if the sun were red, green, blue, purple? Which color would give the most or least amount of energy?

5.) Show the way battery storage works and how solar panels can still run even when there is not sun. This will be achieved by having a battery icon that users can select to power the house even when there is no light that shines.


solar display diagram


b.) Timeline:

Week 9 (10/31/18 – 11/07/18):
–  continue user interviews, gathering info, and experimenting (PCM)
–  run light + filter experiments (PCM)
–  finalize content (what I want to communicate) (ICM)

Week 10 (11/7/18 – 11/14/18):
–  build the circuit and connect with p5js sketch(PCM)
–  prototype fabrication of display (PCM)
–  finalize idea and design of display (PCM)
–  finalize content, design and UI of website (ICM)

Week 11 (11/14/18 – 11/21/18): 
– combine fabrication, circuit and website (PCM)
– continue fabrication (PCM)
– continue programming the website (ICM)

Week 12 (11/21/18 – 11/28/18): 
– combine final components – finish! (PCM)
– finish the website (ICM)

Week 13 (11/28/18 – 12/05/18):
– final
– user testing
– tweaks based on user testing

Week 14 (12/05/18 – 12/12/18):
– final final
– documentation



c.) Materials:
(More details will be added)

  • cardboard for prototyping
  • wood (still need to figure out which kind)
  • polarizing filters
  • color filters
  • white LED light source
  • 2 or 4 solar panels
  • led light (for lamp inside house)
  • dc motor (for fan inside house)
  • iPad


PCM Wk 9 Final: Light + Filter Experiments

Experimenting with Lights and Filters

1.) First we prepared our equipments, filters and notes. Equipments include: a laser pointer, an LED flashlight, polarizing filters, solar panels, color filters.

This slideshow requires JavaScript.

2.) Next was experimenting with the polarizing filters to manipulate the amount of light that passes through. Polarizing filters may give us more range than neutral density filters, but this can’t be determined until the neutral density filters are tested. See video below.


3.) Using a multimeter we tested how much voltage was being generated by the solar panel under different lighting conditions (with and without color filters).

a. Solar panel under normal room lighting and under white LED light

b. Solar panel under white LED light with different colored filters, starting from the colors with larger wavelengths to shorter wavelengths (red, yellow, green, blue, purple). The yellow and the blue turned out to be generating the most voltage.

This slideshow requires JavaScript.

4.) Following the same procedure as above, we tested the amount of current that was being generated by the solar cells.

a. Solar panel under normal room lighting + white LED light

b. Solar panel under white LED light with different colored filters, starting from the colors with larger wavelengths to shorter wavelengths (red, yellow, green, blue, purple).

This slideshow requires JavaScript.

What we discovered: the color filters block out some of the light. The yellow filter blocks out the least amount of light. The red is the largest wavelength so its frequency is the lowest. This information correlates with the amount of energy that it generates.

f.) Using analog read, we were able to find out and translate the solar panel’s energy with ASCII.

Screenshot 2018-11-06 01.20.28

analog read screenshot


circuit for connecting solar panel to analog pin

Here is the code that mapped the sensor value from 30 – 400 to 0-1023, so we could get a more accurate reading.

“// Analog Input from LED Light to Silicon Solar Panel

int mapThis;

void setup() {

void loop() {
int sensorValue = analogRead(A0);

//to have a wider range and higher sensitivity
// map 400 (our potentially highest reading) to 1023
mapThis = map(sensorValue, 30, 400, 0, 1023);

//prints out ASCII

*** Next steps are to connect the readings to a p5js sketch so there is a visual to help illustrate the readings, do the Synchronous Serial Communication lab, and use the flux sensor. To be updated by soon.


*** Full disclosure: for my research and experiments with solar energy and light, I am learning from and collaborating with Dr. Sardashti (Kasra), a material scientist and applied physicist, whose has done research on solar cells.



To do list for this week (10/31/18 – 11/6/18): 
a.) figuring out what to communicate (user interviews)
b.) gaining inspiration from a math or science museum
c.) researching + experimenting with different light conditions + filters
d.) doing the synchronous serial communication lab
e.) drawing a new diagram of the interactive table
f.) building a prototype house (also for fabrication)
g.) creating a timeline/ game plan / materials list
h.) meeting with experts, itp professors, and residents in this field