Latest game plan: Keep going as though I will be showing it at Sims by the end of summer or whenever the Coronavirus storm blows over. Get the website part ready for user testing. Build some mockup form of the 2nd kiosk with the ideal interaction. If there is a little time, build an index/ bibliography/ resource website for the diagrams made and references used.
Some updates: a.) Animation for how copper is made, b.) Diagram the full elements in a chrome book, c.) Fabricate the box for the component and RFID reader, d.) Integrate physical computing elements with the fabricated kiosk, e.) Print graphics for kiosk
a.) Animation for how copper is made: wow, this took quite a while to put together. The longest part was researching and figuring out what parts of the process I should include. There are really so many intricate steps to how copper is mined and manufactured. Not only steps, but also many different types. The animation I ended up making is only one way to mine + manufacture copper.
First was researching and writing a script.

Next was storyboarding the script.
Then I drew the animation scenes in Illustrator.

I also recorded myself narrating the script, then I used After Effects to animate the storyboard.

Latest video render: https://youtu.be/_tZeJJnpP0Q
Helpful feedback from Sarah: more pauses between the steps, too fast, add some questions (maybe even a slide with black text), add sound design, more relatable references to make it feel less textbook-like.
b.) Diagram the full elements in a chrome book. From the cooling system research, I realized it took me a long time to figure out what elements made up the cooling system. It took forever because I was reading many different sources and unsure of which source to “believe” or go with. It’s hard for a non-expert to tell what is right/wrong information on the net. So, I asked my partner Kasra, who is a material scientist, to help with diagramming and fact checking what elements go into the Chromebook. This process is definitely more accurate and well-researched then if I were to do it myself. So biggest thank you to Kasra, who is the always the best research scientist to collaborate with 🙂

c.) Fabricate the box for the component and RFID reader
I didn’t fabricate the boxes that the components are on…should’ve done it before the shop and school closed. I ended up making the boxes at home. It worked out though it is a a bit harder to fabricate in my apartment. Thank you Professor Ben Light for letting me borrow the shops’ clamps and some tools-promise to return.

d.) Integrate physical computing elements with the fabricated kiosk
In order to sync up all the physical computing elements with the kiosk, I needed to drill holes for the screen’s cables to be passed through. I also needed to drill holes in the frame for the wires of the RFID reader to be passed through. I also had to test the old touch screen and the code worked with the school’s Windows laptop to double check it worked.
d.) Design and print the vinyl
Designed a few graphics then printed it out to see what would be the best version.
Notes for self:
Steps for RFID Reader setup:
- Run Arduino code
- open p5 serial port. make sure correct port is selected. test console log works.
- open website code with serial port script.
Resources:
- https://html5multimedia.com/
- https://www.freecodecamp.org/news/video-audio-in-html-a-short-guide-69f721878b47/
- http://iandevlin.github.io/mdn/video-player-styled/
- https://freefrontend.com/css-flowcharts/
- https://codepen.io/blackjacques/pen/bgamaj
- https://www.adobe.com/devnet/archive/html5/articles/html5-multimedia-pt3.html
- https://www.codespeedy.com/play-pause-button-for-html5-video-in-javascript/