Final project, say what?!

I have been stirring around a few crazy ideas that I am unsure are possible, but I’m going to be positive and say any of them are.

Ideas I want to explore: I would like to focus on self-perception, self-empowerment, and possibly superheroes.

Pep talk (self-perception/self-empowerment)

The idea for Pep Talk is influenced every day life at ITP. It’s a constant battle of highs and lows. I’ve personally never worked around and with such incredibly creative, self-motivated, helpful, and interesting people. It’s amazing to see what people create, or even consider creating. Even with that said, we have no real insight in how someone is feeling about their experience. Sure, they may have created an incredibly visually stimulating ICM sketch, but they could have imagined creating something with a few more bells and whistles. They could easily being feel very proud of their work, or they could be feeling very disappointed. We all entered ITP at different levels with different outcome expectations, but we are all here and blended in the same or similar courses.

Through Pep Talk, I would like to explore giving people pep talks when they’re feeling down. How would this be done? I was thinking this could be done through face recognition. The screen would examine a person’s facial expression, and then based on that trigger a box to print out a personal pep talk that was recorded by an actual ITP alum, resident, professor, or student. This would allow someone who is more timid to feel more connected and understand they aren’t feeling the same way.

Super cape (self-empowerment/superhero)

Super cape would be an exploration in wearable technology with the purpose of empowering children to feel like superheroes, but also to make adults feel okay to act like children.

Combining with ICM: I am working on a story concept that would be a game-like experience, in which the child discovers their superpower. The cape could help a user navigate, interact, and ultimately create the story based on their movements with the cape. The cape could have FSRs sewn in the sides, so when they are grabbed it triggers something in the story.

Other ideas: What if the cape solved math equations by movement? And as the user solved more equations, they would increase their ability to fly.

Here are sketches of the cape:


FullSizeRender 16

I am talking to Kate, the wearables expert tomorrow to learn more about wearables and what sensors would make sense for this idea.


Here comes the sound and video

Screen Shot 2015-10-28 at 10.55.17 AM

I had so much fun making my sketch this week. I think it was a combination of getting more comfortable with code and making something that tells more of a story. I decided to go with something a bit silly and just have fun with the process. I worked with sound and focused on volume thresholds. The idea was based on a longer project idea I was considering that helps someone understand their own volume and tone. Often when we speak about something that we are passionate about, we tend to get louder. Sometimes this volume change is misinterpreted. I think it’s especially difficult to perceive volume and tone when you’re speaking in your non-native language. Even as an American from an incredibly loud family, I tend to shut down when other people’s volume increases. I have a difficult time communicating when both parties are yelling. However, I am sure that my volume also increases or changes in a discussion, debate, etc, which I can be unaware of in the moment.

If you’ve ever had a conversation that involved the statement, “I’m not yelling, you’re yelling” or even in a situation where you find both parties, or even one accusing the other of yelling. To deal with this issue, I thought of visualizing volume and eventually tone. To begin with this assignment I just focused on volume and decided to make it more playful.

To start I got comfortable with working with thresholds. I made a simple sketch that shows increase of volume with different shapes and colors. Once the highest threshold is hit, particles are triggered to move randomly across the sketch. It also shows how many particles are moving across the screen, as more are added as the volume continuously increases.

Screen Shot 2015-10-28 at 11.13.18 AM

With this basic idea, I decided on how I would tell a story using this visualization. My objective is that you must help the flowers by giving them more a sun and in turn more flowers will grow. Here, when the highest threshold is hit, two things happen: the sun appears and continuously gives more light to the flowers and the song “Here Comes the Sun” is triggered to play.

Screen Shot 2015-10-28 at 10.55.26 AM

Posted in ICM

Pen light

FullSizeRender 15



My idea for the flashlight assignment was to create a pen that lights up. Overall, the experience was very positive, as it allowed me to apply what we have learned in Physical Computing. It was a nice to use that knowledge, or the lack there of, and explore more.


  • pen
  • 3 volt battery
  • push button/toggle switch
  • wires
  • solder
  • LED button
  • tape


Opposite flashlight

This is the first prototype I made. Although I liked somewhat goofy look to this version, I was using a push button that did the opposite what I wanted. The electricity from the battery was flowing straight to the LED, meaning that the when the wires were connected, the LED would turn on. When you push the button, the LED would turn off.

This was actually my first time soldering. When trying to explore other options to fix the backwards flashlight, my soldering job didn’t stand the test of force. I accidentally pulled one of the legs of the button and broke it off.  Luckily, someone near me overheard me dilemma and showed me better ways to solder more efficiently.

After discussing it with someone working next to me, we thought that a toggle switch would solve my issue of having my flashlight working like it should. I was able to get a toggle switch. After a few attempts, a lot of careful soldering, a lot of tape, and 6 hours, I was able to attach everything to pen and finalize my pen flashlight.

This assignment was a really great experience for me in putting a lot of things we have learned in PComp into practice. Since finishing my flashlight on Monday, I’ve been in a pretty great mood and feel generally more positive about my ITP experience. My personal opinion is that Intro to Fabrications be a requirement for 1st years. Even some people have experience with building things, it’s a great environment to explore new ways of thinking and the practice of prototyping is invaluable.

FullSizeRender 14

Color composition

Screen Shot 2015-10-23 at 9.23.12 AM

To start off this assignment I took the the color test. I scored a 15, which isn’t too great, but better than I had thought I would get. It was also a great exercise to prepare me for the actual sketch.

When I began planning my code I realized that I typically don’t implement much use of color in sketches. I tend to focus more on the technical coding part as far as I getting the interaction I want in the code. I definitely spend less time in making it visually pleasing and using color to move a story along.

First I coded the basic background by using a previous sketch as inspiration. Once I got the shapes and background I wanted, I added a slider to change the hues. I have never changed the color mode to HSB, so that took a bit of adjustment to understand the effect of color.

Working with sliders was something else that was a bit different for me in this assignment. I have only worked a little with using a slider to change colors, as I have worked a bit more with using sliders to change the size.

Screen Shot 2015-10-27 at 7.21.04 AM

Screen Shot 2015-10-27 at 7.21.21 AM

After adding sliders, I decided that I wanted another effect that ran on its own. Screen Shot 2015-10-27 at 11.15.07 AM

I liked this effect as it gives more of an opportunity to see more colors without changing the slider yourself.

Play with color


IMG_2878 IMG_2880

For the midterm I was happily paired with Kevin, who has very similar interests and ideas for projects. He had started this idea during the Synthesis lab and was looking to take it to the next level with how to make it a meaningful message. When he first showed me the the project, it was a basic button press, in which each time the button was pressed an ellipse would appear in its location based on the csv file loaded into the sketch. Although I liked the idea of using the gun to show the incredible amount of school shootings in the States, I didn’t want the focus to be as much about guns and shooting. I thought this was a great opportunity to explore how we could convey how school shootings affect the perception of other countries have on the U.S, and also how shootings are more about people than guns.

We worked on changing the sketch, so that each time the button was pressed, a black rectangle increases down the y-axis. This creates a new background as the player shoots the gun. The font of the school names is also white, which at first you might not notice, but after as the background changes black, the words are more visible. This gives the impression that perhaps a person might not be aware of the message of the game until a few seconds. My favorite aspect of this project is how the map evolves from the standard map of the U.S. to what looks like a new shape, or map shown in the red “dots”. The message here would be even though we might see the map of the States like the original image, other countries might see this other map. Furthermore, this reflects how we have let ourselves be defined by tragedy, negligence, and the inability to acknowledge that we are all apart of the why and how of school shootings.

Attaching the button to the gun was likely the most difficult part of the process. We tried using double-sided tape, tape, hot glue, and super glue and nothing seemed to work. Ultimately we soldered the wires from the board to the legs of the push button and then wrapped other wire from the handle of the gun a few times to lock it in place.

Final project ideas

I mentioned an idea in the previous weeks about having a device that would read an analog sensor and a sketch would change color depending on the results of the sensor. Taking this basic idea of analog input and serial communication, in addition to my interest in language acquisition, making education more accessible, and finding a way that both can be a more comfortable and private experience. I mean this in the sense that learning new things is incredible, but it also make us incredibly vulnerable, and with vulnerability comes discomfort. Now we know that when we move out of our comfort zone, amazing things happen, and we’re opened to an endless environment of learning, but that’s sometimes easier said than done. With that said, I want to explore finding the comfort in the discomfort.

So, how do we do this? One of my main goals as a teacher was to create an environment where my students felt so comfortable that didn’t think of going to class as a daunting experience. In fact, if they didn’t think of my class as a class at all, then I would consider that a success. In a 3 hour lesson, I would begin with a 10-20 minute open conversation with my students. This led to learning about them by things they would say, topics they brought up, and inevitably something they’d show to the class. We got lucky a few times and would learn that someone is an avid breakdancer or a famous actor in their country. Most importantly though this allowed them to speak freely in English without feeling judged, or thinking that they’re not speaking in the right tense or using the correct gender pronoun.

Incredible things can happen within a class. There’s an undoubtable bond that builds between teacher and students, and students and students. If all the students feel comfortable, the environment can be so welcoming that learning experience feels private. This is the same idea if we danced how we did alone at home when we are out in brightly-lit public space.

To explore this for my final project, I would like to focus on learning basic vocabulary and pronunciation in English. To do this, I would use p5 and a voice sensor. An image would appear when the sketch runs and the person must say the name of the image. If it is correct, the background would change a color. To build on this idea, I would like to associate colors to a scale.






The scale would be tied to the pronunciation of a native English speaker. I would even include this information. For example, this is a native speaker from Chicago.

API and data

This week was super challenging for me. I learned that working with APIs takes the coding experience to a new level. However, I also learned the limitless possibilities we have in working with data. Data isn’t something I think about very often. In fact it’s something I’ve subconsciously trained myself to avoid, as it typically involves numbers, which scares me. BUT, if I have learned one fundamental thing at ITP in the past 2 months (only 2 months!), it’s that math is our friend. Math includes numbers. Numbers are the basis of data. Data tells us what we are all doing and visualizing it helps us understand it. It’s amazing! So, it’s worth it.

I tried exploring the process of implementing an API and started with NYTimes. What I was able to do honestly did not excite me very much, and in turn didn’t motivate me to create something visually interesting. I need a purpose. Even as a very illogical person, I need things to make sense and know why I’m doing something. Why am I showing something? Why am I spending time to code something to show people, including myself? Why does anyone know?

After thinking a lot about it and losing my mind a bit, I decided that I would benefit more by creating my own JSON file. Then I asked myself what data would be interesting to me and then asked if that would also be interested in anyone else. Two of my greatest interests other than education are people and languages. I love exploring how people can learn with others. What we can learn from each other and languages allow the endless opportunity to communicate with anyone. Languages can create barriers, but they can also eliminate boundaries we subconsciously put up. At ITP there are so many boundaries when we first walk in–we plunge into an unparalleled environment of coding, collaboration, technologies, and languages. The last one is the most used and overlooked. We are so focused on the languages we learn inside classrooms: C++, p5, Javascript, Illustrator, Unity, Python, etc but we often forget about the languages used outside the classroom. The languages many people at ITP use to not only further understand their understanding of

Posted in ICM

Business card

Screen Shot 2015-10-18 at 12.40.42 AM

I went through a few different iterations for my business card. I wanted to create something simple, but bold. Even though I have been having some issues with conveying my name in the way that I think that captures my personality and brand, there are benefits to having a two letter name.

I started with a simple format using the Didot typeface. I liked the idea of having KCL together, but highlighting the KC to show that it was my first name. However, it ends up looking too busy. I added the diagonal line to separate my name from my fantasy job profession. Then on the backside, keeping with the simple, but bold theme, I ultimately deciding to just have a logo. After playing around with my logo from the previous week, I decided to use the Futura typeface and arrange it to appear almost like a logo. In the end, I thought it looked too busy with the two typefaces.

Screen Shot 2015-10-16 at 6.20.56 PM

In my next iteration, I decided to add some color, change the typeface, and the layout of the front and back. The first thing I did was go through several different fonts for “KC Lathrop” to see what I wanted to ultimately use.

For the “front side”, I ended up choosing Helvetica for the typeface. I kept it simple, but instead of only showing the job title, I also separated my contact information. I decided to highlight the KC with the green color and use that color as a theme throughout the card. I thought that this green was particularly calming, but still shows a lot of personality.

Screen Shot 2015-10-19 at 1.14.11 PM

For the other side, I used that same idea for highlighting the KC and made that the entire back side. I decided to not use my logo at all. This was a difficult choice, after going through many version of my name. It may have been from staring at it too long, but it ended up looking like a fish hook every time.

Screen Shot 2015-10-20 at 10.15.45 AM

Although I am happy with the end result, I am very open to feedback and suggestions as to how to improve my card. For my prototype for class, I did not print it in color, as I want the focus to be more on the design than the brightness of the color.


DOM, what are you?

This week was pretty tough for me. I definitely would say that I went to, what I call, the dark place of coding. That’s when you suddenly feel like  you are inside a never-ending cave of of errors, or even worse when there are no errors, but the code is not doing what you want. I’m not sure if it was this “fall break” or my underestimation of the understanding and power of DOM. DOM, if that is your real name, what are you?

In everything I do I need context to fully create and work 100%. I begin to lack motivation when I don’t know why something is. And this was a very strong feeling this week.

Before I reached a point of creating anything, I tried to absorb as much information about DOM as possible. I realized that I had never used images in a sketch, so first I tried to do that. And then eventually got to toggling a video. I was able to get that to work and use a video of a PComp project. Then from there, I decided to play around with a button controlling more in a sketch. I came up with the idea for a children’s story I have been working on. The very abridged version.

Before getting to that I met with Moon for office hours. We spent an hour of talking about DOM.

Screen Shot 2015-10-14 at 11.11.50 AM

It looked a lot like this, which makes me speechless. I have no words to even begin to understand this.

So, for the sake of time and my own sanity, I decided to go back to my idea and put DOM aside.

Screen Shot 2015-10-14 at 11.16.36 AM

Currently there are 6 pages to the book. It took me awhile to understand how to make each page like a “scene” that has both an image and text. Basically I made two arrays–one for the images and one for the text.

Here is the first array for images which are triggered when the button is clicked in another function.

Screen Shot 2015-10-14 at 11.21.08 AM

Here is the array for the pages. It took me a very, very long time, but I finally figured out how to customized the text on each page.

Screen Shot 2015-10-14 at 11.19.29 AM

To continue on this, I think there must be a better way to have both arrays inside one “Scene” object, but can’t wrap my head around how to do that.

Posted in ICM


Intro to Asynchronous communication lab

FullSizeRender 13

I used two FSRs for this lab. Although everything worked the way I wanted, my biggest take away is that I tend to copy and paste the code into Arduino and then in p5. This is an awful habit as I’m not understanding the actual code, as well as I don’t truly understand why something is not working. The same was true for the second lab: Serial Input to the p5.js IDE. So, to combat this issue I spent more time on related labs.

Below is the board setup for two labs I did with serial.


Using the board, I programmed p5 and Arduino together. When H is pressed, it’s sent to the Arduino and turns on the light. When the light is on, the Arduino then send a signal back to p5 and changes the color of the canvas background.

Screen Shot 2015-10-14 at 7.19.57 PM

Screen Shot 2015-10-14 at 7.20.36 PM

To practice a bit more, I wanted to use my ICM sketch from last week. When the sketch begins, the light on the Arduino is off and the balloons begin to me. In p5, you must change the color of each ball by clicking inside of each one. Once all of them are clicked, the light will turn on.

Preparing for serial

FullSizeRender 9





FullSizeRender 7





FullSizeRender 10

FullSizeRender 11

FullSizeRender 8


This week I spent some time to redo a few of the labs and get more comfortable with other variable resistors. I wanted to mainly make sure that I understand the wiring of a circuit and how to code what I wanted to happen without referencing the all of the code from the labs. My sub-aim of the week is to experiment with changing things around on my board in order to rev up some creativity for a bigger project.

The information about serial communication is tad overwhelming at the moment. Especially since I wasn’t able to attend the synthesis lab last Friday. However, I did get the digital and analog switches to work connecting p5 to Arduino. This gave me some hope for an idea for a project idea I’ve been thinking about for ICM that I would eventually like to combine with Arduino.

The readings were very helpful this week in terms of thinking about prototyping. I vow to start sketching ideas when they happen.

Here is a beginning sketch for a game that would involve Arduino to control the change in colors of moving balloons. Eventually the balloons would become the words of the color as a way to teach a child basic colors.

FullSizeRender 12

The reading by Igoe, Making Interactive Art: Set the Stage, Then Shut Up and Listen spoke to me the most in terms of understanding the importance of feedback when making interactive art. It really highlights the importance of process over product when learning, as well as teaching.