Top Banner
Designing Virtual Realism Auckland, April 2009 Dan Rubin Sidebar Creative
63
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Designing Virtual Realism (Web09)

DesigningVirtual Realism

Auckland, April 2009

Dan RubinSidebar Creative

Page 2: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Me, according to nGen works @ http://happywebbies.com/

Hi!Dan Rubin

Page 3: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Web StandardsCreativity

Dan Rubin(and 9 other guys)

by

Page 4: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Pro CSSTechniques

Jeff CroftIan LloydDan Rubin

by

Page 5: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Look & Feel

knowing how to interact with something based on its appearance.

Page 6: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Look & Feel

knowing how to interact with something based on its appearance.

Page 7: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

We do this every day.

based on our collective life experience from our own interactions and from observing the actions of others.

Page 8: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Peter Zelnik (http://www.sxc.hu/photo/1170873)

Page 9: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Kriss Szkurlatowski (http://www.sxc.hu/photo/1165285)

Page 10: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: David Thomson (http://www.sxc.hu/photo/1172713)

Page 11: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Dedy Ong (http://www.sxc.hu/photo/1161259)

Page 12: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Roberto Ribeiro (http://www.sxc.hu/photo/1173672)

Page 13: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Context is important.

Page 14: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: David Ritter (http://www.sxc.hu/photo/941686)

you may not be able to recognize this at first without more contextual information

Page 15: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Craig Jewell (http://www.sxc.hu/photo/945272)

Page 16: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 17: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 18: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 19: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 20: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Tactile Interaction

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 21: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 22: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 23: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 24: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 25: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 26: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

the tactile interaction of the screen — mouse, trackball, keyboard, tablet: the pointer on screen is an extension of our physical body, it is a virtual appendage, and clicking is the closest thing to physical interaction; we love touchscreens because the basic level of interaction is normal: we point at something we want to interact with, and touch it. But we're still interacting with a flat surface/texture.

Page 27: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Mimic physical interfaces.

we already know how to use and interact with these things

Page 28: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 29: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Pascal Montsma (http://www.sxc.hu/photo/230015)

Page 30: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photo: Ivaylo Georgiev (http://www.sxc.hu/photo/426359)

Page 31: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Creatingan Illusion

Page 32: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 33: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Julian Beever: http://users.skynet.be/J.Beever/

Page 34: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Julian Beever: http://users.skynet.be/J.Beever/

Page 35: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Some interfaces already do this.

Page 36: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 37: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 38: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 39: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 40: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Invite people to touch your interface.

Page 41: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 42: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 43: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 44: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Adding noise creates a basic texture.

Page 45: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 46: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 47: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 48: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Aesthetic-Usability Effect

Page 49: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

“Attractive things work better.”

— Donald Norman

it’s not a big leap to extend this to “virtual interfaces that look like real world interfaces are easier to interact with.”

Page 50: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Traditional Media

Page 51: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 52: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 53: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 54: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 55: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Photographic

Page 56: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 57: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 58: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 59: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

PhysicalItems

Page 60: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Page 61: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Onward to Photoshop!(whereby a live demo ensued)

Page 62: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

Questions?

Page 63: Designing Virtual Realism (Web09)

©2009 Dan Rubin » http://sidebarcreative.com

Designing Virtual Realism Auckland, April 2009

fin.