Ubiquitous Content Symposium 2009

Designing toolkits for prototyping funnel

Shigeru Kobayashi (IAMAS)Ubiquitous Content Symposium 2009 (February 27th, 2009) Photo credit: ICC

Designing toolkits

• Gainer (2005~)

• Funnel (2007~)

Motivation (as an engineer)

• “Sketching in hardware” was not so easy as software: Difficult to implement new ideas in the late stages of development

• Difficult to evaluate “new” ideas using past (old) experiences

• Lack of common language between designers and engineers

Motivation (at IAMAS)

• Concept driven development is not so easy for average students who do not have concrete ideas

• “Build to think” method sounds good, but substantial skills are required

• Difficult to teach programming for micro-controllers in C or assembly (easy to get frustrated)

Encounters with Physical Computing

• Encountered “Physical Computing” via the book in 2004

• The teaching methods described seemed very good for teaching

• Then designed toolkits, held workshops, and wrote articles and books

Background of Gainer

• Started in 2005 (before Arduino era)

• Let’s develop a toolkit that we want, by ourselves

• Keep as simple as possible, so minimized the functions to an I/O module

What is Gainer?

• A toolkit consisting of open source hardware and software

• Hardware: I/O module with USB I/F

• Software libraries

• ActionScript 2/3

• Processing

• Max/MSP

Gainer I/O module

Photo: Shunsuke Takawo

Workshop example

• Yamaguchi Center for Arts and Media

• 2 days (2007.12.21-22)

• 19 participants

• Gainer I/O + Funnel + Processing

Lecture

Photo credit: YCAM

Practical training

Photo credit: YCAM

Idea sketches

Photo credit: YCAM

Hardware sketching

Photo credit: YCAM

Presentation

Photo credit: YCAM

＋GAINER

＋GAINER: Tutorial

＋GAINER: Cookbook

＋GAINER: Works

Gainer as an O.S. Hardware

• Gainer I/O module v1.0

• Original version

• PSoC based


• Gainer PSoC development board

• Designed by SparkFun Electronics

• PSoC based

• v1.3, v1.4 and v1.7


• Ginger/Pepper/Sugar

• Designed by Morecat Lab

• AVR based


• Gainer mini

• Designed by RT

• PIC based

Gainer as an O.S. Software

• .NET

• Perl

• Puredata

• Python

• Ruby

• Squeak

• vvvv

Recent activities at IAMAS

• Adopted tried and tested expression methods of media arts to interaction design

• Will be yet another application for industries in addition to interactive advertisements

• Developing a new design method for physical interaction design: Gangu project

Processes of designing toys

• Research existing electric toys (many)

• Drawing idea sketches (many)

• Evaluate ideas and pick one for each student

• Dirty prototype

• Hardware sketching

• Making prototypes

• Exhibiting

• Reflection

Toy example: Mountain Guitar

• Design: Junichi Kanebako

• A toy like musical interface - professional guitar sound

• Gainer I/O (special model) + Max/MSP

Toy example: Jamming Gear

• Design: So Kanno and Kenichiro Saigo

• A Tangible interface for visualizing digital music

• Sketch: Gainer I/O + Max/MSP

• Prototype: FIO + Bluetooth + Max/MSP

Motivation to Funnel

• An I/O module doesn’t cover all user needs and changing between toolkits is expensive

• For beginners, it is difficult to handle real-world inputs from numerous sensors

• Wired connection narrows ideas during “sketching in hardware” stage

Background of Funnel

• Initially planned as “Gainer v2.0”

• Started in 2007: Arduino was commonly available and widely used

• We usually used both Gainer and Arduino

• Don’t develop a new toolkit just for differentiation: think about end users!

• How about “interconnecting” existing toolkits?

Bill Buxton’s “design funnel”

• Sketching User Experiences (2007)

We extended to physical prototypes: “prototyping funnel”

Efforts in the classroomSketching Prototyping

Toolkit

Connection

Programming

Material

Wiring

Gainer Gainer or Arduino

wired wired, wireless or stand-alone

PC only PC and/or microcontroller

cardboard, clay or styrofoam wood and/or 3D printing

breadboard soldering

What is Funnel?

• A toolkit to interconnect toolkits

• Covers from sketches to prototypes:the prototyping funnel

• Intended to be a common language between designers/artists and engineers

Funnel features

• Translates “a sensor language” into “a GUI programming language”

• Various filters to handle inputs

• Scaler

• Divider (SetPoint)

• LPF, HPF etc.

• Oscillator

• A new I/O module based on Arduino

Interconnections via Funnel

!"#$%#&&'()*+&

,-.)&/012$3(45+&

6/45.)(78.9:$;./<-9-=

!"#$%#&&'()*+&

;5))&+$"&/>&/

6?9.()"?/.@9$A B/(?&CC.)* 3-D13"B&9?EF5GH

6"A$I.G/-/H B/(?&CC.)*$I.G/-/H 2"J$I.G/-/.&CF5GH$I.G/-/H

;5))&+$012 '.*.$0)9&/)-9.()-+%#&&;5))&+$012 '.*.$0)9&/)-9.()-+

%#&&

Supported hardware

• Gainer I/O

• Arduino and compatibles (via Firmata v2)

• XBee (IEEE 802.15.4 or ZigBee)

• FIO (Funnel I/O)

Supported languages

• Processing

• ActionScript 3

• Ruby

Event detection (without Funnel)var threshold:Number = 0.5;var hysteresis:Number = 0.1;var lastState:int = 0;

function loop():void { var state:int = -1; if (io.analogInput(0).value < (threshold - hysteresis)) { state = 0; } else ((io.analogInput(0).value > (threshold + hysteresis))) { state = 1; } else { state = lastState; }

if (lastState == 0 && state == 1) { // on rising edge, do something }

lastState = state;}

Event detection (with Funnel)var threshold:Number = 0.5;var hysteresis:Number = 0.1;

io.analogInput(0).filters = [new SetPoint([threshold, hysteresis])];io.analogInput(0).addEventListener(PinEvent:RISING_EDGE, onRisingEdge);

function onRisingEdge(e:PinEvent):void { // do something}

Just add a filter

Using a digital compass (with Funnel)var fio:Fio;var compass:HMC6352;var clockHand:Shape;

function setup():void { fio = new Fio([1], Fio.FIRMATA); compass = new HMC6352(fio.ioModule(1)); ...}

function loop():void { clockHand.rotation = compass.heading;}

Just add a sensor

FIO as an O. S. Hardware

• FIO v1.0 (July, 2008)

• Original demo design

• 2 AAA rechargeable batteries

• FIO v1.3 (December, 2008)

• Designed with SparkFun Electronics

• A LiPo rechargeable battery



• Funnel IO remixed (January, 2009)

• Designed by Seeed Studio

• Just one month after FIO v1.3!

Future plans

• Add features to handle real-world applications, while keeping things simple

• Optimize performance

• Support real embedded platforms

• Beagle Board

• Android

• Collaborate with additional toolkits!

• Write articles and books...

Designing toolkits for prototyping funnel

Shigeru Kobayashi (IAMAS)Ubiquitous Content Symposium 2009 (February 27th, 2009) Photo credit: ICC

Ubiquitous Content Symposium 2009

Design

Transcript of Ubiquitous Content Symposium 2009