Tuesday, May 31, 2011

I very much like the end result i gathered from this project. In the beginning I was focussing on the if/else statement but then decided to change to classes so I could learn more about the function I used in project two. I think the end clip both represents the classes metaphor and is also visually appealing and interesting to watch. The music in the background is simple but helps to enhance the viewing experience.

link to final clip

http://www.youtube.com/watch?v=k6JGtyxO2Xo&feature=channel_video_title

development

I havent had to change my original idea all that much, all i change was the idea of the 'builder' walking into a real life factory, instead i decided to make the person real and the factory a drawing. I think it creates a new aspect to the clip that is effective but also visually appealing

Thursday, May 26, 2011

Hannah Faesenkloet, dsdn 142
– HouseBuilder

Class or Classes: A classification of data and behaviour which may be used to instantiate objects which fit the description.
For my project I created a short stop-motion clip to represent a ‘class’. In the clip, a blueprint of a house is drawn and created. This is to show the collection of data and behaviour to describe eventual objects. The blueprint is then passed on to a factory builder who turns the blueprint into an actual three-dimensional structure of the drawn house. This represents the class being used to generate objects. The factory builder is able to go back to the blueprint and use them to change the outcome of the final 3D structure, for example, the colour and position of the front door can change or extra windows are added to the bottom floor. Towards the end of the clip the builder continually creates 3D houses that have slight differences. This shows that although the class has been created and used to generate objects, it can be added and altered to create objects that are different.
The first letter of a class name is different from other variables; it is usually uppercase hence the reason the name of the movie is spelt ‘HouseBuilder’.

Monday, May 2, 2011

:IF:
Allows the program to make a decision about which code to execute. If the test evaluates to true, the statements enclosed within the block are executed and if the test evaluates to false the statements are not executed.
:ELSE:
Extends the if() structure allowing the program to choose between two or more block of code. It specifies a block of code to execute when the expression in if() is false.

This is the first example that i found, when the mouse is moved from left and right of the screen, the picture changes from daylight to night to raining. The 'If' statement is used in this case - when mouse is left, raining, when mouse is right, nightand when mouse is in the middle, daylight.


http://www.openprocessing.org/visuals/?visualID=11028

Another example that I found was a short story/animation using many if/else statements.



http://www.openprocessing.org/visuals/?visualID=21309

the final example that I found was a maze based on alice and wonderland, they also include many if else statements. In this case the statements were used so that the user and choose a direction to go in the maze, if clicked on left, the maze would travel to a specified slide next, if clicked right, then the slide specified for that side would run next.



http://www.openprocessing.org/visuals/?visualID=7810

Saturday, April 30, 2011

Overall I am really happy with my design. In the end I decided to keep the sounds random and not in a pattern. This was so that the user can create her/his own sounds with different amounts of circles. I think that it makes the design more interesting than just having one sounds on repeat. I did change a few a the guitar sounds though to nicer sounding strums when mixed with each other.
I ended up changing the colours of the design into something (I think) more visually appealing and interesting. The background colour now compliments the expolsion by creating a nice contrast between white and grey.
I am very happy with what I achieved, with help from the tutors I was able to expand on my original idea and create something fun and interactive. I now have more knowledge on processing and I feel more confident with the program.



I also came to the conclusion that by having the lines remain behind, the design becomes a much greater interactive design. User can try and draw anything they wish while also having the guitar sounds play in the background, so not only is the user getting to hear and create different sounds but they are also able to create visuals that are left behind.

I attempted to play around with colours, I tried orange and orange which i found to be to bold to look at..


I then looked into black and orange which worked nicely but then black lines that created the background pattern got lost in the background. This would not work as those lines were a major part of the design....


I finally came to a choice of colours that I think work rather well....


They grey contrasts well with the blue but also lets the black lines show through to create patterns. the blue is slightly transparent which works well if another circle is added over the top of an original one.

Thursday, April 14, 2011



http://www.openprocessing.org/visuals/?visualID=26972

Okay so final design is finished, im happy with the way it has turned out although there are a few things that i wish to change and further look into
1) improve the music choice, i like the idea of the guitar strumming, but perhaps, instead of having the random sounds, look into what it could sound like if they played in an order, like to create a tune? could be more interesting to listen too, also look into making the sound slightly longer.
2) perhaps look into colour change? i like the colours but perhaps they are to similar to previous assignment?
3) make the explosions happen in the exact spot the circle is located, at the moment they are exploding slightly off the actual circle.
4) also make the explosion more obvious?? could work better then again it also looks nice having them just there in the background.
With the new explosion idea, I played round with the code so i could use it in my design.. I decide to use less particles (200) on my design compared with the 10000 that was in the original design, so that the explosion didnt overpower the actual main area of my deisgn, (circles and lines).

Now that I had the circles, lines and colours sorted out, I moved onto the idea of the exploding circles. I didnt want to have the typical explosion so i researched into different ideas.
I found this particle explosion to be the one to explore and perhaps use.



further process into design. I have decided to change the original idea from having a random amount of lines and circle blow up to just the one that is clicked. Also instead of both the line an circle disappearing, only the circle will therefore creating a picture with the lines left behind.



Starting out on processing, decided to go with the colours orange and blue. Ive made the orange transparent so that if a circle is made on top of another circle, it will turn a shade darker, it will go darker again if another is added.
Some possible idea for colours and sound to be involved in the deisgn..

This is my story board for a further look into the design with circles. I feel that I have incorperated more interactive qualities that make the design not only fun to use but also interesting as well.

Saturday, April 9, 2011

I gathered inspiration from images such as this one....



the idea of a vine like structure was very appealing to me and therefore I tried to portray this in my design. I like the idea of building and construction on top of something else.
The design also sort of reflects the idea of joints or bones which i also tried to link into the design.

Thursday, April 7, 2011

Assignment number 2

So new assignment time, so first off a few notes from the lecture.....



Here are a few ideas and sketches I came up with during the tutorial





When thinking over the designs, I realised that I needed to achieve a more 'intereactive' design but I also wanted to continue with the circle line idea.

Monday, March 21, 2011

-Reflection of first project-
I like how I have kept my aim of a 'sophisticated' design and made the design something that people could possibly want to use as wallpaper for a room. I feel that the wallpaper would be well suited in the place I designed it for (first year design studio) as it is not crazy busy to look at but a calm and relaxed pattern.

Goals for next project-
Perhaps do something completely different, create something that is out there and intense but still keep the visually appealing aspects of the design.
-Final wallpapers-







I am very happy with the final outcome of the design and I have completed my goals for the project.
-The wallpaper has a sophisticated look to it, which is what I set out to achieve.
-The panels obviously flow together with the way the triangles swarm and become bigger.
-I figured out in processing how to create the darker colour when the triangles overlap.
-Every one of the triangles are a different size, in processing I discovered how to create many random triangles with a small amount of code but I was unable to figure out how to create random triangles in a diagonal strip. I will look into this for later in the year.
-In the end I think that I know processing enough to create interesting patterns, although very little of my work had multiple lines and shapes other than triangles, I do know how to create them on code.

Sunday, March 20, 2011


These are the final designs finished on processing. I am very happy with the way they have turned out. The colours are effective and the overall design gives a wavy/flowing feeling which was what I was aiming for.
This is a mid-way through photo of the designs, I have decided to see what a change in transparency of the colours across the panels looks like a i am happy with the outcome. It gives the deisgn something more.

Saturday, March 19, 2011

I came across some difficulties with connecting the triangles between panels. I figured it out with trial and error but also started the starting point with the negative of the first triangle. That helped to get the ruff position and from there I got the correct points.

This is an attempt at the first panel with colour.



I feel that the colours are great but that the blue could be a slightly stronger/darker.
the triangle sizes are the rigth size for the first board.

Friday, March 18, 2011

With my design now decided on I now have a few goals I want to achieve in this assignment.
1) create and attractive and eye catching wallpaper.
2) make the panels obviously flow together.
3) incorperate colour into the design. Either two colours or a set that suit each other well.
4) when the triangles overlap, to have the colour grow darker.
5) to have each triangle in the design a different size.
6) learn processing to help me achieve the best deisgn I can.
With the idea now changing to include mainly if not all triangles I created this design.

This was the first set of panels I tried with the brain cells idea,

Thursday, March 17, 2011

Wallpaper

For my wallpaper I have decided to create four panels that very obviously connect together. I looked into the idea I created based on the idea of brain cells, to have a pattern that would look similar to this shape



I attempted to make the first panel but then quickly realized that although do-able, it was very time consuming and I only had one week to complete the four designs.
With this in mind, I proceeded to design new panels with the same sort of idea/flowing visual incorporated. The idea of triangles were very appealing to me so I decided to use these. I came up with a new idea that I think will look visually appealing while still pushing me to learn more about processing.

Monday, March 7, 2011




//Combining transformations
float angle = 0.0;
void setup()
{
size(500,500);
background(255);
smooth();
}

void draw()
{

pushMatrix();
translate(mouseX,mouseY);
rotate(angle);
strokeWeight(0.1);
fill(0,113,167,4);
ellipse(50,50, 100,100);
fill(167,73,0,10);
rect(-25,-25,50,50);

angle+=0.3;

popMatrix();

}

based off http://www.openprocessing.org/visuals/?visualID=20149



size(500,500);
smooth();
background(252, 252, 252);

line(0, 500, 0, 0);
line(500, 0, 0, 0);
line(500, 0, 50, 50);
line(0, 500, 50, 50);
line(0, 500, 100, 100);
line(500, 0, 100, 100);
line(500, 0, 150, 150);
line(0, 500, 150, 150);
line(500, 0, 200, 200);
line(0, 500, 200, 200);
line(500, 0, 250, 250);
line(0, 500, 250, 250);
line(0, 500, 300, 300);
line(500, 0, 300, 300);
line(500, 0, 350, 350);
line(0, 500, 350, 350);
line(0, 500, 400, 400);
line(500, 0, 400, 400);
line(0, 500, 450, 450);
line(500, 0, 450, 450);
line(500, 0, 500, 500);
line(0, 500, 500, 500);


fill(64, 170, 234,200);
ellipse(0, 0, 50, 50);
ellipse(50, 50, 50, 50);
ellipse(100, 100, 50, 50);
ellipse(150, 150, 50, 50);
ellipse(200, 200, 50, 50);
ellipse(250, 250, 50, 50);
ellipse(300, 300, 50, 50);
ellipse(350, 350, 50, 50);
ellipse(400, 400, 50, 50);
ellipse(450, 450, 50, 50);
ellipse(500, 500, 50, 50);
fill(64,170,234,50);
ellipse(0,500,300,300);
ellipse(500,0,300,300);



void setup()
{

size(500,500);
smooth();


}

void draw()
{


fill(80,170,255,10);
strokeWeight(0.1);

if (mouseButton == LEFT)

fill(255,175,100,8);

if (mouseButton == RIGHT)

fill(0,255,255,8);

ellipse(mouseX,mouseY,100,100);
ellipse(mouseX,mouseY,50,50);


}

Sunday, March 6, 2011




int patternSeperationX = 90;
int patternSeperationY = 90;
void setup(){
size(450,450);

for(int i = 0; i < width/patternSeperationX; i++){
for(int j = 0; j < height/patternSeperationY; j++){
pushMatrix();
translate(i*patternSeperationX, j*patternSeperationY);
yourFunction();
popMatrix();
}
}

}
void draw()
{

}
void yourFunction(){
strokeWeight(1);
fill(14,89,149,50);
ellipse(450,450,900,900);
fill(37,137,43,30);
ellipse(0,0,250,250);
}

-this was another take on the concept below, this time incoperating the pacific island flower shape. the green and blue mixes well together and the slow fading effect also suits this design nicely. could be to busy? perhaps less flower pattern, maybe more transparent?



int patternSeperationX = 90;
int patternSeperationY = 90;
void setup(){
size(450,450);

for(int i = 0; i < width/patternSeperationX; i++){
for(int j = 0; j < height/patternSeperationY; j++){
pushMatrix();
translate(i*patternSeperationX, j*patternSeperationY);
yourFunction();
popMatrix();
}
}

}
void draw()
{

}
void yourFunction(){
strokeWeight(1);
fill(14,89,149,50);
ellipse(450,450,900,900);

line(0,0,50,50);
line(0,50,50s,0);
line(25,75,0,50);
line(50,50,25,75);
line(0,0,450,450);
}

- The use of overlapping circles that slowly become darker in colour reminds me of sonar waves. To get this effect I used a medium transparency. The fish looking shapes is formed of one big cross with two smaller lines added.