Wednesday, September 15, 2010

Move the cursor to the right...

I don't feel like explaining yet another Technodrama today, so I'm going to keep this post short.

Today we took our first look at Operating Systems with Introduction to Computer Science. We did this by acting out two Technodrama's.

In the first Technodrama, the actors were asked to move the cursor across the screen by moving the mouse. In the first take of the Technodrama we had a user, the cursor display and the mouse, but in the end we had established that the mouse needs a mouse driver to translate its movement into relative coordinates, which the cursor display can than use to position the cursor.

In the second Technodrama, the actors were asked to click the icon that had been selected in the first Technodrama. This assignment proved to be pretty difficult, as we couldn't agree on how this should happen. We ended up with a cursor display, a window manager, and the actual application that will launch when the icon has been clicked.

At the end of the lesson we had to break down both these Technodrama's in steps, telling which instrument performs what action in each process. You can see my version here.

Tuesday, September 14, 2010

Enjoy your panic

The assignment for today's lesson of Graphic Design was pretty difficult: we had to choose a picture that we had affinity with. This picture had to be put in a 3x3 grid, constantly altering its meaning, like so:

Enhance the message of the photo Change the message of the photo Diminish the message of the photo
By adding an element By adding an element By adding an element
By taking out an element By taking out an element By taking out an element
By exchanging an element By exchanging an element By exchanging an element

We learned that it is very difficult to pick a photograph that is right for this assignment. Some photos are fine the way they are, and do not easily benefit from adding, taking out or exchanging elements, since it doesn't help to enhance their meaning. With these kind of photos, it is difficult to find the right element to add or take out. When adding or exchanging an element, you also have to be very careful not to alter the meaning of the photo when you only want to enhance it. For example, there was a photo of a woman leaning against a wall, apparently waiting for something or watching something. The person who showed this picture decided to add a bus stop sign above the woman to enhance the message. What he actually had done was deciding for us what the picture should mean. In the original, the viewer would wander what the woman is doing: is she waiting for some friend of her? Is she watching a fight? Is she looking at her children walking away? All those scenarios would have been possible with the original picture, but not in the "enhanced" version.

Another lesson we have learned is that it is very difficult to diminish or erase the message from a photo, because every visual object has at least some meaning. For example, when you have a picture portraying a man standing in front of a building, and you take out the man, the picture is still about the building, thus having a meaning.

Our teacher was glad that we had had difficulties with the assignment, and told us to "enjoy our panic", because it shows that graphical editing is not an easy task.To illustrate this, he ended the lesson with a lecture on the book he had created for Industrial Design. Some seemingly simple pages would take him three days or more to get exactly right. He had completed the whole book in 2 years time. This lesson really made me appreciate the layout of books and other forms of visual communication more, and it helped to open my eye to the small details that are present everywhere in graphical work just to make the visual presentation feel right.

Next week we have to combine our second assignment (which was to fix a letter in a typeface) with the current assignment. We have to choose two photos and two verbs and put them in a grid of 2x2. The result is two different photos with the same text on the first row, and those same photos with a different text on the second row.

The story in 12 steps

On Monday we started with some video clips on editing. The message was that editing is what makes or brakes a video. It is the editing which gives a movie a certain atmosphere. An example was the Americans taking down the statue of Saddam Hussein. Due to the close-up shots of cheering people, the viewer perceives that the Iraqi people are very happy with this "act of liberation". When wide-angle shots would have been used for this news item instead, the viewer would have gotten a totally different impression, because most of the people watching the action weren't cheering at all, just watching silently. This proves how strong editing is, and how big the influence of the media is.

In the afternoon we had to present our story in a 12-step format, our version can be found here. This provided everybody with a different way of looking at their own story and theme. We all learned a lot from the way the different groups tackled the assignment, as well as how they presented themselves. One group had one or two members read from the computer screen, while the others just stood there. Another group just told their story, without really sticking to the 12-step format. Some groups had all people telling some steps, while others even used a powerpoint presentation to bring their ideas across. We decided to let everyone in the group present a few steps, with Isa introducing our group and the characters in the story. We decided against using a powerpoint presentation, because we didn't have enough time to create a suitable presentation, and Eliens had told us that he thought it wasn't really necessary to use one anyway.

Most groups created a linear story especially for the 12-step format, based on their theme. We, on the other hand, used our story as a basis for this format and added some things where necessary. This resulted in some steps of the 12-step format being rather vague, because the actual end result (the interactive video) isn't linear, as opposed to the 12-step format. For example, the 7th step, approach to inmost cave, was the 1st choice in our interactive video. When we got comments on the fact that we didn't come up with a linear story for the 12-step format, but used our interactive video as a basis instead, Eliens remarked that if someone was to judge whether we completed the assignment satisfactorily or not, it would be him, and he said that our approach was also OK. He also liked the fact that we combined the virtual world (farmville) with the real world (the server of farmville is located in the park).

This example proves that the Creative Technology is set up in a way that doesn't limit people in the way they cope with the provided assignments, but instead stimulates them to approach a problem in their own way. The result of this is that everyone will handle an assignment in a different way, giving material for a discussion on which way works best, and what can be learned from others.

Languages & Representations

On Friday (10-09-2010) we finished the subject "Languages" by learning about different web development languages. The most basic way of creating a webpage is by coding in HTML. When you want to have a more advanced layout, CSS can be used, a language specifically suited to webpage layout.

The problem with only coding in HTML or HTML+CSS is that the content on the page is the same for every user. When you want to display a different page for each user, you have to use PHP (or a similar language like ASP) to display content based on user input. A common use of PHP is a login system. The user has to provide his or her credentials, and somewhere in the PHP code a database server will be asked to look for a record with the matching user name and password. When this record exists, the user will be directed to a personal page, and when this record doesn't exist, the user will be asked to log in in again.

Web developers nowadays want more than just a static page though. To be able to update the page without refreshing, Javascript can be used. Due to the increased need for user provided content since Web 2.0, an extension had to be build on top of Javascript, which makes it possible to put data in a database or read data from a database without refreshing the page.

After "Languages" we discussed "Representations". Representations are a very important subject in Computer Science, because it affects file size, ease of use and accuracy. The examples that were provided for representations were JPG and GIF. Both are image formats, but they have a very different way of keeping file size reasonable. JPG uses macro blocks at the smallest level. In these blocks, the pixels only differ in brightness, and not in colour, which results in smaller files, because it isn't necessary to storage brightness and colour for each individual pixel. GIF does store brightness and colour for every pixel, but uses another trick to keep filesizes down: the palette of colours is limited to 256 colours.  Although this results in small files, it also limits the file format in its use. A photo, for example, can't be properly displayed in the GIF format. When you only want to show a drawing with a limited amount of colours, however, GIF is a viable option.

We ended the lesson by looking at the representation of numbers, which is often binary in the digital domain.

On sending "beer" and receiving "ber"

Let me preface this post by apologising for the fact that I haven't posted for quite some time. Let me try to make it up by posting four articles at once ;)

On Thursday (09-09-2010) we learned about the AB protocol. We did this by acting out a Technodrama again. Two people participated in the Technodrama: one of them was the sender, and the other one acted as the receiver. The sender had to send a message to the receiver, and this could only be done one letter at a time. The problem was that the medium they use to pass their messages is unreliable. This means that once in a while a message doesn't reach its destination. The only guarantee they had was that when you send an infinite number of messages, not all of them will be destroyed.

At the first attempt, the sender would just send all the letters to the receiver. Unfortunately, the unreliable medium made sure that a lot of messages didn't end up at the receiver, but were destroyed instead. To circumvent this problem, the sender just kept on sending the destroyed letters. In real network communication though, it is impossible to see which messages are lost on the way to the receiver, so the result of just sending all the letters to the receiver would be that the receiver might have some letters of the word, all of them, or end up with no letters at all.

At the second attempt, the sender put a number next to each letter she sent out. In this way the receiver would know that either she got all the letters that were send to her or that she missed some letters. When using this method there are two problems: first of all, you can't do something with the information that the receiver has not got all the letters. Moreover, the receiver has no way of telling that the word has ended. In other words, there is no way to tell the communication has ended.

Both these problems were solved in the final attempt. This time the sender would send a letter with a number, then wait for confirmation from the receiver for a certain time, and when this time has ended without confirmation, the sender would send the message again. At the end of the word the sender would send an “end mark”, signifying that the communication has ended.

In the second part of the lesson we discussed languages, mainly the difference between natural languages and formal languages. The most important difference between them is that in a natural language the meaning of the words are not strictly defined (one word can have multiple meanings), while in a formal language a word can have only one meaning. Another significant difference is that a natural language evolves because the community “owns” its definition, while the definition of a formal language is “owned” by one company, and as a result has little to no change in definition (of course new words can be added to formal languages, but the meaning of existing words are seldom changed).

At the end of the lesson we had to design a formal language, in groups of 4 or 5, with the purpose of describing how to draw buildings. All the groups that presented their ideas ended up with a system based on lines, their length and their direction. Our group ended up with a system of shapes, drawn in a size relative to the other shapes.

After four groups had presented their ideas, our teachers made clear that we could have designed a language that doesn't describe how to draw lines, or even shapes, but perhaps common elements in buildings (windows, roofs, doors) or maybe even complete buildings, which makes the language specifically suited to the task it must perform. This made clear to me that we hadn't paid attention to the sheet about designing a “proper” formal language, which contains the following points:
  • understand the purpose
  • understand the domain
  • capture the essential concept
  • identify the basic "compositional mechanisms"
  • understand the users
Lesson learned: read and understand the sheets before you try to "reinvent the wheel".