Medien Wiki - User contributions [en]

File:Interval pixels example C.png

2014-12-02T09:24:52Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:Interval pixels example B.png

2014-12-02T09:24:33Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:Interval pixels example A.png

2014-12-02T09:24:11Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:All Hail The Pixels/ProcessingSketches

2014-12-02T09:22:58Z

Frederic Gmeiner: /* 28.11.2014 Processing sketches */

== 17.10.2014 Processing sketches ==

=== P01 Shapes and Relations ===

<source lang="java">
/*
P01 Shapes and Relations

This example illustrates how to formulate properties in relation to each other.
Also the following principles are introduced:
- Usage of the setup() and draw() functions
- Drawing of basic shapes and colors
- Definition and usage of variables > dimension, halfDimension and border
- Dynamic mouse input to influence the state of the programm during runtime
- Output values to the console with print() and println()
*/

void setup() {
// set the canvas size
size(1000, 600);
}

void draw() {

// set background color to white
background(255);
// no fill color
noFill();

// variable for the size of the rectangle and the ellipse
float dimension = mouseX;
// variable for the distance between the red lines and the center shapes
float border = mouseY * 0.2;

// set the stroke color to black
stroke(0);

// use the center as origin when drawing rectangles
rectMode(CENTER);

// draw a rectangle on the left side of the canvas with varaible dimensions
rect(250, 300, dimension, dimension);
// draw a circle on the right side of the canvas with varaible dimensions
ellipse(750, 300, dimension, dimension);

// calculate and store half of the current dimension (for better readability)
float halfDimension = dimension * 0.5;
stroke(255, 0, 0);
// draw the two lines according to the dimension of the shapes and the vertical border
line(250 - halfDimension, 300 - halfDimension - border, 750 + halfDimension, 300 - halfDimension - border);
line(250 - halfDimension, 300 + halfDimension + border, 750 + halfDimension, 300 + halfDimension + border);

// output the actual dimension and border values to the console
print("dimension:");
println(dimension);

print("border:");
println(border);
}

</source>
<br /><br />

=== P02 Custom Functions ===

<source lang="java">
/*
P02 Custom functions and transformations

This example shows how to write custom functions and how to use the
transform() and the rotate() statements to move and rotate the canvas.
It also illustrates the possibility to store and restore a certain
transformation state with pushMatrix() and popMatrix().
*/

void setup(){

size(1000,600);
background(0);

// move to the center of the canvas
translate(width * 0.5, height * 0.5);
// draw an arrow and a cross with the size of 10 pixels
arrow();
crossShape(10);

// store the actual position (in this case the center of the stage)
pushMatrix();

// move 200 pixels to the right from the canvas center
translate(200, 0);
// rotate the canvas by 60 degrees
rotate( radians(60) );
// draw an arrow and a cross to this new rotated location
arrow();
crossShape(10);

// recall the previously stored position (the center of the
// canvas which was done using the pushMatrix() statement)
popMatrix();

// move 100 pixels down from the center of the canvas
translate(0,100);
arrow();
crossShape(10);

}

// Define a new function which draws a red arrow to the actual origin of the canvas
void arrow(){
stroke(255,0,0);
line(0,0,50,0);
line(45,-5,50,0);
line(45,5,50,0);
}

// Define a new function which draws a black cross depending on the passed parameter "dimension"
void crossShape(float dimension){
float halfDimension = dimension * 0.5;
stroke(255);
line(-halfDimension, -halfDimension, halfDimension, halfDimension );
line( halfDimension, -halfDimension, -halfDimension, halfDimension);
}

</source>
<br /><br />

== 07.11.2014 Processing sketches ==

=== P03 Nested Rects ===

<source lang="java">
/*
P03 Nested Rectangles with a while loop

Demonstration of how to make a repetetive structure using
a while-loop. Here the variable "rectSize" is decreased in
every step and the coordinate system is rotated a little bit
as well. The while-loop is executed as long as the value
of rectSize is larger than zero (rectSize > 0).
*/

size(1000,600);

// variable with the start size of the rectangles structure
int rectSize = 500;
// variable to specify the amount the rectangles are shrinked in each step
int difference = 30;

background(255);
// since all shapes are aligned centered, the center rect mode is used
rectMode(CENTER);
noFill();

// set the origin of the coordinate system to the center of the stage
translate(width/2, height/2);

// continue the following statements within the while-loop as long as the value
// of the variable "rectSize" is larger than 0
while(rectSize > 0){
//draw a rectangle with the actual size of "rectSize"
rect(0,0,rectSize,rectSize);
// for the next loop: decrease the value of "rectSize" by the value of "difference"
rectSize = rectSize - difference;
// rotate the coordinate system by 4 degrees
rotate(radians(4));
}

</source>
<br /><br />

=== P04 For Loop ===

<source lang="java">
/*
P04 For-Loop for repeating structures

Draw a number of rectangles in a horizontal line and dynamically
change the spacing between them according to the y-position of the
mouse.

*/

// Variable to specify the total numbers of rectangles to be drawn
int numRects = 10;

void setup(){
size(1000,600);
noFill();
}

void draw(){

// Calculate the distance between each rectangle by
// dividing the current mouse position by 10 (or multiply it with 0.1)
float distance = mouseX * 0.1;

// Reset the background to white
background(255);

// Move the coordinate system to the vertical center
translate(0, height * 0.5);

// Repeat the for-loop for the times of "numRects"
for(int i=0; i < numRects ; i++ ){
// Draw a rectangle at the current origin of the cordinate system (0,0)
rect(0,0,10,10);
// Move the coordinate system to the right by the number of pixels specified in "distance"
translate( distance ,0);
}
}
</source>
<br /><br />

=== P05 2D Grid ===

<source lang="java">
/*
P05 2D GRID

Example to demsonstrate the usage of two nested for loops
to create a two dimensional grid pattern. The number of
rows and colums is calculated at the startup so that it
matches given space (half of the screen size) and the
specified spacing between each grid element (defined by
the variable "gridSpacing")

*/

// Define the spacing of the grid elements
float gridSpacing = 10;

// Inititalize variables to store the number of rows and colums
float numCols;
float numRows;

void setup(){
size(600,600);
// Dynamically calculate the number of colums and rows accoding to the given
// stage size and the grid size.
numCols = (width * 0.5) / gridSpacing;
numRows = (height * 0.5) / gridSpacing;

}

void draw(){

background(255);

// Leave a quater of the stage blank as spacing around the
// grid structure.
translate(width * 0.25, height * 0.25);

// Use two for loops to interate the colums and rows:
for(float i=0; i < numCols; i+= 1 ){
for(float j=0; j < numRows; j+= 1){

// Change the appearance of dots for
// even and odd rows
if( j % 2 == 0){
stroke(0);
noFill();
}else{
fill(255,0,0);
noStroke();
}

// Calculate the actual position of the individual dot:
float x = i * gridSpacing;
float y = j * gridSpacing;

// Draw the ellipse
ellipse(x, y, 5, 5);

}
}
}
</source>
<br /><br />

== 21.11.2014 Processing sketches ==

=== P06 Strings and Chars ===

<source lang="java">

/*
P06 Strings and Chars

This example illustrates how to work with Strings (a collection of characters)
and how to display text on the screen. Also it shows how to access single characters
of a string by using the charAt() function.

*/

// Initialize a new string variable and assign the phrase "HELLO" to it
String word = "HELLO";

// Variable to count the current character position
int index = 0;

void setup() {
size(1000, 600);
// Set the size for any text that is drawn to 36px
textSize(36);
// Reduce the frame rate of the draw() loop to 2 frames per second
frameRate(2);
}

void draw() {

background(0);

// Make sure that the index never exceeds the bounds of the word
if (index >= word.length() ) {
index = 0;
}

// Display the character at the current position (index) at the center of the screen
text(word.charAt(index), width*0.5, height*0.5);

// Increment the index by 1
index++;
}

</source>
<br /><br />

=== P07 Array Layout ===

<source lang="java">

/*

P07 Array Layout

This sketch shows how Arrays can be used to structure a set of numbers.
Also it uses a for-loop to iterate the Array and to access each individual
number of it to draw an ellipse with the respective diameter.

*/

// Initialize an Array to specify the individual diameters of ellipses in the grid.
// Note that the way of writing the numbers in a 3x3 grid is only for better readibility.
// One could also write {9,2,2,2,9,2,2,2,9}
int[] diameters = { 9,2,2,
2,9,2,
2,2,9 };

// Variable to define the spacing between the elements in the grid
int spacing = 50;

void setup(){
size(1000,600);
noFill();

// Print the total numbers of elements in the diameters array to the console
println(diameters.length);

}

void draw(){
background(255);

// Align the grid structure to the center
translate(width * 0.5 - (spacing * 1.5), height * 0.5 - (spacing * 1.5));

// Loop over the diameters array
for(int i=0; i < diameters.length; i++){

// Calculate the modulo of the division of the counter (i) by the total
// number of colums (3) to get the current column:
int x = (i % 3) * spacing;

// Calculate the actual row by dividing the counter by the total number
// of columns (3) and rounding it down with floor()
int y = floor(i / 3) * spacing;

// Draws the individual ellipse with the respective diameter
// specified in the diameters array.
ellipse(x, y, diameters[i], diameters[i]);
}
}

</source>
<br /><br />

=== P08 Grid By Image ===

Make sure you have the [[Media:layout_pixels_example.png]] file in the data folder of the sketch!

<source lang="java">

/*

P08 Grid By Image

Example of how to load an image file into processing and how to access each
pixel of the image. The color information of the pixels of the loaded image
are used to modify the grid layout.

NOTICE: Make sure the image "layout_pixels_example.png" is placed in the "data" folder of
this sketch!

*/

// Initialize a variable to store an image
PImage img;

// Define a variable to specify the spacing of the elements
int spacing = 10;

void setup() {
size(1000, 600);
// Load the actual image file from the data folder and
// assign it to the img variable
img = loadImage("layout_pixels_example.png");

// How many pixels did we load?
println(img.pixels.length);
}

void draw() {

background(0);

// Only show the actual image if a keyboard key is pressed
if(keyPressed){
image(img, 0, 0);
}

// Two nested for-loops to draw ellipses all over the window
// with a certain spacing
for (int x=0; x < width; x+= spacing) {
for (int y=0; y < height; y+= spacing) {

// Extract the color of the x and y pixel position of the image
color c = img.get(x, y);

// Only actually draw an ellipse when the current brightness of the
// extracted color is very dark (brightness == 0)
if (brightness(c) == 0 ) {
ellipse(x, y, 5, 5);
}
}
}
}
</source>
<br /><br />

== 28.11.2014 Processing sketches ==

=== P09 Interval timer ===

Make sure you have the files [[Media:interval_pixels_example_A.png]], [[Media:interval_pixels_example_B.png]] and [[Media:interval_pixels_example_C.png]] in the data folder of the sketch!

<source lang="java">
/*
P09 Interval timer

A refinement of the "Grid by image" example with multiple changing
images. The millis() function is utilized to create an interval
timer which changes the actual image from the image sequence stored
in an array. The mouse x position changes the size of the grid dynamically.
Therefor the map() function is used to scale the range of the screen
width to the desired range for controlling the grid size.

*/

float gridSize = 10;

// Array of images (of type PImage) with the size
// of 3 is initializied
PImage[] images = new PImage[3];

// Counter for the current index of the image sequence
int imageCounter = 0;

// Variable to define the timer interval in milliseconds
int timerInterval = 400;
// Helper variable to store the last time the interval time has passed
int lastMillis = 0;

void setup() {

size(1000, 600);
// Assign individual images from the data folder
// to the array positions
images[0] = loadImage("interval_pixels_example_A.png");
images[1] = loadImage("interval_pixels_example_B.png");
images[2] = loadImage("interval_pixels_example_C.png");
}

void draw() {
background(0);

// The millis() function returns the number of milliseconds
// (thousandths of a second) since starting the program.
// When lastMillis is substracted from millis(), we get the
// milliseconds which have been past since the last timer execution.
if( millis() - lastMillis > timerInterval ){
// Now count up the imageCounter by 1
imageCounter++;
// Make sure it stays within the bounds of the images array
imageCounter = imageCounter % images.length;

// It is important to set lastMillis to the actual number
// of milliseconds, otherwise the if condition does not
// work repetitively.
lastMillis = millis();
}

// Helper variable to store the actual image from the array.
PImage currentImg = images[imageCounter];

// Only show the background image when a keyboard key is pressed
if(keyPressed){
image(currentImg, 0, 0);
}

// Dynamically scale the gridSize according to the mouse
// x position
gridSize = map(mouseX, 0, width, 5, 30);

// Loop through the columns and rows of the grid
// as in the previous example
for (int x=0; x < width; x+= gridSize) {
for (int y=0; y < height; y+= gridSize) {

color c = currentImg.get(x, y);

if (brightness(c) < 255 ) {
ellipse(x, y, 5, 5);
}
}
}
}
</source>
<br /><br />

=== P10 Linear movement and direction ===

<source lang="java">
/*
P10 Linear movement and direction

The famous "bouncing ball"illustrates how steady movement
is achived by adding a constant number (speed) to the actual
position of an ellipse. The horizontal or vertical direction
is changed when the ellipse hits an edge of the sketch window.

*/

float rad = 60.0;

float xpos, ypos;

float xspeed = 2.8;
float yspeed = 2.2;

int xdirection = 1;
int ydirection = 1;

void setup()
{
size(640, 360);
noStroke();
frameRate(30);
ellipseMode(RADIUS);

xpos = width/2;
ypos = height/2;
}

void draw()
{
background(102);

xpos = xpos + ( xspeed * xdirection );
ypos = ypos + ( yspeed * ydirection );

if (xpos > width-rad || xpos < rad) {
xdirection *= -1;
}
if (ypos > height-rad || ypos < rad) {
ydirection *= -1;
}

ellipse(xpos, ypos, rad, rad);
}
</source>
<br /><br />

=== P11 Polar dots ===

<source lang="java">
/*
P11 Polar dots

Illustrates how circular shapes and movements are created by using
polar coordinates (angle and radius) and how to convert these to cartesian
coordinates (x and y) by using sine and cosine functions (sin() and cos()).

*/

// Radius
float r;
// Radius offset
float rOffset = 1.0;

// Angle and speed
float angle = 0.0;
float angleSpeed = 0.02;

void setup() {
size(1000, 600);
ellipseMode(CENTER);

// Set r according to the sketch height
r = height * 0.25;
background(255);
}

void draw() {

// Dynamically scale the radius with the mouse x position
rOffset = map(mouseX, 0, width, 0.0, 1.5);

// Draw a semi-transparent rectangle across the whole window
// to let the backround smoothly fade out.
fill(255,10);
rect(0,0,width,height);

// Move to the center
translate(width/2, height/2);

// Convert polar to cartesian coordinates
// and scale the actual radius
float x = (r * rOffset) * cos(angle);
float y = (r * rOffset) * sin(angle);

// Draw the moving red ellipse to the actual position
noStroke();
fill(200,0,0);
ellipse(x, y, 17, 17);

// Draw the steady circle
stroke(0,10);
noFill();
ellipse(0,0,r*2,r*2);

// Increase the current value of angle by the value of angleSpeed
angle += angleSpeed;

}
</source>
<br /><br />

IFD:All Hail The Pixels/ProcessingSketches

2014-11-22T10:30:15Z

Frederic Gmeiner: /* P08 Grid By Image */

IFD:All Hail The Pixels/ProcessingSketches

2014-11-22T10:29:10Z

Frederic Gmeiner: /* P08 Grid By Image */

File:Layout pixels example.png

2014-11-22T10:28:30Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

IFD:All Hail The Pixels/ProcessingSketches

2014-11-22T10:27:09Z

Frederic Gmeiner: /* P08 Grid By Image */

IFD:All Hail The Pixels/ProcessingSketches

2014-11-22T10:26:05Z

Frederic Gmeiner: fixed the lang attribute

IFD:All Hail The Pixels/ProcessingSketches

2014-11-22T10:25:48Z

Frederic Gmeiner: fixed the lang attribute

IFD:All Hail The Pixels/ProcessingSketches

2014-11-22T10:25:31Z

Frederic Gmeiner: fixed the lang attribute

IFD:All Hail The Pixels/ProcessingSketches

2014-11-21T20:59:47Z

Frederic Gmeiner: /* 21.11.2014 Processing sketches */

IFD:All Hail The Pixels/ProcessingSketches

2014-11-09T17:00:54Z

Frederic Gmeiner: Added P04 and P05 example sketches

IFD:All Hail The Pixels/ProcessingSketches

2014-11-09T16:59:15Z

Frederic Gmeiner: Added P03 example sketch

IFD:All Hail The Pixels

2014-10-27T22:22:20Z

Frederic Gmeiner: /* Workgroups */

Werkmodul/Fachmodul/[[:Category:Fachmodul|Fachmodul]][[:Category:Werkmodul|Werkmodul]]<br />
''Lecturer(s):'' [[Martin Schied]],[[Frederic Gmeiner]]<br />
''Credits:'' 6 [[ECTS]], 4 [[SWS]]<br />
''Date:'' Every Second Friday (Schedule TBA), 13:30 until 20:30 h <br />
''Venue:'' [[Marienstraße 7b]], Room 105<br />
''First meeting:'' 17.10.2014

==Description==

'''All hail the Pixels!'''

Square pixels, round pixels, megapixels, microcropixels. Pixel clowds
and pixel clowns. Hot pixels, cold pixels, dead pixels and their funerals.

The pixelized physical computing course focuses on all kind of elements
that can be used or seen as pixels - be it in Architecture on facades,
interior design elements, street lighths or in an experimental display.
The course focuses on the prototyping of content displayable on pixels
and the realization aspect of pixel based systems.

the course is divided into 4 megapixels:

1. Grids and Pixels - What is a single pixel capable of and how are
pixels perceived in larger formations? What can be used as a pixel?
Generative Design of Patterns and repeating structures. Experimental
systems are done using the well known "Processing" environment.

2. Choreography - What can be done with the developed Systems? How can
you represent movements and patterns in a digital system? Concepts to
animate the structures and systems are developed.

3. Spacial aspects and realizations. How to transfer digitally
prototyped concepts to a real object, e.g. a Building's Facade.

4. Technical Prototype. How does an individual (Pix)Element work in
detail? Build one element as a physical working prototype. We will use
the Arduino environment and popular electromechanical components to make
them.

The class is held by Frederic Gmeiner from Design Studio FELD and Martin Schied.

===German description===

Pixelbasiertes Gestalten und Grundlagen des Physical Computings.
Im Laufe des Semesters werden wir 4 Projektphasen durchlaufen:

1. Raster: Was kann ein einzelnes Modul/Pixel/Baustein? Wie verhalten
sich viele im Zusammenspiel?
- Entwurf von generativen visuellen Mustern und repetitiven Strukturen
mit der Programmierungsumgebung "Processing"

2. Choreographie: Was kann mit den einzelnen Systemen dargestellt werden?
- Formulierung von Bewegungsabläufen (Choreographien) und Ausprobieren
unterschiedlicher Strategien für die Animation der entwickelten Muster
und Strukturen.

3. Räumliche Umsetzung: Wie lassen sich die skizzierten Entwürfe in den
realen Raum transferieren?
- Konzepte zur Übersetzung der Anordnung und der Bewegungsprinzipien in
eine räumlich-physische Umgebung (z.B. Hausfassade).

4. Technischer Prototyp: Wie funktioniert ein einzelner Baustein im
Detail?
- Prototypenhafte Entwicklung einzelner Mechanik- und Elektronikbausteine welche von einem Mikrokontroller angesteuert werden.

==Topics==
* [[/tba1/]]
* [[/tba2/]]

==Admission requirements==
k.A.

==Registration procedure==
Please send your application by email with the Subject ''{{PAGENAME}}'' to: martin.schied@uni-weimar.de
* Name, Surname
* program and semester (Studienprogramm und Fachsemester)
* matriculation number (Matrikelnummer)
* Angabe der geltenden Prüfungsordnung
* Valid email address @uni-weimar.de (no other mailing addresses will be accepted) [[SCC-Services#E-Mail|Why?]]
Sollte es mehr als 15 Bewerber geben, entscheidet die Reihenfolge der Anmeldungen über die Aufnahme in den Kurs

==Evaluation==
Active participation, presentation, documentation.

==Eligible participants==
Graduates enrolled in the Faculties of Media, Gestaltung and in the MediaArchitecture program

== Email List ==

Register for the [http://mg.medien.uni-weimar.de/mailman/listinfo/pixels pixels mailinglist]

== Participants ==

=== Workgroups ===

Please sign up for a workgroup by replacing "Your name" and "Your email" with your name and mail address. Each group should not exceed five members.

{| class="wikitable"
|+Group A
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group B
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group C
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group D
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group E
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group F
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

==Syllabus==

The classes will be held every second Week, detailed Schedule will be listed below soon:

=== 17.10. - INTRODUCTION MEETING ===

* Introduction
** Short self introduction
** Examples of different pixel projects
** What? Why? How?
** What you will learn in this class
* Questionnaire: What (technical) knowledge and experience do you have about programming and electronics? What do you want to learn?
* Installing Processing
* Mailingliste, Wiki, etc.
* Reading list & (online) resources
* Processing Introduction
** P01 ShapesAndRelations
** P02 CustomFunctions

=== 07.11. - PIXELS, PATTERNS, RULES ===

''What is a single pixel capable of and how are pixels perceived in larger formations? What can be used as a pixel? Generative Design of Patterns and repeating structures. Experimental systems are done using the well known "Processing" environment.''

* Review of Assignment I

=== 14.11. - GRID, LAYOUT, DISTRIBUTION, STRUCTURE ===

* Possible strategies:
** Formulate a (static) grid system
** Generate structures by dynamic parameters
** Using external images or structured data

=== 28.11. - MOTION, CHOREOGRAPHY, STORIES ===

''What can be done with the developed Systems? How can you represent movements and patterns in a digital system? Concepts to animate the structures and systems are developed.''

* Principle: Using software to prototype motion and behaviour and use the very same system (or parts thereof) to control the movement of the physical installation (authoring system)

Strategies: * Create animations by parameters * Environments / Systems (physics simulations, particle systems) * Using images / video as source

=== 12.12. - GETTING PHYSICAL ===

* Methods and strategies to transfer the digital prototyped concepts to a real object / mechanism
* What to translate and how?
* Electronics introduction and Arduino
* Developing simple mechanical structures and principles

=== 9.1. - PROTOTYPING ===

=== 23.1. - PROTOTYPING, FINALIZING ===

=== 6.2. - PRESENTATION & DOCUMENTATION ===

== Research on existing "Pixel" Projects ==

Upload your findings with a short description and a link to this page:

'''[[/ResearchPixelProjects/]]'''

== Processing Code Examples ==

All code examples which were demonstrated during the class meetings are listed on this subpage:

'''[[/ProcessingSketches/]]'''

== Assignments ==

=== ASSIGNMENT 1 - 17.10.2014 ===
''' ''"Create three different patterns on paper and formulate these in code with properties using processing "'' '''

Upload your image and code sketches to the wiki here: '''[[/Patterns/]]'''

==Literature==

* Joshua Noble: Programming Interactivity, O’Reilly, ISBN 978-0596154141
* Casey Reas und Ben Fry: Processing, Mit Press, ISBN 978-0262182621

==Links==

tba.

[[Category:Frederic Gmeiner]]
[[Category:Martin Schied]]
[[Category:Physical Computing]]
[[Category:Processing]]
[[Category:Programming]]
[[Category:WS14]]
[[Category:Werkmodul]]
[[Category:Fachmodul]]
[[Category:Interface Design]]

IFD:All Hail The Pixels

2014-10-27T21:48:09Z

Frederic Gmeiner: Tables for workgroups added

Werkmodul/Fachmodul/[[:Category:Fachmodul|Fachmodul]][[:Category:Werkmodul|Werkmodul]]<br />
''Lecturer(s):'' [[Martin Schied]],[[Frederic Gmeiner]]<br />
''Credits:'' 6 [[ECTS]], 4 [[SWS]]<br />
''Date:'' Every Second Friday (Schedule TBA), 13:30 until 20:30 h <br />
''Venue:'' [[Marienstraße 7b]], Room 105<br />
''First meeting:'' 17.10.2014

==Description==

'''All hail the Pixels!'''

Square pixels, round pixels, megapixels, microcropixels. Pixel clowds
and pixel clowns. Hot pixels, cold pixels, dead pixels and their funerals.

The pixelized physical computing course focuses on all kind of elements
that can be used or seen as pixels - be it in Architecture on facades,
interior design elements, street lighths or in an experimental display.
The course focuses on the prototyping of content displayable on pixels
and the realization aspect of pixel based systems.

the course is divided into 4 megapixels:

1. Grids and Pixels - What is a single pixel capable of and how are
pixels perceived in larger formations? What can be used as a pixel?
Generative Design of Patterns and repeating structures. Experimental
systems are done using the well known "Processing" environment.

2. Choreography - What can be done with the developed Systems? How can
you represent movements and patterns in a digital system? Concepts to
animate the structures and systems are developed.

3. Spacial aspects and realizations. How to transfer digitally
prototyped concepts to a real object, e.g. a Building's Facade.

4. Technical Prototype. How does an individual (Pix)Element work in
detail? Build one element as a physical working prototype. We will use
the Arduino environment and popular electromechanical components to make
them.

The class is held by Frederic Gmeiner from Design Studio FELD and Martin Schied.

===German description===

Pixelbasiertes Gestalten und Grundlagen des Physical Computings.
Im Laufe des Semesters werden wir 4 Projektphasen durchlaufen:

1. Raster: Was kann ein einzelnes Modul/Pixel/Baustein? Wie verhalten
sich viele im Zusammenspiel?
- Entwurf von generativen visuellen Mustern und repetitiven Strukturen
mit der Programmierungsumgebung "Processing"

2. Choreographie: Was kann mit den einzelnen Systemen dargestellt werden?
- Formulierung von Bewegungsabläufen (Choreographien) und Ausprobieren
unterschiedlicher Strategien für die Animation der entwickelten Muster
und Strukturen.

3. Räumliche Umsetzung: Wie lassen sich die skizzierten Entwürfe in den
realen Raum transferieren?
- Konzepte zur Übersetzung der Anordnung und der Bewegungsprinzipien in
eine räumlich-physische Umgebung (z.B. Hausfassade).

4. Technischer Prototyp: Wie funktioniert ein einzelner Baustein im
Detail?
- Prototypenhafte Entwicklung einzelner Mechanik- und Elektronikbausteine welche von einem Mikrokontroller angesteuert werden.

==Topics==
* [[/tba1/]]
* [[/tba2/]]

==Admission requirements==
k.A.

==Registration procedure==
Please send your application by email with the Subject ''{{PAGENAME}}'' to: martin.schied@uni-weimar.de
* Name, Surname
* program and semester (Studienprogramm und Fachsemester)
* matriculation number (Matrikelnummer)
* Angabe der geltenden Prüfungsordnung
* Valid email address @uni-weimar.de (no other mailing addresses will be accepted) [[SCC-Services#E-Mail|Why?]]
Sollte es mehr als 15 Bewerber geben, entscheidet die Reihenfolge der Anmeldungen über die Aufnahme in den Kurs

==Evaluation==
Active participation, presentation, documentation.

==Eligible participants==
Graduates enrolled in the Faculties of Media, Gestaltung and in the MediaArchitecture program

== Email List ==

Register for the [http://mg.medien.uni-weimar.de/mailman/listinfo/pixels pixels mailinglist]

== Participants ==

=== Workgroups ===

{| class="wikitable"
|+Group A
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group B
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group C
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group D
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group E
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

{| class="wikitable"
|+Group F
! Name
! Email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|-
| Your name
| Your email
|}

==Syllabus==

The classes will be held every second Week, detailed Schedule will be listed below soon:

=== 17.10. - INTRODUCTION MEETING ===

* Introduction
** Short self introduction
** Examples of different pixel projects
** What? Why? How?
** What you will learn in this class
* Questionnaire: What (technical) knowledge and experience do you have about programming and electronics? What do you want to learn?
* Installing Processing
* Mailingliste, Wiki, etc.
* Reading list & (online) resources
* Processing Introduction
** P01 ShapesAndRelations
** P02 CustomFunctions

=== 07.11. - PIXELS, PATTERNS, RULES ===

''What is a single pixel capable of and how are pixels perceived in larger formations? What can be used as a pixel? Generative Design of Patterns and repeating structures. Experimental systems are done using the well known "Processing" environment.''

* Review of Assignment I

=== 14.11. - GRID, LAYOUT, DISTRIBUTION, STRUCTURE ===

* Possible strategies:
** Formulate a (static) grid system
** Generate structures by dynamic parameters
** Using external images or structured data

=== 28.11. - MOTION, CHOREOGRAPHY, STORIES ===

''What can be done with the developed Systems? How can you represent movements and patterns in a digital system? Concepts to animate the structures and systems are developed.''

* Principle: Using software to prototype motion and behaviour and use the very same system (or parts thereof) to control the movement of the physical installation (authoring system)

Strategies: * Create animations by parameters * Environments / Systems (physics simulations, particle systems) * Using images / video as source

=== 12.12. - GETTING PHYSICAL ===

* Methods and strategies to transfer the digital prototyped concepts to a real object / mechanism
* What to translate and how?
* Electronics introduction and Arduino
* Developing simple mechanical structures and principles

=== 9.1. - PROTOTYPING ===

=== 23.1. - PROTOTYPING, FINALIZING ===

=== 6.2. - PRESENTATION & DOCUMENTATION ===

== Research on existing "Pixel" Projects ==

Upload your findings with a short description and a link to this page:

'''[[/ResearchPixelProjects/]]'''

== Processing Code Examples ==

All code examples which were demonstrated during the class meetings are listed on this subpage:

'''[[/ProcessingSketches/]]'''

== Assignments ==

=== ASSIGNMENT 1 - 17.10.2014 ===
''' ''"Create three different patterns on paper and formulate these in code with properties using processing "'' '''

Upload your image and code sketches to the wiki here: '''[[/Patterns/]]'''

==Literature==

* Joshua Noble: Programming Interactivity, O’Reilly, ISBN 978-0596154141
* Casey Reas und Ben Fry: Processing, Mit Press, ISBN 978-0262182621

==Links==

tba.

[[Category:Frederic Gmeiner]]
[[Category:Martin Schied]]
[[Category:Physical Computing]]
[[Category:Processing]]
[[Category:Programming]]
[[Category:WS14]]
[[Category:Werkmodul]]
[[Category:Fachmodul]]
[[Category:Interface Design]]

IFD:All Hail The Pixels

2014-10-27T21:39:55Z

Frederic Gmeiner: /* Processing Code Examples */

Werkmodul/Fachmodul/[[:Category:Fachmodul|Fachmodul]][[:Category:Werkmodul|Werkmodul]]<br />
''Lecturer(s):'' [[Martin Schied]],[[Frederic Gmeiner]]<br />
''Credits:'' 6 [[ECTS]], 4 [[SWS]]<br />
''Date:'' Every Second Friday (Schedule TBA), 13:30 until 20:30 h <br />
''Venue:'' [[Marienstraße 7b]], Room 105<br />
''First meeting:'' 17.10.2014

==Description==

'''All hail the Pixels!'''

Square pixels, round pixels, megapixels, microcropixels. Pixel clowds
and pixel clowns. Hot pixels, cold pixels, dead pixels and their funerals.

The pixelized physical computing course focuses on all kind of elements
that can be used or seen as pixels - be it in Architecture on facades,
interior design elements, street lighths or in an experimental display.
The course focuses on the prototyping of content displayable on pixels
and the realization aspect of pixel based systems.

the course is divided into 4 megapixels:

1. Grids and Pixels - What is a single pixel capable of and how are
pixels perceived in larger formations? What can be used as a pixel?
Generative Design of Patterns and repeating structures. Experimental
systems are done using the well known "Processing" environment.

2. Choreography - What can be done with the developed Systems? How can
you represent movements and patterns in a digital system? Concepts to
animate the structures and systems are developed.

3. Spacial aspects and realizations. How to transfer digitally
prototyped concepts to a real object, e.g. a Building's Facade.

4. Technical Prototype. How does an individual (Pix)Element work in
detail? Build one element as a physical working prototype. We will use
the Arduino environment and popular electromechanical components to make
them.

The class is held by Frederic Gmeiner from Design Studio FELD and Martin Schied.

===German description===

Pixelbasiertes Gestalten und Grundlagen des Physical Computings.
Im Laufe des Semesters werden wir 4 Projektphasen durchlaufen:

1. Raster: Was kann ein einzelnes Modul/Pixel/Baustein? Wie verhalten
sich viele im Zusammenspiel?
- Entwurf von generativen visuellen Mustern und repetitiven Strukturen
mit der Programmierungsumgebung "Processing"

2. Choreographie: Was kann mit den einzelnen Systemen dargestellt werden?
- Formulierung von Bewegungsabläufen (Choreographien) und Ausprobieren
unterschiedlicher Strategien für die Animation der entwickelten Muster
und Strukturen.

3. Räumliche Umsetzung: Wie lassen sich die skizzierten Entwürfe in den
realen Raum transferieren?
- Konzepte zur Übersetzung der Anordnung und der Bewegungsprinzipien in
eine räumlich-physische Umgebung (z.B. Hausfassade).

4. Technischer Prototyp: Wie funktioniert ein einzelner Baustein im
Detail?
- Prototypenhafte Entwicklung einzelner Mechanik- und Elektronikbausteine welche von einem Mikrokontroller angesteuert werden.

==Topics==
* [[/tba1/]]
* [[/tba2/]]

==Admission requirements==
k.A.

==Registration procedure==
Please send your application by email with the Subject ''{{PAGENAME}}'' to: martin.schied@uni-weimar.de
* Name, Surname
* program and semester (Studienprogramm und Fachsemester)
* matriculation number (Matrikelnummer)
* Angabe der geltenden Prüfungsordnung
* Valid email address @uni-weimar.de (no other mailing addresses will be accepted) [[SCC-Services#E-Mail|Why?]]
Sollte es mehr als 15 Bewerber geben, entscheidet die Reihenfolge der Anmeldungen über die Aufnahme in den Kurs

==Evaluation==
Active participation, presentation, documentation.

==Eligible participants==
Graduates enrolled in the Faculties of Media, Gestaltung and in the MediaArchitecture program

== Email List ==

Register for the [http://mg.medien.uni-weimar.de/mailman/listinfo/pixels pixels mailinglist]

==Syllabus==

The classes will be held every second Week, detailed Schedule will be listed below soon:

=== 17.10. - INTRODUCTION MEETING ===

* Introduction
** Short self introduction
** Examples of different pixel projects
** What? Why? How?
** What you will learn in this class
* Questionnaire: What (technical) knowledge and experience do you have about programming and electronics? What do you want to learn?
* Installing Processing
* Mailingliste, Wiki, etc.
* Reading list & (online) resources
* Processing Introduction
** P01 ShapesAndRelations
** P02 CustomFunctions

=== 07.11. - PIXELS, PATTERNS, RULES ===

''What is a single pixel capable of and how are pixels perceived in larger formations? What can be used as a pixel? Generative Design of Patterns and repeating structures. Experimental systems are done using the well known "Processing" environment.''

* Review of Assignment I

=== 14.11. - GRID, LAYOUT, DISTRIBUTION, STRUCTURE ===

* Possible strategies:
** Formulate a (static) grid system
** Generate structures by dynamic parameters
** Using external images or structured data

=== 28.11. - MOTION, CHOREOGRAPHY, STORIES ===

''What can be done with the developed Systems? How can you represent movements and patterns in a digital system? Concepts to animate the structures and systems are developed.''

* Principle: Using software to prototype motion and behaviour and use the very same system (or parts thereof) to control the movement of the physical installation (authoring system)

Strategies: * Create animations by parameters * Environments / Systems (physics simulations, particle systems) * Using images / video as source

=== 12.12. - GETTING PHYSICAL ===

* Methods and strategies to transfer the digital prototyped concepts to a real object / mechanism
* What to translate and how?
* Electronics introduction and Arduino
* Developing simple mechanical structures and principles

=== 9.1. - PROTOTYPING ===

=== 23.1. - PROTOTYPING, FINALIZING ===

=== 6.2. - PRESENTATION & DOCUMENTATION ===

== Research on existing "Pixel" Projects ==

Upload your findings with a short description and a link to this page:

'''[[/ResearchPixelProjects/]]'''

== Processing Code Examples ==

All code examples which were demonstrated during the class meetings are listed on this subpage:

'''[[/ProcessingSketches/]]'''

== Assignments ==

=== ASSIGNMENT 1 - 17.10.2014 ===
''' ''"Create three different patterns on paper and formulate these in code with properties using processing "'' '''

Upload your image and code sketches to the wiki here: '''[[/Patterns/]]'''

==Literature==

* Joshua Noble: Programming Interactivity, O’Reilly, ISBN 978-0596154141
* Casey Reas und Ben Fry: Processing, Mit Press, ISBN 978-0262182621

==Links==

tba.

[[Category:Frederic Gmeiner]]
[[Category:Martin Schied]]
[[Category:Physical Computing]]
[[Category:Processing]]
[[Category:Programming]]
[[Category:WS14]]
[[Category:Werkmodul]]
[[Category:Fachmodul]]
[[Category:Interface Design]]

IFD:All Hail The Pixels

2014-10-27T21:39:40Z

Frederic Gmeiner: /* Processing Code Examples */

Werkmodul/Fachmodul/[[:Category:Fachmodul|Fachmodul]][[:Category:Werkmodul|Werkmodul]]<br />
''Lecturer(s):'' [[Martin Schied]],[[Frederic Gmeiner]]<br />
''Credits:'' 6 [[ECTS]], 4 [[SWS]]<br />
''Date:'' Every Second Friday (Schedule TBA), 13:30 until 20:30 h <br />
''Venue:'' [[Marienstraße 7b]], Room 105<br />
''First meeting:'' 17.10.2014

==Description==

'''All hail the Pixels!'''

Square pixels, round pixels, megapixels, microcropixels. Pixel clowds
and pixel clowns. Hot pixels, cold pixels, dead pixels and their funerals.

The pixelized physical computing course focuses on all kind of elements
that can be used or seen as pixels - be it in Architecture on facades,
interior design elements, street lighths or in an experimental display.
The course focuses on the prototyping of content displayable on pixels
and the realization aspect of pixel based systems.

the course is divided into 4 megapixels:

1. Grids and Pixels - What is a single pixel capable of and how are
pixels perceived in larger formations? What can be used as a pixel?
Generative Design of Patterns and repeating structures. Experimental
systems are done using the well known "Processing" environment.

2. Choreography - What can be done with the developed Systems? How can
you represent movements and patterns in a digital system? Concepts to
animate the structures and systems are developed.

3. Spacial aspects and realizations. How to transfer digitally
prototyped concepts to a real object, e.g. a Building's Facade.

4. Technical Prototype. How does an individual (Pix)Element work in
detail? Build one element as a physical working prototype. We will use
the Arduino environment and popular electromechanical components to make
them.

The class is held by Frederic Gmeiner from Design Studio FELD and Martin Schied.

===German description===

Pixelbasiertes Gestalten und Grundlagen des Physical Computings.
Im Laufe des Semesters werden wir 4 Projektphasen durchlaufen:

1. Raster: Was kann ein einzelnes Modul/Pixel/Baustein? Wie verhalten
sich viele im Zusammenspiel?
- Entwurf von generativen visuellen Mustern und repetitiven Strukturen
mit der Programmierungsumgebung "Processing"

2. Choreographie: Was kann mit den einzelnen Systemen dargestellt werden?
- Formulierung von Bewegungsabläufen (Choreographien) und Ausprobieren
unterschiedlicher Strategien für die Animation der entwickelten Muster
und Strukturen.

3. Räumliche Umsetzung: Wie lassen sich die skizzierten Entwürfe in den
realen Raum transferieren?
- Konzepte zur Übersetzung der Anordnung und der Bewegungsprinzipien in
eine räumlich-physische Umgebung (z.B. Hausfassade).

4. Technischer Prototyp: Wie funktioniert ein einzelner Baustein im
Detail?
- Prototypenhafte Entwicklung einzelner Mechanik- und Elektronikbausteine welche von einem Mikrokontroller angesteuert werden.

==Topics==
* [[/tba1/]]
* [[/tba2/]]

==Admission requirements==
k.A.

==Registration procedure==
Please send your application by email with the Subject ''{{PAGENAME}}'' to: martin.schied@uni-weimar.de
* Name, Surname
* program and semester (Studienprogramm und Fachsemester)
* matriculation number (Matrikelnummer)
* Angabe der geltenden Prüfungsordnung
* Valid email address @uni-weimar.de (no other mailing addresses will be accepted) [[SCC-Services#E-Mail|Why?]]
Sollte es mehr als 15 Bewerber geben, entscheidet die Reihenfolge der Anmeldungen über die Aufnahme in den Kurs

==Evaluation==
Active participation, presentation, documentation.

==Eligible participants==
Graduates enrolled in the Faculties of Media, Gestaltung and in the MediaArchitecture program

== Email List ==

Register for the [http://mg.medien.uni-weimar.de/mailman/listinfo/pixels pixels mailinglist]

==Syllabus==

The classes will be held every second Week, detailed Schedule will be listed below soon:

=== 17.10. - INTRODUCTION MEETING ===

* Introduction
** Short self introduction
** Examples of different pixel projects
** What? Why? How?
** What you will learn in this class
* Questionnaire: What (technical) knowledge and experience do you have about programming and electronics? What do you want to learn?
* Installing Processing
* Mailingliste, Wiki, etc.
* Reading list & (online) resources
* Processing Introduction
** P01 ShapesAndRelations
** P02 CustomFunctions

=== 07.11. - PIXELS, PATTERNS, RULES ===

''What is a single pixel capable of and how are pixels perceived in larger formations? What can be used as a pixel? Generative Design of Patterns and repeating structures. Experimental systems are done using the well known "Processing" environment.''

* Review of Assignment I

=== 14.11. - GRID, LAYOUT, DISTRIBUTION, STRUCTURE ===

* Possible strategies:
** Formulate a (static) grid system
** Generate structures by dynamic parameters
** Using external images or structured data

=== 28.11. - MOTION, CHOREOGRAPHY, STORIES ===

''What can be done with the developed Systems? How can you represent movements and patterns in a digital system? Concepts to animate the structures and systems are developed.''

* Principle: Using software to prototype motion and behaviour and use the very same system (or parts thereof) to control the movement of the physical installation (authoring system)

Strategies: * Create animations by parameters * Environments / Systems (physics simulations, particle systems) * Using images / video as source

=== 12.12. - GETTING PHYSICAL ===

* Methods and strategies to transfer the digital prototyped concepts to a real object / mechanism
* What to translate and how?
* Electronics introduction and Arduino
* Developing simple mechanical structures and principles

=== 9.1. - PROTOTYPING ===

=== 23.1. - PROTOTYPING, FINALIZING ===

=== 6.2. - PRESENTATION & DOCUMENTATION ===

== Research on existing "Pixel" Projects ==

Upload your findings with a short description and a link to this page:

'''[[/ResearchPixelProjects/]]'''

== Processing Code Examples ==

All code examples which were demonstrated during the class meetings are listed on this subpage:
'''[[/ProcessingSketches/]]'''

== Assignments ==

=== ASSIGNMENT 1 - 17.10.2014 ===
''' ''"Create three different patterns on paper and formulate these in code with properties using processing "'' '''

Upload your image and code sketches to the wiki here: '''[[/Patterns/]]'''

==Literature==

* Joshua Noble: Programming Interactivity, O’Reilly, ISBN 978-0596154141
* Casey Reas und Ben Fry: Processing, Mit Press, ISBN 978-0262182621

==Links==

tba.

[[Category:Frederic Gmeiner]]
[[Category:Martin Schied]]
[[Category:Physical Computing]]
[[Category:Processing]]
[[Category:Programming]]
[[Category:WS14]]
[[Category:Werkmodul]]
[[Category:Fachmodul]]
[[Category:Interface Design]]

IFD:All Hail The Pixels/Patterns

2014-10-17T22:15:46Z

Frederic Gmeiner: Created page with "==ASSIGNMENT 1== ''' '' "Create three different patterns on paper and formulate these in code with properties using processing" '' ''' Please paste your images and processing s..."

==ASSIGNMENT 1==

''' '' "Create three different patterns on paper and formulate these in code with properties using processing" '' '''

Please paste your images and processing sketches below:

=== YOUR NAME ===

* Pattern A
* Pattern B
* Pattern C

IFD:All Hail The Pixels/ProcessingSketches

2014-10-17T22:11:58Z

Frederic Gmeiner: Created page with "== 17.10.2011 Processing sketches == === P01 Shapes and Relations === <source lang="java"> /* P01 Shapes and Relations This example illustrates how to formulate properties ..."

== 17.10.2011 Processing sketches ==

=== P01 Shapes and Relations ===

<source lang="java">
/*
P01 Shapes and Relations

This example illustrates how to formulate properties in relation to each other.
Also the following principles are introduced:
- Usage of the setup() and draw() functions
- Drawing of basic shapes and colors
- Definition and usage of variables > dimension, halfDimension and border
- Dynamic mouse input to influence the state of the programm during runtime
- Output values to the console with print() and println()
*/

void setup() {
// set the canvas size
size(1000, 600);
}

void draw() {

// set background color to white
background(255);
// no fill color
noFill();

// variable for the size of the rectangle and the ellipse
float dimension = mouseX;
// variable for the distance between the red lines and the center shapes
float border = mouseY * 0.2;

// set the stroke color to black
stroke(0);

// use the center as origin when drawing rectangles
rectMode(CENTER);

// draw a rectangle on the left side of the canvas with varaible dimensions
rect(250, 300, dimension, dimension);
// draw a circle on the right side of the canvas with varaible dimensions
ellipse(750, 300, dimension, dimension);

// calculate and store half of the current dimension (for better readability)
float halfDimension = dimension * 0.5;
stroke(255, 0, 0);
// draw the two lines according to the dimension of the shapes and the vertical border
line(250 - halfDimension, 300 - halfDimension - border, 750 + halfDimension, 300 - halfDimension - border);
line(250 - halfDimension, 300 + halfDimension + border, 750 + halfDimension, 300 + halfDimension + border);

// output the actual dimension and border values to the console
print("dimension:");
println(dimension);

print("border:");
println(border);
}

</source>
<br /><br />

=== P02 Custom Functions ===

<source lang="java">
/*
P02 Custom functions and transformations

This example shows how to write custom functions and how to use the
transform() and the rotate() statements to move and rotate the canvas.
It also illustrates the possibility to store and restore a certain
transformation state with pushMatrix() and popMatrix().
*/

void setup(){

size(1000,600);
background(0);

// move to the center of the canvas
translate(width * 0.5, height * 0.5);
// draw an arrow and a cross with the size of 10 pixels
arrow();
crossShape(10);

// store the actual position (in this case the center of the stage)
pushMatrix();

// move 200 pixels to the right from the canvas center
translate(200, 0);
// rotate the canvas by 60 degrees
rotate( radians(60) );
// draw an arrow and a cross to this new rotated location
arrow();
crossShape(10);

// recall the previously stored position (the center of the
// canvas which was done using the pushMatrix() statement)
popMatrix();

// move 100 pixels down from the center of the canvas
translate(0,100);
arrow();
crossShape(10);

}

// Define a new function which draws a red arrow to the actual origin of the canvas
void arrow(){
stroke(255,0,0);
line(0,0,50,0);
line(45,-5,50,0);
line(45,5,50,0);
}

// Define a new function which draws a black cross depending on the passed parameter "dimension"
void crossShape(float dimension){
float halfDimension = dimension * 0.5;
stroke(255);
line(-halfDimension, -halfDimension, halfDimension, halfDimension );
line( halfDimension, -halfDimension, -halfDimension, halfDimension);
}

</source>
<br /><br />

IFD:All Hail The Pixels

2014-10-17T22:07:42Z

Frederic Gmeiner: /* Syllabus */

Werkmodul/Fachmodul/[[:Category:Fachmodul|Fachmodul]][[:Category:Werkmodul|Werkmodul]]<br />
''Lecturer(s):'' [[Martin Schied]],[[Frederic Gmeiner]]<br />
''Credits:'' 6 [[ECTS]], 4 [[SWS]]<br />
''Date:'' Every Second Friday (Schedule TBA), 13:30 until 20:30 h <br />
''Venue:'' [[Marienstraße 7b]], Room 105<br />
''First meeting:'' 17.10.2014

==Description==

'''All hail the Pixels!'''

Square pixels, round pixels, megapixels, microcropixels. Pixel clowds
and pixel clowns. Hot pixels, cold pixels, dead pixels and their funerals.

The pixelized physical computing course focuses on all kind of elements
that can be used or seen as pixels - be it in Architecture on facades,
interior design elements, street lighths or in an experimental display.
The course focuses on the prototyping of content displayable on pixels
and the realization aspect of pixel based systems.

the course is divided into 4 megapixels:

1. Grids and Pixels - What is a single pixel capable of and how are
pixels perceived in larger formations? What can be used as a pixel?
Generative Design of Patterns and repeating structures. Experimental
systems are done using the well known "Processing" environment.

2. Choreography - What can be done with the developed Systems? How can
you represent movements and patterns in a digital system? Concepts to
animate the structures and systems are developed.

3. Spacial aspects and realizations. How to transfer digitally
prototyped concepts to a real object, e.g. a Building's Facade.

4. Technical Prototype. How does an individual (Pix)Element work in
detail? Build one element as a physical working prototype. We will use
the Arduino environment and popular electromechanical components to make
them.

The class is held by Frederic Gmeiner from Design Studio FELD and Martin Schied.

===German description===

Pixelbasiertes Gestalten und Grundlagen des Physical Computings.
Im Laufe des Semesters werden wir 4 Projektphasen durchlaufen:

1. Raster: Was kann ein einzelnes Modul/Pixel/Baustein? Wie verhalten
sich viele im Zusammenspiel?
- Entwurf von generativen visuellen Mustern und repetitiven Strukturen
mit der Programmierungsumgebung "Processing"

2. Choreographie: Was kann mit den einzelnen Systemen dargestellt werden?
- Formulierung von Bewegungsabläufen (Choreographien) und Ausprobieren
unterschiedlicher Strategien für die Animation der entwickelten Muster
und Strukturen.

3. Räumliche Umsetzung: Wie lassen sich die skizzierten Entwürfe in den
realen Raum transferieren?
- Konzepte zur Übersetzung der Anordnung und der Bewegungsprinzipien in
eine räumlich-physische Umgebung (z.B. Hausfassade).

4. Technischer Prototyp: Wie funktioniert ein einzelner Baustein im
Detail?
- Prototypenhafte Entwicklung einzelner Mechanik- und Elektronikbausteine welche von einem Mikrokontroller angesteuert werden.

==Topics==
* [[/tba1/]]
* [[/tba2/]]

==Admission requirements==
k.A.

==Registration procedure==
Please send your application by email with the Subject ''{{PAGENAME}}'' to: martin.schied@uni-weimar.de
* Name, Surname
* program and semester (Studienprogramm und Fachsemester)
* matriculation number (Matrikelnummer)
* Angabe der geltenden Prüfungsordnung
* Valid email address @uni-weimar.de (no other mailing addresses will be accepted) [[SCC-Services#E-Mail|Why?]]
Sollte es mehr als 15 Bewerber geben, entscheidet die Reihenfolge der Anmeldungen über die Aufnahme in den Kurs

==Evaluation==
Active participation, presentation, documentation.

==Eligible participants==
Graduates enrolled in the Faculties of Media, Gestaltung and in the MediaArchitecture program

== Email List ==

Register for the [http://mg.medien.uni-weimar.de/mailman/listinfo/pixels pixels mailinglist]

==Syllabus==

The classes will be held every second Week, detailed Schedule will be listed below soon:

=== 17.10. - INTRODUCTION MEETING ===

* Introduction
** Short self introduction
** Examples of different pixel projects
** What? Why? How?
** What you will learn in this class
* Questionnaire: What (technical) knowledge and experience do you have about programming and electronics? What do you want to learn?
* Installing Processing
* Mailingliste, Wiki, etc.
* Reading list & (online) resources
* Processing Introduction
** P01 ShapesAndRelations
** P02 CustomFunctions

=== 07.11. - PIXELS, PATTERNS, RULES ===

''What is a single pixel capable of and how are pixels perceived in larger formations? What can be used as a pixel? Generative Design of Patterns and repeating structures. Experimental systems are done using the well known "Processing" environment.''

* Review of Assignment I

=== 14.11. - GRID, LAYOUT, DISTRIBUTION, STRUCTURE ===

* Possible strategies:
** Formulate a (static) grid system
** Generate structures by dynamic parameters
** Using external images or structured data

=== 28.11. - MOTION, CHOREOGRAPHY, STORIES ===

''What can be done with the developed Systems? How can you represent movements and patterns in a digital system? Concepts to animate the structures and systems are developed.''

* Principle: Using software to prototype motion and behaviour and use the very same system (or parts thereof) to control the movement of the physical installation (authoring system)

Strategies: * Create animations by parameters * Environments / Systems (physics simulations, particle systems) * Using images / video as source

=== 12.12. - GETTING PHYSICAL ===

* Methods and strategies to transfer the digital prototyped concepts to a real object / mechanism
* What to translate and how?
* Electronics introduction and Arduino
* Developing simple mechanical structures and principles

=== 9.1. - PROTOTYPING ===

=== 23.1. - PROTOTYPING, FINALIZING ===

=== 6.2. - PRESENTATION & DOCUMENTATION ===

== Research on existing "Pixel" Projects ==

Upload your findings with a short description and a link to this page:

'''[[/ResearchPixelProjects/]]'''

== Processing Code Examples ==

Research on the topic of alternative pixels and displays:
'''[[/ProcessingSketches/]]'''

== Assignments ==

=== ASSIGNMENT 1 - 17.10.2014 ===
''' ''"Create three different patterns on paper and formulate these in code with properties using processing "'' '''

Upload your image and code sketches to the wiki here: '''[[/Patterns/]]'''

==Literature==

* Joshua Noble: Programming Interactivity, O’Reilly, ISBN 978-0596154141
* Casey Reas und Ben Fry: Processing, Mit Press, ISBN 978-0262182621

==Links==

tba.

[[Category:Frederic Gmeiner]]
[[Category:Martin Schied]]
[[Category:Physical Computing]]
[[Category:Processing]]
[[Category:Programming]]
[[Category:WS14]]
[[Category:Werkmodul]]
[[Category:Fachmodul]]
[[Category:Interface Design]]

IFD:All Hail The Pixels

2014-10-17T22:02:44Z

Frederic Gmeiner: /* ASSIGNMENT 1 */

IFD:All Hail The Pixels

2014-10-17T22:02:21Z

Frederic Gmeiner: /* ASSIGNMENT 1 */

IFD:All Hail The Pixels

2014-10-17T22:02:01Z

Frederic Gmeiner: /* ASSIGNMENT 1 */

IFD:All Hail The Pixels

2014-10-17T22:01:40Z

Frederic Gmeiner: /* Literature */

IFD:All Hail The Pixels

2014-10-17T22:00:26Z

Frederic Gmeiner: /* Research on existing "Pixel" Projects */

IFD:All Hail The Pixels

2014-10-17T21:59:29Z

Frederic Gmeiner: /* Processing Code Examples */

IFD:All Hail The Pixels

2014-10-17T21:59:18Z

Frederic Gmeiner: /* ASSIGNMENT 1 */

IFD:All Hail The Pixels

2014-10-17T21:58:01Z

Frederic Gmeiner: /* Research on existing "Pixel" Projects */

IFD:All Hail The Pixels/ResearchPixelProjects

2014-10-17T21:54:42Z

Frederic Gmeiner: added example projects

== Introduction Presentation ==

* MECHANICAL MIRRORS by Daniel Rozin

* WIND DRIVEN FACADES by Ned Kahn Studios

* 3D DISPLAY CUBE by James Clar

* BLINKENLIGHTS by CCC

* BIX SPOTS by REALITIES:UNITED

* KINETIC SCULPTURES by ART+COM

* BIT.FALL by Julius Popp

* FERROFLUID SCULPTURES by Sachiko Kodama

* HYPERMATRIX by Jonpasang

* CLOUD by Troika

* PIXEL TRACK by Berg

* PAPER PIXELS by Aram Bartholl

* LEGO PIXELS - FELL IN LOVE WITH A GIRL by Michel Gondry

* LUMINOUS SCULPTURE by FELD

== YOUR NAME ==

* Project 1
* Project 2

IFD:All Hail The Pixels

2014-10-17T21:50:35Z

Frederic Gmeiner: Added research subpage link

IFD:All Hail The Pixels

2014-10-17T13:46:58Z

Frederic Gmeiner: /* Email List */ removed https

IFD:All Hail The Pixels

2014-10-17T13:46:30Z

Frederic Gmeiner:

IFD:All Hail The Pixels

2014-09-26T13:33:37Z

Frederic Gmeiner: Termine hinzugefügt

IFD:Showreel2012

2012-07-13T09:04:07Z

Frederic Gmeiner:

[[File:20120626_IFD-Showreel2012.png|422px]]

<h3 style="color:#FF5D00;">INFOS</h3>
'''Präsentation Sommersemester 2012'''<br>
Professur Interface Design<br>
Prof. Dr. Jens Geelhaar, Frederic Gmeiner, Michael Markert, Gabriel Rausch, Martin Schied,

'''13. Juli 2012'''
'''11:00 - 17:00 Uhr'''<br>
'''Audimax'''<br>
Steubenstraße 6, Haus F

Die Präsentation der Professur Interface Design bietet die Möglichkeit,<br> einen Einblick in die Semesterarbeiten und die Inhalte der angebotenen Module zu<br> bekommen. Die Veranstaltung lädt nicht nur Studenten des Bereichs IFD <br>ein, sondern ist offen für alle Interessierten.

<h3 style="color:#FF5D00;">PROGRAMM</h3>

'''11:00 - 12:00 Block "Fach- und Werkmodule"'''

* Fachmodul '[[IFD:iOSDevI|iOS Development I]]'
** [[/Michael Markert - iOSDev I 2012/]]
* Fachmodul '[[IFD:Interaktive Elektronik 2012]]'
* Werkmodul ‘[[IFD:Elektrische_Gehirnwellengymnastik|Elektrische Gehirnwellengymnastik]]‘
** [[/Martin Schied - Zusammenfassung/]]
* Werkmodul/Fachmodul '[[IFD:WebAdvancedII|WebAdvanced II]]'
** [[/Gabriel Rausch - Web Advanced II/]]
* Werkmodul ‘[[IFD:WebBasicsII|Web Basics II]]‘
** [[/Gabriel Rausch - Web Basics II/]]
* Werkmodul ‘[[IFD:BauhausVorkurs2012|Bauhaus Vorkurs]]‘
** [[/Michael Markert - BauhausVorkurs2012/]]
* Werkmodul ‘[[Roter_Button|Roter Button oben links, grüner Button unten rechts]]‘
* Werkmodul ‘[[IFD:WizardOfOz|The Wizard of Oz: Mock-ups & prototyping]]‘
** [[/Frederic Gmeiner - Zusammenfassung/]]

'''12:00 - 14:00 Block "Projektmodule"'''

* Projektmodul 'Interface Design 2 / Interaktion mit mobilen Medien: „Guides & Games“ '
** [[/Stepan Boldt/]]
** [[/Marisa Martins, Sofia Barbosa - Multilanguage for european kids/]]
** [[/Interaktives Weimar Abenteuer - Bokelmann, Danz, Froger, Glahn, Pabsdorf, Wolf/]]
** [[/Tobias Westphal/]]
** [[/Sven Sommerlatte/]]
** [[/Anastasiya Pavelchuk/]]

* Projektmodul 'Interface Design 4 / Interaction and Experimental Interfaces - 30 cm3'

** [[/Irina Yasinskaya, Sandra Guzman - Heart Beat Textile/]]

** [[/Jelena Djokic - I Was Here/]]
** [[/Patawat Phamuad - What you can do with 100 Yen/]]
** [[/Kathy Yuen, Eleni Digidiki, Augusto Gandia, Xin Wang - Smart Blocks/]]
** [[/Jie Wang, Yunshui Jin - Melodic Rope/]]
** [[/Matthias Gmelin und Miriam Kotyrba - Hospital Organisation/]]
** [[/Matias Garcia, Gentian Begolli - Understanding Our Neighbor/]]
** [[/Dianna Mertz - Appropriator/]]
** [[/Adriana Cabrera , Diana Cano - Interactive Surface Design/]]
** [[/Tony Wulfert/]]

'''Schlusswort'''

<h3 style="color:#FF5D00;">Fach- und Werkmodul Arbeiten</h3>
Übersicht der Arbeiten aus Fach- und Werkmodulen. Werden nicht einzeln auf der Veranstaltung vorgestellt

'''Fachmodule'''

* Werkmodul/Fachmodul '[[IFD:WebAdvancedII|WebAdvanced II]]'
** [[/Marisa Martins, Sofia Barbosa - Multilanguage for european kids/]]
** [[/Iain Campbell - Dhound (Event Manager)/]]
** [[/Johannes Altmann/]]
** [[/Antje Danz/]]
** [[/Marcel Döpel - Web RPG/]]
** [[/Michel Büchner - Web RPG/]]
** [[/Martin Horbach/]]
** [[/Bastian Weber - VirtualGuitar/]]
** [[/Georg Müller/]]
** [[/Sven Sommerlatte/]]
** [[/Tobias Westphal/]]
** [[/Mariana Perfeito/]]
** [[/Claudia Heinze/]]
** [[/Kathy Yuen/]]
** [[/Ivo Santos/]]
** [[/Garcia Matias/]]
** [[/Augusto Gawdia/]]
** [[/Carlo Enke/]]
** [[/Jennifer Beckmann/]]
** [[/Christian Sohn/]]
** [[/Dianna Mertz - Appropriator Web/]]
** [[/Diana Cano/]]

* Fachmodul '[[IFD:iOSDevI|iOS Development I]]'
** [[/Tobias Wolf – Mediathek/]]
** [[/Juliane Reschke - iDecider/]]
** [[/Christoph Halang/]]
** [[/Fariborz Farid/]]
** [[/Iain Campbell - Solar Monitor/]]
** [[/Dianna Mertz - Appropriator iOS/]]
** [[/Jelena Djokic - I was here- iOS/]]
** [[/Adriana Cabrera/]]



'''Werkmodule'''

* Werkmodul ‘[[IFD:WebBasicsII|Web Basics II]]‘
** [[/Joatan Preis Dutra/]]
** [[/Florian Froger/]]
** [[/Constantin Oestreich/]]
** [[/Hannes Wünsche/]]
** [[/Lukas Krause/]]
** [[/Ingo Schäfer/]]
** [[/Laura Jozefini/]]
** [[/Monika Schwarz/]]
** [[/Theresa Tschenker/]]
** [[/Lydia Kluge/]]
** [[/Anastasiya Pavelchuk - ActiveArts/]]
** [[/Tobias Westphal/]]
** [[/Anja Werner/]]
** [[/Eleni Digidiki/]]
** [[/Stepan Boldt/]]

* Werkmodul ‘[[IFD:BauhausVorkurs2012|Bauhaus Vorkurs]]‘
** [[/Tristan Weis/]]
** [[/Florian Froger/]]
** [[/Philipp Hollinger/]]
** [[/Marius Beine/]]
** [[/Michael Weber/]]
** [[/Daniel Winterberg/]]
** [[/Tobias Wolf/]]
** [[/R W/]]
** [[/Carolin Scheffler/]]

IFD:Showreel2012

2012-07-13T08:24:17Z

Frederic Gmeiner:

[[File:20120626_IFD-Showreel2012.png|422px]]

<h3 style="color:#FF5D00;">INFOS</h3>
'''Präsentation Sommersemester 2012'''<br>
Professur Interface Design<br>
Prof. Dr. Jens Geelhaar, Frederic Gmeiner, Michael Markert, Gabriel Rausch, Martin Schied,

'''13. Juli 2012'''
'''11:00 - 17:00 Uhr'''<br>
'''Audimax'''<br>
Steubenstraße 6, Haus F

Die Präsentation der Professur Interface Design bietet die Möglichkeit,<br> einen Einblick in die Semesterarbeiten und die Inhalte der angebotenen Module zu<br> bekommen. Die Veranstaltung lädt nicht nur Studenten des Bereichs IFD <br>ein, sondern ist offen für alle Interessierten.

<h3 style="color:#FF5D00;">PROGRAMM</h3>

'''11:00 - 12:00 Block "Fach- und Werkmodule"'''

* Fachmodul '[[IFD:iOSDevI|iOS Development I]]'
** [[/Michael Markert - iOSDev I 2012/]]
* Fachmodul '[[IFD:Interaktive Elektronik 2012]]'
* Werkmodul ‘[[IFD:Elektrische_Gehirnwellengymnastik|Elektrische Gehirnwellengymnastik]]‘
** [[/Martin Schied - Zusammenfassung/]]
* Werkmodul/Fachmodul '[[IFD:WebAdvancedII|WebAdvanced II]]'
** [[/Gabriel Rausch - Web Advanced II/]]
* Werkmodul ‘[[IFD:WebBasicsII|Web Basics II]]‘
** [[/Gabriel Rausch - Web Basics II/]]
* Werkmodul ‘[[IFD:BauhausVorkurs2012|Bauhaus Vorkurs]]‘
** [[/Michael Markert - BauhausVorkurs2012/]]
* Werkmodul ‘[[IFD:WizardOfOz|The Wizard of Oz: Mock-ups & prototyping]]‘
** [[/Frederic Gmeiner - Zusammenfassung/]]

'''12:00 - 14:00 Block "Projektmodule"'''

* Projektmodul 'Interface Design 2 / Interaktion mit mobilen Medien: „Guides & Games“ '
** [[/Stepan Boldt/]]
** [[/Marisa Martins, Sofia Barbosa - Multilanguage for european kids/]]
** [[/Interaktives Weimar Abenteuer - Bokelmann, Danz, Froger, Glahn, Pabsdorf, Wolf/]]
** [[/Tobias Westphal/]]
** [[/Sven Sommerlatte/]]
** [[/Anastasiya Pavelchuk/]]

* Projektmodul 'Interface Design 4 / Interaction and Experimental Interfaces - 30 cm3'

** [[/Irina Yasinskaya, Sandra Guzman - Heart Beat Textile/]]

** [[/Jelena Djokic - I Was Here/]]
** [[/Patawat Phamuad - What you can do with 100 Yen/]]
** [[/Kathy Yuen, Eleni Digidiki, Augusto Gandia, Xin Wang - Smart Blocks/]]
** [[/Matthias Gmelin und Miriam Kotyrba - Hospital Organisation/]]
** [[/Matias Garcia, Gentian Begolli - Understanding Our Neighbor/]]
** [[/Dianna Mertz - Appropriator/]]

'''Schlusswort'''

<h3 style="color:#FF5D00;">Fach- und Werkmodul Arbeiten</h3>
Übersicht der Arbeiten aus Fach- und Werkmodulen. Werden nicht einzeln auf der Veranstaltung vorgestellt

'''Fachmodule'''

* Werkmodul/Fachmodul '[[IFD:WebAdvancedII|WebAdvanced II]]'
** [[/Marisa Martins, Sofia Barbosa - Multilanguage for european kids/]]
** [[/Iain Campbell - Dhound (Event Manager)/]]
** [[/Johannes Altmann/]]
** [[/Antje Danz/]]
** [[/Marcel Döpel - Web RPG/]]
** [[/Michel Büchner - Web RPG/]]
** [[/Martin Horbach/]]
** [[/Bastian Weber - VirtualGuitar/]]
** [[/Georg Müller/]]
** [[/Sven Sommerlatte/]]
** [[/Tobias Westphal/]]
** [[/Mariana Perfeito/]]
** [[/Claudia Heinze/]]
** [[/Kathy Yuen/]]
** [[/Ivo Santos/]]
** [[/Garcia Matias/]]
** [[/Augusto Gawdia/]]
** [[/Carlo Enke/]]
** [[/Jennifer Beckmann/]]
** [[/Christian Sohn/]]
** [[/Dianna Mertz - Appropriator Web/]]
** [[/Diana Cano/]]

* Fachmodul '[[IFD:iOSDevI|iOS Development I]]'
** [[/Tobias Wolf – Mediathek/]]
** [[/Juliane Reschke - iDecider/]]
** [[/Christoph Halang/]]
** [[/Fariborz Farid/]]
** [[/Iain Campbell - Solar Monitor/]]
** [[/Dianna Mertz - Appropriator iOS/]]
** [[/Jelena Djokic - I was here- iOS/]]
** [[/Adriana Cabrera/]]



'''Werkmodule'''

* Werkmodul ‘[[IFD:WebBasicsII|Web Basics II]]‘
** [[/Joatan Preis Dutra/]]
** [[/Florian Froger/]]
** [[/Constantin Oestreich/]]
** [[/Hannes Wünsche/]]
** [[/Lukas Krause/]]
** [[/Ingo Schäfer/]]
** [[/Laura Jozefini/]]
** [[/Monika Schwarz/]]
** [[/Theresa Tschenker/]]
** [[/Lydia Kluge/]]
** [[/Anastasiya Pavelchuk - ActiveArts/]]
** [[/Tobias Westphal/]]
** [[/Anja Werner/]]
** [[/Eleni Digidiki/]]
** [[/Stepan Boldt/]]

* Werkmodul ‘[[IFD:BauhausVorkurs2012|Bauhaus Vorkurs]]‘
** [[/Tristan Weis/]]
** [[/Florian Froger/]]
** [[/Philipp Hollinger/]]
** [[/Marius Beine/]]
** [[/Michael Weber/]]
** [[/Daniel Winterberg/]]
** [[/Tobias Wolf/]]
** [[/R W/]]
** [[/Carolin Scheffler/]]

IFD:Showreel2012

2012-07-13T08:23:17Z

Frederic Gmeiner:

[[File:20120626_IFD-Showreel2012.png|422px]]

<h3 style="color:#FF5D00;">INFOS</h3>
'''Präsentation Sommersemester 2012'''<br>
Professur Interface Design<br>
Prof. Dr. Jens Geelhaar, Frederic Gmeiner, Michael Markert, Gabriel Rausch, Martin Schied,

'''13. Juli 2012'''
'''11:00 - 17:00 Uhr'''<br>
'''Audimax'''<br>
Steubenstraße 6, Haus F

Die Präsentation der Professur Interface Design bietet die Möglichkeit,<br> einen Einblick in die Semesterarbeiten und die Inhalte der angebotenen Module zu<br> bekommen. Die Veranstaltung lädt nicht nur Studenten des Bereichs IFD <br>ein, sondern ist offen für alle Interessierten.

<h3 style="color:#FF5D00;">PROGRAMM</h3>

'''11:00 - 12:00 Block "Fach- und Werkmodule"'''

* Fachmodul '[[IFD:iOSDevI|iOS Development I]]'
** [[/Michael Markert - iOSDev I 2012/]]
* Fachmodul '[[IFD:Interaktive Elektronik 2012]]'
* Werkmodul ‘[[IFD:Elektrische_Gehirnwellengymnastik|Elektrische Gehirnwellengymnastik]]‘
** [[/Martin Schied - Zusammenfassung/]]
* Werkmodul/Fachmodul '[[IFD:WebAdvancedII|WebAdvanced II]]'
** [[/Gabriel Rausch - Web Advanced II/]]
* Werkmodul ‘[[IFD:WebBasicsII|Web Basics II]]‘
** [[/Gabriel Rausch - Web Basics II/]]
* Werkmodul ‘[[IFD:BauhausVorkurs2012|Bauhaus Vorkurs]]‘
** [[/Michael Markert - BauhausVorkurs2012/]]
* Werkmodul ‘[[IFD:WizardOfOz|The Wizard of Oz: Mock-ups & prototyping]]‘
** [[/Frederic Gmeiner - Zusammenfassung/]]

'''12:00 - 14:00 Block "Projektmodule"'''

* Projektmodul 'Interface Design 2 / Interaktion mit mobilen Medien: „Guides & Games“ '
** [[/Stepan Boldt/]]
** [[/Marisa Martins, Sofia Barbosa - Multilanguage for european kids/]]
** [[/Interaktives Weimar Abenteuer - Bokelmann, Danz, Froger, Glahn, Pabsdorf, Wolf/]]
** [[/Constantin Oestreich/]]
** [[/Tobias Westphal/]]
** [[/Carlo Enke/]]
** [[/Sven Sommerlatte/]]
** [[/R W/]]
** [[/Anastasiya Pavelchuk/]]
** [[/Jan Schepanski - Veranstaltungsmanagement/]]

* Projektmodul 'Interface Design 4 / Interaction and Experimental Interfaces - 30 cm3'

** [[/Irina Yasinskaya, Sandra Guzman - Heart Beat Textile/]]


** [[/Jelena Djokic - I Was Here/]]
** [[/Patawat Phamuad - What you can do with 100 Yen/]]

** [[/Kathy Yuen, Eleni Digidiki, Augusto Gandia, Xin Wang - Smart Blocks/]]

** [[/Matthias Gmelin und Miriam Kotyrba - Hospital Organisation/]]

** [[/Matias Garcia, Gentian Begolli - Understanding Our Neighbor/]]
** [[/Dianna Mertz - Appropriator/]]

'''Schlusswort'''

<h3 style="color:#FF5D00;">Fach- und Werkmodul Arbeiten</h3>
Übersicht der Arbeiten aus Fach- und Werkmodulen. Werden nicht einzeln auf der Veranstaltung vorgestellt

'''Fachmodule'''

* Werkmodul/Fachmodul '[[IFD:WebAdvancedII|WebAdvanced II]]'
** [[/Marisa Martins, Sofia Barbosa - Multilanguage for european kids/]]
** [[/Iain Campbell - Dhound (Event Manager)/]]
** [[/Johannes Altmann/]]
** [[/Antje Danz/]]
** [[/Marcel Döpel - Web RPG/]]
** [[/Michel Büchner - Web RPG/]]
** [[/Martin Horbach/]]
** [[/Bastian Weber - VirtualGuitar/]]
** [[/Georg Müller/]]
** [[/Sven Sommerlatte/]]
** [[/Tobias Westphal/]]
** [[/Mariana Perfeito/]]
** [[/Claudia Heinze/]]
** [[/Kathy Yuen/]]
** [[/Ivo Santos/]]
** [[/Garcia Matias/]]
** [[/Augusto Gawdia/]]
** [[/Carlo Enke/]]
** [[/Jennifer Beckmann/]]
** [[/Christian Sohn/]]
** [[/Dianna Mertz - Appropriator Web/]]
** [[/Diana Cano/]]

* Fachmodul '[[IFD:iOSDevI|iOS Development I]]'
** [[/Tobias Wolf – Mediathek/]]
** [[/Juliane Reschke - iDecider/]]
** [[/Christoph Halang/]]
** [[/Fariborz Farid/]]
** [[/Iain Campbell - Solar Monitor/]]
** [[/Dianna Mertz - Appropriator iOS/]]
** [[/Jelena Djokic - I was here- iOS/]]
** [[/Adriana Cabrera/]]



'''Werkmodule'''

* Werkmodul ‘[[IFD:WebBasicsII|Web Basics II]]‘
** [[/Joatan Preis Dutra/]]
** [[/Florian Froger/]]
** [[/Constantin Oestreich/]]
** [[/Hannes Wünsche/]]
** [[/Lukas Krause/]]
** [[/Ingo Schäfer/]]
** [[/Laura Jozefini/]]
** [[/Monika Schwarz/]]
** [[/Theresa Tschenker/]]
** [[/Lydia Kluge/]]
** [[/Anastasiya Pavelchuk - ActiveArts/]]
** [[/Tobias Westphal/]]
** [[/Anja Werner/]]
** [[/Eleni Digidiki/]]
** [[/Stepan Boldt/]]

* Werkmodul ‘[[IFD:BauhausVorkurs2012|Bauhaus Vorkurs]]‘
** [[/Tristan Weis/]]
** [[/Florian Froger/]]
** [[/Philipp Hollinger/]]
** [[/Marius Beine/]]
** [[/Michael Weber/]]
** [[/Daniel Winterberg/]]
** [[/Tobias Wolf/]]
** [[/R W/]]
** [[/Carolin Scheffler/]]

IFD:Showreel2012/Frederic Gmeiner - Zusammenfassung

2012-07-13T08:00:58Z

Frederic Gmeiner:

==Wizard of Oz: Prototypes & Mock-ups==
===Werkmodul IDF SS2012===
====Frederic Gmeiner, frederic.gmeiner@uni-weimar.de====
[[File:WizardOfOz_summary.001.jpg]]
[[File:WizardOfOz_summary.002.jpg]]
[[File:WizardOfOz_summary.003.jpg]]
[[File:WizardOfOz_summary.004.jpg]]
[[File:WizardOfOz_summary.005.jpg]]
[[File:WizardOfOz_summary.006.jpg]]
[[File:WizardOfOz_summary.007.jpg]]
[[File:WizardOfOz_summary.008.jpg]]
[[File:WizardOfOz_summary.009.jpg]]
[[File:WizardOfOz_summary.010.jpg]]
[[File:WizardOfOz_summary.011.jpg]]
[[File:WizardOfOz_summary.012.jpg]]
[[File:WizardOfOz_summary.013.jpg]]
[[File:WizardOfOz_summary.014.jpg]]
[[File:WizardOfOz_summary.015.jpg]]
[[File:WizardOfOz_summary.016.jpg]]
[[File:WizardOfOz_summary.017.jpg]]
[[File:WizardOfOz_summary.018.jpg]]
[[File:WizardOfOz_summary.019.jpg]]
[[File:WizardOfOz_summary.020.jpg]]
[[File:WizardOfOz_summary.021.jpg]]
[[File:WizardOfOz_summary.022.jpg]]
[[File:WizardOfOz_summary.023.jpg]]
[[File:WizardOfOz_summary.024.jpg]]
[[File:WizardOfOz_summary.025.jpg]]
[[File:WizardOfOz_summary.026.jpg]]
[[File:WizardOfOz_summary.027.jpg]]
[[File:WizardOfOz_summary.028.jpg]]
[[File:WizardOfOz_summary.029.jpg]]

http://www.youtube.com/watch?v=7aZJ6PShz0o&feature=youtu.be

IFD:Showreel2012/Frederic Gmeiner - Zusammenfassung

2012-07-12T18:22:44Z

Frederic Gmeiner:

File:WizardOfOz summary.029.jpg

2012-07-12T18:18:17Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.028.jpg

2012-07-12T18:18:01Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.027.jpg

2012-07-12T18:17:48Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.026.jpg

2012-07-12T18:17:31Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.025.jpg

2012-07-12T18:17:13Z

Frederic Gmeiner: uploaded a new version of "File:WizardOfOz summary.025.jpg"

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.024.jpg

2012-07-12T18:16:54Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.025.jpg

2012-07-12T18:16:29Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.023.jpg

2012-07-12T18:16:13Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.022.jpg

2012-07-12T18:15:57Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.021.jpg

2012-07-12T18:15:42Z

Frederic Gmeiner:

== Summary ==

== Copyright status: ==

== Source: ==

File:WizardOfOz summary.020.jpg

2012-07-12T18:15:27Z

Frederic Gmeiner: uploaded a new version of "File:WizardOfOz summary.020.jpg"