139
Making in the HCIL 31 st HCIL Symposium May 29, 2014 @jonfroehlich Human Computer Interaction Laboratory makeability lab

Making in the Human-Computer Interaction Lab (HCIL)

Embed Size (px)

DESCRIPTION

You can download the PowerPoint file with embedded movies here: http://www.cs.umd.edu/~jonf/talks.html ---------------- In the HCIL's Makeability Lab at the University of Maryland, we design interactive experiences that cross between bits and atoms—the virtual and the physical—and back again to confront some of the world's greatest challenges: environmental sustainability, health and wellness, and universal accessibility. In my talk, I’ll begin with an overview of the “Maker ethos” and the rise of Maker/DIY culture. I’ll then discuss how "Making" at the University of Maryland before shifting to how the HCIL (Human-Computer Interaction Lab) has begun introducing Maker tools and projects in research (e.g., [1–4]) and in the classroom including an introduction to our new(ish) HCIL Hackerspace. The talk closes with an overview of my Tangible Interactive Computing classes and how I've attempted to imbue it with a "Maker" and design studio spirit. At end, I hope to prompt discussion about the future of physical computing and making and where university education fits in. REFERENCES [1] Hara, K., Le, V. and Froehlich, J. 2013. Combining Crowdsourcing and Google Street View to Identify Street-level Accessibility Problems. Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (CHI ’13) (New York, NY, USA, May 2013). [2] Hara, K., Shiri, A., Campbell, M., Cynthia, B., Le, V., Pannella, S., Moore, R., Minckler, K., Ng, R. and Froehlich, J. 2013. Improving Public Transit Accessibility for Blind Riders by Crowdsourcing Bus Stop Landmark Locations with Google Street View. Proceedings of the 15th International ACM SIGACCESS Conference on Computers and Accessibility Technology (2013), 16:1–16:8. [3] Mauriello, M., Gubbels, M. and Froehlich, J. 2014. Social Fabric Fitness: The Design and Evaluation of Wearable E-Textile Displays to Support Group Running. SIGCHI Conference on Human Factors in Computing Systems (CHI ’14) (2014). [4] Norooz, L. and Froehlich, J. 2013. Exploring early designs for teaching anatomy and physiology to children using wearable e-textiles. Proceedings of the 12th International Conference on Interaction Design and Children - IDC ’13 (New York, New York, USA, Jun. 2013), 577–580.

Citation preview

Page 1: Making in the Human-Computer Interaction Lab (HCIL)

@jonfroehlich Assistant Professor Computer Science

Making in the HCIL

@jonfroehlich

Assistant Professor

Computer Science

31st HCIL Symposium

May 29, 2014

Making in the HCIL 31st HCIL Symposium

May 29, 2014 @jonfroehlich

Human Computer Interaction Laboratory

makeability lab

Page 2: Making in the Human-Computer Interaction Lab (HCIL)

Motivating Story

Two high

school interns

One aerial

quadcopter robot

One professor

(me)

Page 3: Making in the Human-Computer Interaction Lab (HCIL)
Page 4: Making in the Human-Computer Interaction Lab (HCIL)

Broken Gear

Page 5: Making in the Human-Computer Interaction Lab (HCIL)
Page 6: Making in the Human-Computer Interaction Lab (HCIL)
Page 7: Making in the Human-Computer Interaction Lab (HCIL)
Page 8: Making in the Human-Computer Interaction Lab (HCIL)
Page 9: Making in the Human-Computer Interaction Lab (HCIL)

What’s remarkable is not just that these students did this

but that they thought of doing it and had the

resources around them to seamlessly support the effort.

Page 10: Making in the Human-Computer Interaction Lab (HCIL)

But the story does not end there…

Page 11: Making in the Human-Computer Interaction Lab (HCIL)
Page 12: Making in the Human-Computer Interaction Lab (HCIL)

Built-in tool support for remixing

Page 13: Making in the Human-Computer Interaction Lab (HCIL)

Built-in tool support for remixing

Explicit shout-out & nod to spirit of making / sharing

Page 14: Making in the Human-Computer Interaction Lab (HCIL)
Page 15: Making in the Human-Computer Interaction Lab (HCIL)

This is a

BIG deal

Page 16: Making in the Human-Computer Interaction Lab (HCIL)

Chris Anderson, Makers: The New Industrial Revolution , 2012

Major shift: one example.

Apple released the laser writer. Desktop publishing.

Publishing used to be an expert: typographers,

typesetters—it cost money, only some people had access

to it.

Two things: printers and software composition/tools

Also standardization of formats—postscript

You are taking something that was once an industrial act

that was a rarified, exclusive club for professionals and

turn it into a button in your browser. Now, we can publish

with one touch of a button and can reach ~5-8 billion

people with one click of a mouse.

This disrupted the media industry

Page 17: Making in the Human-Computer Interaction Lab (HCIL)
Page 18: Making in the Human-Computer Interaction Lab (HCIL)
Page 19: Making in the Human-Computer Interaction Lab (HCIL)
Page 20: Making in the Human-Computer Interaction Lab (HCIL)
Page 21: Making in the Human-Computer Interaction Lab (HCIL)
Page 22: Making in the Human-Computer Interaction Lab (HCIL)

This Talk: Three Parts

Page 23: Making in the Human-Computer Interaction Lab (HCIL)

This Talk: Three Parts

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 24: Making in the Human-Computer Interaction Lab (HCIL)

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 25: Making in the Human-Computer Interaction Lab (HCIL)
Page 26: Making in the Human-Computer Interaction Lab (HCIL)

'Maker culture' emphasizes learning-through-doing

(constructivism) in a social environment. Typical interests

include electronics, robotics, 3D printing, and the use of

CNC tools, as well as more traditional activities such as

metalworking, woodworking, and traditional arts and

crafts.

Wikipedia Maker Culture

http://en.wikipedia.org/wiki/Maker_culture

Page 27: Making in the Human-Computer Interaction Lab (HCIL)

'Maker culture' emphasizes learning-through-doing

(constructivism) in a social environment. Typical interests

include electronics, robotics, 3D printing, and the use of

CNC tools, as well as more traditional activities such as

metalworking, woodworking, and traditional arts and

crafts. The culture stresses new and unique applications

of technologies, and encourages invention and

prototyping. There is a strong focus on using and

learning practical skills and applying them creatively.

Wikipedia Maker Culture

http://en.wikipedia.org/wiki/Maker_culture

Page 28: Making in the Human-Computer Interaction Lab (HCIL)

Computer

Science

making

Page 29: Making in the Human-Computer Interaction Lab (HCIL)

why

now?

Page 30: Making in the Human-Computer Interaction Lab (HCIL)

1. COST AND SPEED

Page 31: Making in the Human-Computer Interaction Lab (HCIL)

2. OPEN HARDWARE

The Arduino has lowered the barrier to programming physical

computing systems and created a vibrant eco-system of use

Page 32: Making in the Human-Computer Interaction Lab (HCIL)

3. THE INTERNET

Websites provide easy access to help, supportive communities,

and, just as importantly, purchasable materials

Page 33: Making in the Human-Computer Interaction Lab (HCIL)

4. NEW TOOLS/MATERIALS

3D-Printing CNC machines

Page 34: Making in the Human-Computer Interaction Lab (HCIL)

4. NEW TOOLS/MATERIALS

Page 35: Making in the Human-Computer Interaction Lab (HCIL)

5. SUPPORTIVE COMMUNITY

Page 36: Making in the Human-Computer Interaction Lab (HCIL)
Page 37: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Booth at the Silver Spring Mini-Maker Faire

Page 38: Making in the Human-Computer Interaction Lab (HCIL)

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 39: Making in the Human-Computer Interaction Lab (HCIL)

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 40: Making in the Human-Computer Interaction Lab (HCIL)

Making

at UMD

Page 41: Making in the Human-Computer Interaction Lab (HCIL)
Page 42: Making in the Human-Computer Interaction Lab (HCIL)
Page 43: Making in the Human-Computer Interaction Lab (HCIL)
Page 44: Making in the Human-Computer Interaction Lab (HCIL)
Page 45: Making in the Human-Computer Interaction Lab (HCIL)
Page 46: Making in the Human-Computer Interaction Lab (HCIL)
Page 47: Making in the Human-Computer Interaction Lab (HCIL)
Page 48: Making in the Human-Computer Interaction Lab (HCIL)

UMD Maker/Hackerspaces

Page 49: Making in the Human-Computer Interaction Lab (HCIL)
Page 50: Making in the Human-Computer Interaction Lab (HCIL)

UMD Maker/Hackerspaces

Page 51: Making in the Human-Computer Interaction Lab (HCIL)

UMD Maker/Hackerspaces

STARTUP SHELL http://startupshell.org/

COLLIDER http://www.collider.org/

MCKELDIN LIBRARY http://startupshell.org/

HCIL HACKERSPACE http://slidesha.re/1mHefoy

Page 52: Making in the Human-Computer Interaction Lab (HCIL)

UMD Maker/Hackerspaces

STARTUP SHELL http://startupshell.org/

COLLIDER http://www.collider.org/

MCKELDIN LIBRARY http://startupshell.org/

HCIL HACKERSPACE http://slidesha.re/1mHefoy

Page 53: Making in the Human-Computer Interaction Lab (HCIL)

what makes a space a makerspace

Page 54: Making in the Human-Computer Interaction Lab (HCIL)
Page 55: Making in the Human-Computer Interaction Lab (HCIL)
Page 56: Making in the Human-Computer Interaction Lab (HCIL)

MAKERBOT REPLICATOR 2 3D-Printer in McKeldin Library

Page 57: Making in the Human-Computer Interaction Lab (HCIL)

MLK LIBRARY Downtown Washington DC

Page 58: Making in the Human-Computer Interaction Lab (HCIL)
Page 59: Making in the Human-Computer Interaction Lab (HCIL)

MLK LIBRARY DIGITAL COMMONS http://dclibrary.org/digitalcommons

Page 60: Making in the Human-Computer Interaction Lab (HCIL)

MLK LIBRARY DIGITAL COMMONS http://dclibrary.org/digitalcommons

Page 61: Making in the Human-Computer Interaction Lab (HCIL)

MLK LIBRARY DREAM LAB http://dclibrary.org/digitalcommons

Page 62: Making in the Human-Computer Interaction Lab (HCIL)

MCKELDIN LIBRARY Beginning to Create Makerspace

Page 63: Making in the Human-Computer Interaction Lab (HCIL)

MCKELDIN LIBRARY Future Location of First Makerspace

Page 64: Making in the Human-Computer Interaction Lab (HCIL)

UMD Maker/Hackerspaces

STARTUP SHELL http://startupshell.org/

COLLIDER http://www.collider.org/

MCKELDIN LIBRARY http://startupshell.org/

HCIL HACKERSPACE http://slidesha.re/1mHefoy

Page 65: Making in the Human-Computer Interaction Lab (HCIL)

UMD Maker/Hackerspaces

STARTUP SHELL http://startupshell.org/

COLLIDER http://www.collider.org/

MCKELDIN LIBRARY http://startupshell.org/

HCIL HACKERSPACE http://slidesha.re/1mHefoy

Page 66: Making in the Human-Computer Interaction Lab (HCIL)

How do you design a space for making?

Page 67: Making in the Human-Computer Interaction Lab (HCIL)
Page 68: Making in the Human-Computer Interaction Lab (HCIL)

I want(ed) to make the HCIL

Hackerspace a place to… …inspire creativity & excitement

…encourage and allow for serendipitous interaction

…attract a diverse set of students

…allow students to experiment, play, learn, make

…build community and imbue a spirit of collaboration

…rapidly prototype physical computing designs

…promote working with low-tech and high-tech materials together

Page 69: Making in the Human-Computer Interaction Lab (HCIL)

Design

Build

Evaluate

Human-Centered

Iterative Design

Page 70: Making in the Human-Computer Interaction Lab (HCIL)
Page 71: Making in the Human-Computer Interaction Lab (HCIL)

Google Docs enabled multiple parties to easily provide feedback and even make their own edits to the planning doc

Page 72: Making in the Human-Computer Interaction Lab (HCIL)
Page 73: Making in the Human-Computer Interaction Lab (HCIL)
Page 74: Making in the Human-Computer Interaction Lab (HCIL)
Page 75: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Prior to Renovation

Page 76: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 1.0

Page 77: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 1.0

Page 78: Making in the Human-Computer Interaction Lab (HCIL)

We allowed the space to evolve over time as we

observed use and added additional equipment.

Page 79: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 1.0

Page 80: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 2.0

Page 81: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 2.0

Page 82: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 3.0

Page 83: Making in the Human-Computer Interaction Lab (HCIL)

HCIL Hackerspace Version 3.0

Page 84: Making in the Human-Computer Interaction Lab (HCIL)

Making is enabled not just by space

but ready access to material and tools

Page 85: Making in the Human-Computer Interaction Lab (HCIL)

Three Soldering Stations HCIL Hackerspace

Page 86: Making in the Human-Computer Interaction Lab (HCIL)

Craft/Textile Station HCIL Hackerspace

Page 87: Making in the Human-Computer Interaction Lab (HCIL)

Two Mannequins HCIL Hackerspace

Page 88: Making in the Human-Computer Interaction Lab (HCIL)

Basic Electronic Supplies HCIL Hackerspace

Page 89: Making in the Human-Computer Interaction Lab (HCIL)

Wall of Electronic Components HCIL Hackerspace

Page 90: Making in the Human-Computer Interaction Lab (HCIL)

Quadcopters HCIL Hackerspace

Page 91: Making in the Human-Computer Interaction Lab (HCIL)

One Oscilloscope HCIL Hackerspace

Page 92: Making in the Human-Computer Interaction Lab (HCIL)

Two 3D-Printers HCIL Hackerspace

Page 93: Making in the Human-Computer Interaction Lab (HCIL)

One CNC Machine HCIL Hackerspace

Page 94: Making in the Human-Computer Interaction Lab (HCIL)

One CNC Machine HCIL Hackerspace

Page 95: Making in the Human-Computer Interaction Lab (HCIL)

Observe the use of space and iterate 1. Top Five Tips

3. Configure not just for work but for inspiration

4. Big, open tables are important for collab making

Allow the makers to help make the space 2.

Page 96: Making in the Human-Computer Interaction Lab (HCIL)

Students Working Outside

The Hackerspace

Page 97: Making in the Human-Computer Interaction Lab (HCIL)

Students Working Outside

The Hackerspace

Page 98: Making in the Human-Computer Interaction Lab (HCIL)

Students Working Outside

The Hackerspace

Page 99: Making in the Human-Computer Interaction Lab (HCIL)

Observe the use of space and iterate 1. Top Five Tips

3. Configure not just for work but for inspiration

4. Big, open tables are important for collab making

Allow the makers to help make the space 2.

5. Provide as much equipment as you can afford &

keep it organized/accessible

Page 100: Making in the Human-Computer Interaction Lab (HCIL)

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 101: Making in the Human-Computer Interaction Lab (HCIL)

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 102: Making in the Human-Computer Interaction Lab (HCIL)

For me, the type of making that gets me excited

combines computation with physical material to

create new interactive experiences (e.g., fabrics, objects)

Page 103: Making in the Human-Computer Interaction Lab (HCIL)

Ryokai et al., I/O Brush: Drawing With Everyday Objects as Ink, CHI2004

Page 104: Making in the Human-Computer Interaction Lab (HCIL)

Tangible Interactive Computing

Spring 2014

Tangible Interactive Computing

Fall 2012

My ‘Maker’ Course

Page 105: Making in the Human-Computer Interaction Lab (HCIL)
Page 106: Making in the Human-Computer Interaction Lab (HCIL)

[Source: http://st-marks-preschool.org/wp-content/uploads/2013/02/Sandbox-play.jpg]

Sandbox Days Alternates with lectures; focused on discussions,

rapid prototyping, & peer learning

Page 107: Making in the Human-Computer Interaction Lab (HCIL)
Page 108: Making in the Human-Computer Interaction Lab (HCIL)

MUSICAL SPAGHETTI MADNESS By Richard Johnson, Spring 2014

Page 109: Making in the Human-Computer Interaction Lab (HCIL)
Page 110: Making in the Human-Computer Interaction Lab (HCIL)

Richard brought spaghetti & sauce

Page 111: Making in the Human-Computer Interaction Lab (HCIL)
Page 112: Making in the Human-Computer Interaction Lab (HCIL)

LOW TECH TOUCHPAD By Peter Enns & Chris Imbriano, Spring 2014

Page 113: Making in the Human-Computer Interaction Lab (HCIL)
Page 114: Making in the Human-Computer Interaction Lab (HCIL)

STARRY NIGHT By Meethu Malu & Hitesh Maidasani, Spring 2014

Page 115: Making in the Human-Computer Interaction Lab (HCIL)
Page 116: Making in the Human-Computer Interaction Lab (HCIL)
Page 118: Making in the Human-Computer Interaction Lab (HCIL)
Page 119: Making in the Human-Computer Interaction Lab (HCIL)
Page 120: Making in the Human-Computer Interaction Lab (HCIL)
Page 121: Making in the Human-Computer Interaction Lab (HCIL)

CMSC838f Instructables Stats

Total Views: 108,040

Total Favorites: 651

Page 122: Making in the Human-Computer Interaction Lab (HCIL)

CMSC838f Instructables Stats

Total Views: 108,040

Total Favorites: 651

24,625

293

Spring 2014 totals; posted May 16

Page 123: Making in the Human-Computer Interaction Lab (HCIL)

0

10,000

20,000

30,000

40,000

Inside/Outside

Tracker

Interactive

Living Wall

HandSight X-Track Bear With Me Bicycle Trip

Visualizer

Chem4D

23-Aug-13

Instructables Views as of August 2013 CMSC838f, Fall2012

63,514

248

Aug, 2013

Page 124: Making in the Human-Computer Interaction Lab (HCIL)

0

10,000

20,000

30,000

40,000

Inside/Outside

Tracker

Interactive

Living Wall

HandSight X-Track Bear With Me Bicycle Trip

Visualizer

Chem4D

23-Aug-13

28-May-14

Instructables Views Over Time CMSC838f, Fall2012

63,514

248

Aug, 2013

83,415

358

May, 2014

Even after 1.5 years, the first

round of Instructables are still

making an impact!

Page 125: Making in the Human-Computer Interaction Lab (HCIL)
Page 126: Making in the Human-Computer Interaction Lab (HCIL)

Student interaction extends beyond classroom

Community suggests new ideas and alternative approaches!

Page 127: Making in the Human-Computer Interaction Lab (HCIL)

in the classroom!

Fulfilled original goal: allowed for impact beyond the

classroom & to contribute back to the maker community 1. Impact continued over time: student Instructables

sustained interest/readership long after course completed 2. Interaction with maker community: Instructables

provided a forum for students to interact w/makers 3. Intrinsic satisfaction: The above three things served to

increase student’s sense of accomplishment & satisfaction 4.

Page 128: Making in the Human-Computer Interaction Lab (HCIL)

Rise of Maker/DIY Movement Making & Makerspaces at UMD ‘Making’ in the Classroom

Page 129: Making in the Human-Computer Interaction Lab (HCIL)

We are creatures who need to make.

Frank Bidart Poet

Quote from: Wilkinson & Petrich, The Art of Tinkering, 2014

Page 130: Making in the Human-Computer Interaction Lab (HCIL)

We are creatures who need to make.

Frank Bidart Poet

Quote from: Wilkinson & Petrich, The Art of Tinkering, 2014

Page 131: Making in the Human-Computer Interaction Lab (HCIL)

Upcoming ‘Maker’ Talks Today

BodyVis: Body Learning Through Wearable

Sensing & Visualization Leyla Norooz & Jon Froehlich

1:05PM

Social Fabric Fitness: The Design & Evaluation of

Wearable E-textile Displays to Support Group Running Matt Mauriello, Jon Froehlich, Michael Gubbels

1:19PM

Current and Future Mobile and Wearable Device Use

by People with Visual Impairments Hanlu Ye, Meethu Malu, Uran Oh, Leah Findlater

1:47PM

Physically Computing Physical Computing: Creative

Tools for Building w/Physical Materials & Computation Michael Gubbels & Jon Froehlich

2:15PM

Page 132: Making in the Human-Computer Interaction Lab (HCIL)

@jonfroehlich Assistant Professor Computer Science

Making in the HCIL

@jonfroehlich

Assistant Professor

Computer Science

31st HCIL Symposium

May 29, 2014

Making in the HCIL 31st HCIL Symposium

May 29, 2014 @jonfroehlich

Human Computer Interaction Laboratory

makeability lab

Page 133: Making in the Human-Computer Interaction Lab (HCIL)

Bearded Man by Riccardo Greg http://thenounproject.com/term/bearded-man/36280/

Quadcopter by Nithin Davis Nanthikkara http://thenounproject.com/term/quadcopter/22061/

Students by Hadi Davodpour http://thenounproject.com/term/students/28126/

Icon Credits

Eye by Michael Rowe http://thenounproject.com/term/eye/19791/

Heart Public Domain http://thenounproject.com/term/heart/219/

Acknowledgements Thanks to the students, faculty, and staff of the

HCIL back in the summer of 2012 who helped me

setup the HCIL Hackerspace. Thanks to Professor

Tom Yeh for donating the Makerbot Replicator 3D-

printer, Sparkfun.com for donating some

equipment, Steve Hodges at Microsoft Research for

donating .NET Gadgeteer Kits, John Krumm for

faciliating Microsoft donations of Kinects for

Windows, and the students who are helping me

build this course as we go along. To learn more

about the inspirations for this class, read here.

Page 135: Making in the Human-Computer Interaction Lab (HCIL)

http://learn.sparkfun.com http://learn.adafruit.com/ http://www.instructables.com/

proquest.safaribooksonline.com/

Some Online Resources

http://highlowtech.org/ itp.nyu.edu/physcomp/Tutorials

Page 136: Making in the Human-Computer Interaction Lab (HCIL)

Making

MAKERSPACES Resources