Assignment 1

200 word assignment:

I really don’t know what motion design is. I just entered the class inspired my interest in lettering and seeing other people animate their lettering, and I thought it would be a fun thing to learn. I’ve also previously made GIFs or little squiggly animations, which I’ve always loved because there’s such a charm to the movement, and how something simple when tweaked just the tiniest bit can turn into something monumentally different.

I’ve also done a little web design here and there, and I’ve always enjoyed how GIFs and animation can bring so much life to a website. I’ve always thought the popularity of mobile first has led to far, far less creative website designs, so it gives me a delight to discover a website with a GIF logo or a delightful TARDIS (Doctor Who icon) that slides open to show the menu on a Tumblr website.

So I don’t really know what the proper meaning of motion design is, but as far as I’m concerned, motion graphics has always brought me delight, made me look a little longer, and I’d like to put out work that makes people feel delighted enough to replay my work over and over again. If anything, that’s what motion design is to me.

10 second assignment:


Exercise 6 (Developing Web)

I didn’t get around to creating something on my own beginning with how my code wouldn’t work in class. I didn’t really know where the problem was with the code example for the Google maps example, so I missed it.

After class, I tried browsing through the Google maps documentation to figure it out on my own, but I simply got confused. So I thought, why not find another API to study? But the ones that I found that were supposedly easy, like Twitter, were definitely written for people who already knew how to do things, and I was mostly just confused by what was node.js was or how to even fetch data or know if I was fetching data, and I definitely didn’t know how to use the data. It also didn’t help that I just had no idea what to even do with data from Twitter or Google maps or the social APIs. This was when I realized I would probably have no ideas when it comes to the generic APIs so I went looking for stranger ones.

That was how I ended up finding the PokeAPI on a Reddit for cool APIs. But even finding this, their documentation wasn’t exactly beginner friendly–I still had to have some idea of what APIs were and how to use them to use the API. So by the time I went for help and figured it out a little bit, I already figured that I was going to use this for my final project, so essentially, my exercise 6 was the beginning of my final project.

Project 2 (Developing Web)

So, my final app is a game built with jQuery mobile and the Pokeapi. All the user have to do is figure out which Pokemon is heavier.

It was initially supposed to be your weight vs the Pokemon, but since it seemed more intuitive to pit a Pokemon against another one, I went with that. I followed the idea of choosing a starter Pokemon, so there are three of the basic options, but they also evolve after hitting a certain score. The problem with the functionality is that the Pokeapi has security that blocks access to fetching the code, so it needs to be refreshed whenever that happens for everything to work. Secondly, the starter Pokemon are really light. They only change a lot by the third and final evolution, so it’s a really easy game otherwise. And since the API only allows 300 calls every day, I set it so that the person wins after 20 correct answers, to cut down on the calls.

My biggest trouble was getting data within the call to the API to save to the global variable. I tried return, and I followed the structure for all my other vars, but it just didn’t save. The problem was that these were weights, which was important for doing the calculations to set one Pokemon as the correct answer and the other as the wrong one, but someone pointed that since I was calling to the API twice (there are two Pokemon, two different sets of data), I could put the second call in the first, and I can use the variable from the first call in the second to do my comparisons. Also, since the images are generated based on a link including the name, I got rid of some Pokemon like Mr. Mime or Farfetch’d to prevent image errors.

A lot of the tricky part was figuring out how to get the correct behavior procedures and how to replace the content of certain p elements. The game page itself was really tricky, because I need both the id and class for the two Pokemon on the page–the id for one function to find the img element to swap the source of, and the classes are assigned after the calculations work to set one Pokemon as the correct answer and the other as the wrong one, which was important for getting the game to work.

As for styling, I initially tried using ThemeRoller, but it was hard to override and get rid of its different styles, and I ended up breaking the functionality when some of my overrides worked. In the end, I found this CSS that was stripped of everything, which was perfect. I went into it with the firm idea to copy the setup screen of an iOS Device, especially since all the links in jQuery mobile could look like just like Apple’s “links” to go through the setup process, and I didn’t like the jQuery mobile default style to begin with, so it was a great find.

Project 1 (Developing Web)

Link to website

For the project, I wanted to create a website that would display a project that I had made over winter break. Since there were 28 pieces, I wanted to display them as 7 by 4, and I was really scared about doing that, because while I had manually created columns before, I didn’t know how to equally split the screen up by 7. Thankfully, I found the Responsive Grid System, which made it easy to set up the columns, and I also used this guide to create a scroll up button that’s triggered after a bit of scrolling, ideally on mobile, as the columns end up being pushed into one long column.

As for the content, it was a series of quotes from poetry, so I wanted to display that and link to the poems themselves. I got the idea to present as a card flip versus a hover effect, and I used this jQuery flip. I struggled, in the beginning, to get it working properly because the height would be dependent on the content for my back card, and as a workaround, I simply added an image as content to every single one, and then position my text over it.  I also really fiddled with font sizing for the cards and positioning, so there are a lot of really specific media queries to make sure that the cards were still readable.

The other two pages that I added were an About page and FAQ page, which I chose to do because I could clearly imagine a site like this having those pages. The FAQ was a simple page that I added dummy questions to, but the About was a two-column one, with one column about me and the second about the work itself, which I was comfortable creating using divs. After a certain pixel size, it would just collapse into one column.

Assignment 6: Flutist

I was part of an orchestra in high school, and we had flutists in it. We also had a flutist in our class, and those are the reasons why I was interested in reading about the Waseda flutist robot.

I’m not a flutist myself, but I did understand a few of the musical terms here and there, and it was nice to see that the robot makers took so many different details into consideration, such as vibrato and the brightness. It was clear that there was someone in the group who was really passionate and really understood music.

And I don’t deny that seeing a robot that could perfectly play the flute would be cool, but I wonder if I’d actually care about a robot musician once the novelty wears off. I never cared for music, but it was always amazing and humbling to see another student performance and imagine the amount of work and practice that must have gone into perfecting a piece. I was invested in seeing these people that I’ve interacted with just transform when they were with their instrument, playing.

And I think, going back to the idea of drawing robots and Tristan’s point about how it was the coder’s art, I think my stance on robots doing something in the range of the arts is that the robot itself is the art of the coder. But the art made by the robot–be it a drawing or a musical performance–isn’t art in itself. It’s merely a function of the robot.

Assignment 5a + Assignment 5b

The reading mostly tackled how computer controlled robots were efficiently and effectively being used in the manufacturing sector, but what really got me thinking was at the beginning, where the writer mentions how robotics has usually been a mainstay of science fiction.

That got me thinking about all of the robots in dystopian worlds, and I remembered the self-driving car from Google. I think it’s an attractive device, and I think that there’s someone out there who wants to have that available everywhere. I couldn’t help but think that they would all have to be in communication with one another, like in the Amazon warehouse, and essentially, robots would probably end up taking over the service sector next.

Continue reading

Deliverable 4

So, after some back and forth, Martin and I refined the idea by giving it a story.

It’s name is Passive, and it’s just a regular robot, but it’s tired and stressed out and it just wants to roam around in peace, because this is how it recharges. But people keep wanting to approach Passive, and it tries to avoid running into them at all costs.

Continue reading

Assignment 4b

In all honesty, most of the terms just flew right over my head, but as for the basic gist, I see the evolution of robots as something quite similar to how my idea of robots has been evolving over class. To begin with, we started with something basic, like our car, but then there’s actually more that we can do, especially as the more we learn and develop. And with each iteration and discovery, the robots just get more and more refined.

One of the things that really stand out to me from the reading was the Kalman filter because of the math formula that I just completely glossed over, because I didn’t understand it all. But of course, someone had to come up with that formula, and someone had to come up with the programs and the robots that we’ve been using. And people are dreaming so big about robots these days, and I can’t help but feel a little bit of awe for the people trying to make something that doesn’t even exist.