27
Prototyping in Code Marcin Ignac / CIID 2011

Prototyping in code

Embed Size (px)

DESCRIPTION

Short presentation I have to IDP2011 students at CIID explaining how I see role of programming in the design process.

Citation preview

Page 1: Prototyping in code

Prototyping in Code

Marcin Ignac / CIID 2011

Page 2: Prototyping in code

Why do we code?

Do we really have to spend hours in front of the screen? For what?

Page 3: Prototyping in code

Interactivity and behavior

Rock is the New Swivel by Eilidh, Ashwin and Tobias

When the chair rocks, the Arduino sends a message via the Xbees to turn on power flow to the coffee machine, thus starting the brewing process. The MP3 player is simultaneously turned on. The result is – soothing music and a merry brew in the making, while the person rocks on!

Page 4: Prototyping in code

Interactivity

Touch Wall by Marcin

Josh enlightened by the wall alfter coming close enough to it.

Yesterday we had a meeting with a client and instead of showing him sketches we spend one day in advance developing an iPad app mockup with simple functionality. Just being able to touch and play catches his imagination much more that a drawing on a piece of paper.

Page 5: Prototyping in code

Interfacing with hardware

Page 6: Prototyping in code

Interfacing with hardware

Compound Eye by Ujjval and Marcin

First hack we did was to put wires into Nikon camera and fire the flash remotely Then two webcamsThen we build these boxes

Page 7: Prototyping in code

Interfacing with hardware

Toast and Jam by Anders, David, Jennifer and Mary

LED + Light sensro detects the type of the bread. The timing knob became the volume control, and the original electro-magnet in the toaster “pops” the toast once the song finishes.

While in the previous project we build and object from scratch this time they repurposed existing object.

Page 8: Prototyping in code

Automation

Virtual Spotlight

We build a system that can draw a different tree for many books and adapt to the content. Doing seperate graphics for every book would be crazy.

Page 9: Prototyping in code

Design Product

Role of programming...

So we have the design / idea / paper prototypes / specification and we want the product.

Page 10: Prototyping in code

Magic

Role of programming...

Design Product

You call the engeenier...Then comes the programmer and does the magic!Magic = Implementation = OMG! 10000 LOC (lines of code).After we’re are done we (maybe) do user testing. Yyyyyy...

Page 11: Prototyping in code

?

?

Role of programming in the process

Design Product

You don’t have to build whole program at once to test the idea. Try bit’s and pieces first. By doing small prototypes or sketches you get user input faster and you are able to rethink what you are doing.

Page 12: Prototyping in code

Greetings gestures

On of our first projects at CIID completed during Computational Design course. The idea was to record hand movements of people greeting each other. They were comming from different cultures so the gestures varied a lot.

(Photo by just.Luc / Flickr)

Page 13: Prototyping in code

Wii Remote

Controlling device for Nintendo Wii was an obvious choice. It has bluetooth connection and motion sensors.

Page 14: Prototyping in code

Establishing connection

Implementation.We used DarwiinRemote to connect to the Wii Remote via Bluetooth and record the data.

Page 15: Prototyping in code

Have Fun

Implementation.My first Wii Remote test :) “White brick in space”

Page 16: Prototyping in code

Recording

Try if it’s fun.

Page 17: Prototyping in code

Korea

USA

Denmark #1

Denmark #2

Italy

IndiaData

Feasibility and context.We have collected data for both hands and heads. I decided to use hand data only.Colors: xAcc (red), yAcc (green), zAcc (blue), pitch (yellow), roll (light blue)

Page 18: Prototyping in code

Experiments

Look and feel.I started buy just displaying the raw data (previous slide). Next step was to use the time and acceleration values to alternate shape of set of cubes in 3d space.

Page 19: Prototyping in code

Demo

IterationsI made an interactive application to explore different possibilited and parameters.

Video: http://vimeo.com/1905763

Page 20: Prototyping in code

Final posters

Three final designs were made.

Page 21: Prototyping in code

Exhibition

All the posters were exhibited at Danish Design School at the end of 2 weeks course.

(Photo by toujjval / Flickr)

Page 22: Prototyping in code

Rapid iterations

Rapid IterationsYou don’t know what the experience is unless you try it. You might be scared that it will suck, but just do it.Especially true for data visualization because it’s very hard to guess the nature of data without seeing it

Keep old versions of your code- either copies 01, 02, 03- or concurrent version systems like SVN or git for bigger projects with many developersHelp tracing newly introduced bugs, Code reuse, Experimentation

Page 23: Prototyping in code

Spin-off projects

Page 24: Prototyping in code

Spin-off projects

Page 25: Prototyping in code

Errors!

Sometimes you will suffer and don’t sleep over night. Get used to it.

Page 26: Prototyping in code

Processing

Toolset

QuartzComposer

Cinder

MaxMSP

PureData

Flash/AS3

HTML5/JavaScript

VVVV

Unity3d

OpenFrameworksPHP

ObjectiveC

C/C++

OpenGL

If you ask me which frameworks or programming languages should we learn or use. I would say - “It depends”.There are many tools to choose from, you don’t have to know them all. During this year you will be introduced to at least few programming languages. You just need to know when to use which.

Page 27: Prototyping in code

If you know what it's going to look like, stop and something else.

Explore

- Filip Visnjic / CreativeApplication.net

The whole fun about prototyping is to try out things and have fun while doing it. Don’t spend to much time thinking what is gonna be like, draw it, sketch it, build it, code it.