What is the Material of UX?

FITC
Spotlight UX/UI 2017
What is the Material of UX?

FITC
Hello! My name is Michael. I design at Etsy.

Etsy is a global marketplace
where people around the
world connect, both online
and offline, to make, sell
and buy unique goods.

Reimagine commerce in
ways that build a more
fulfilling and lasting world.
OUR M ISSION
4

5
1.6M
Active Sellers
AS OF MARCH 31, 2016
25M
Active Buyers
$2.39B
Annual GMS
IN 2015
35+M
Items for Sale
Photo by Kirsty-Lyn Jameson
BY THE NU MBE RS

SELLER
Pursues craft,
grows business
ET SY
Facilitates the  
transaction
ETSY
Invests in the  
platform and  
delivers a  
global base of  
buyers
BU YER
Funds unique  
goods that are  
hard to find  
elsewhere

8
Make Etsy an Everyday Experience Build Local Marketplaces, Globally
Offer High Impact Seller Services Expand the Etsy Economy
THE PATH AHE AD

FITC
What is the material of UX?

http://www.metmuseum.org/exhibitions/listings/2017/rei-kawakubo

FITC
We need new ways of seeing, thinking, and
handling materials beyond “Classical Design.”

https://www.amplify.com/viewpoints/q-john-maeda-risd-president-and-steam-advocate

FITC
After John Maeda
Design
“Classical Design”
There’s a right way to make what is
perfect, crafted, and complete.
Driver
The Industrial Revolution, and prior
to that at least a few millenia of
ferment.
Driver
The need to innovate in relation to
individual customer needs requires
empathy.
Driver
The impact of Moore’s Law, mobile
computing, and the latest tech
paradigms.
Because execution has outpaced
innovation, and experience matters.
Designing for billions of individual
people and in realtime, is at scale
and TBD.
Business
“Design Thinking”
Technology
“Computational Design”

FITC
After John Maeda
Design
There’s a right way to make what is
perfect, crafted, and complete.
Driver
The Industrial Revolution, and prior
to that at least a few millenia of
ferment.
Driver
The need to innovate in relation to
individual customer needs requires
empathy.
Driver
The impact of Moore’s Law, mobile
computing, and the latest tech
paradigms.
Because execution has outpaced
innovation, and experience matters.
Designing for billions of individual
people and in realtime, is at scale
and TBD.
Business
“Design Thinking”
Technology
“Cycle-ahead” Product Design

FITC What is the Material of UX?
In collaboration with Morgan Edgerton

http://vtiff.org/events/architecture-design-film-series-objectified/

FITC

FITC
COMPUTAT IONAL DE SIGN
Designing for billions of individual people and
in realtime.

FITC
FACEBOOK
1.96B
WHATSAPP
1.2B
YOU TUB E
1B
Statistica.com. Retrieved May 25, 2017. Most famous social network sites worldwide as of April 2017

FITC
After John Maeda
Design
A smartphone, laptop, robot, and any
human-facing IoT device.
Technology

FITC
The Industrial Revolution was the driving
force behind Classical Design.

FITC
Bauhaus 1919-1933

FITC
“My architecture
students will not be
architects. The architect
is dead!”
—Hannes Meyer
Students were organized into “co-
operative cells” which incorporated
seniors and juniors, experts and novices
into a single team.
Meyer trained specialists to operate as a
single creative unit: “The building
materials expert, the small town master
builder, the colourist—each an
instrument of co-operation.”
Bauhaus 1919-1933

The Bauhaus
Curriculum gave
designers ways of
seeing, thinking
about, and working
with physical
materials.
Bauhaus 1919-1933

FITC
Theoretical classes and
practical workshops were
devoted to materials
Bauhaus 1919-1933

FITC
Students examined materials to “bring
clearly to light the essential and
contradictory within each.”

Contrasting materials
wood-metal-glass
Contrasting forms
jagged-smooth
Contrasting origins
nature-human Contrasting rhythms
straight-curved
http://www.bauhaus.de/de/ausstellungen/
sammlung/204_unterricht/432

smooth-rough
shimmer-dampen
tall-short
fragile-resilient
reflect-absorb
https://www.washingtonpost.com/graphics/augmented-reality/what-perfect-sound-looks-like/?utm_term=.da8e48ebf16b

FITC
These ways of seeing, thinking, and making
are from a different place and time.
We need a new materials literacy for new
design challenges ahead.

FITC
The
Machine
Revolution
Role of
Machines
Extend and
enhance…
…muscles
(1750–1850) (1955–1995)
…muscles and
nervous system
…nervous system
(2015–?)
Value creation by
lowering the cost of…
…performing
physical labor
…performing
cognitive tasks
…collaborating
Industrial
Revolution
Computer
Revolution
Automation
Revolution
After Paul Pangaro
The
Machine
Revolution

https://www.youtube.com/watch?v=hzxlDE95XcY

FITC
Collaboration also includes working with
artificially intelligent agents to perform
cognitive tasks—generating and exchanging
knowledge, making decisions, and
coordinating our actions.

https://www.youtube.com/watch?v=9X_fP4pPWPw

FITC
What does it all mean to be human in a world
of connected devices that are all designed to do
things for us, to make our lives more convenient
and to automate tasks we find boring. Or, just
because they can be automated?

FITC
Effortless,
thoughtless
consumption
Pursuit of an
inspiring and
fulfilling life
Develop new usable,
useful, and desirable
product experiences

FITC
And, now and in the future, what are the
materials of UX? What are our ways of
seeing and thinking about them? What is
essential or contradictory about each?
How do we handle them?

Data, algorithms, and
“anything virtual”
UX DesignComputational Design
Human behavior,
feedback, and models to
see their invisible
properties

FITC
Human Behavior “Everyone experiences far more than
he understands.Yet it is experience,
rather than understanding, that
influences behavior.”
—Marshall McLuhan

User experience is constructed.
Attention, Behavior, Concepts,
Energy, Goals, Knowledge,
Messages, Models, Past
Experiences,Time etc.
If we can learn about people’s
experiences then we can make
it the source of inspiration and
ideation for design.
Making user experience the
source of inspiration, we are
better able to design for
experiencing.
System User
Interaction
Experience
What the
system brings
What the
user brings
Sanders, L. (1999). Postdesign and Participatory Culture

FITC
Behavior is the medium of interaction design.

FITC
“Behavior is a wondrous thing—it’s both a
symptom of and catalyst for change. As
interaction designers we thrive on this give-and-
take: behaviors shape our work, while we work
to shape behaviors.[…] We learn that people
are messy, and we learn to love them for it.”

FITC
Objectives
What do we want to know?
Hypotheses
What are our
assumptions?
Methods
How do we
plan to learn?
Research
Gathering information
and knowledge
Synthesis
Understanding
opportunities
There are many ways we can
learn about people’s behavior.
Design research methods gives
us access to their experiences.
Design
Research

FITC
Interviews
Heuristic
Analysis
Usability
Testing
Competitive
Analysis
Contextual
Inquiry
Brand
Audit
Literature
Review
Analytic
Analytic
Descriptive Descriptive
Evaluative
Evaluative
Generative Evaluative
A/B
Testing
Usability
Testing
SWOT
Analysis
Interviews
Users
ProductOrganization
Competition
Questions
About
What people do
What people say, think
After Erika Hall

FITC
Say
Think
Do
Use
Know
Feel
Explicit
Observable
Tacit
Not easily expressed in words
Latent
Not recognizable until the future
Dream
Listening to what people say
tells us what they are able to
express in words.
Watching what people do
provides us with observable
information.
Understanding how people
feel gives us the ability to
empathize with them.
Seeing and appreciating
what people dream shows us
how their future could
change for the better.
Sanders, L. (1999). Postdesign and Participatory Culture

FITC
Behavior can be effectively shaped by
the experiences we design, if you can
see its properties.

FITC
B=matBehavior Motivation Ability Trigger
All three must be present for
a behavior to occur.
Fogg, B. (2009). Paper presented at the Proceedings of the
4th International Conference on PersuasiveTechnology

FITC
Motivation
Ability
High
Motivation
Low
Motivation
Hard to Do Easy to Do
Triggers
Succeed Here
Triggers
Fail Here
Action
Line
Fogg, B. (2009). Paper presented at the Proceedings of the

FITC
Motivation
Ability
High
Motivation
Low
Motivation
Hard to Do Easy to Do
Triggers
Succeed Here
Triggers
Fail Here
Action
Line
Motivation
High
Motivation
Low
Motivation
AbilityHard to Do Easy to Do
Marketing,
Branding,
Behavioral
Science
UX DesignFogg, B. (2009). Paper presented at the Proceedings of the

FITC
1. Guide people
2. Harness whatever motivation
exists at the moment
3. Focus on increasing ability

FITC
To increase ability:
1. Train users
2. Make the behavior easier to do

FITC
Feedback “We want to fashion puppets that pull
their own strings.”
—Ann Marion

FITC
“Interaction design explores the dynamic
exchanges between users and systems. Both
the user and the system are actors sharing the
stage in a dramatic narrative.”
—Ellen Lupton, Beautiful Users

FITC
“A system is an interconnected set of elements
that is coherently organized in a way that
achieves something.”
—Donella H. Meadows, Thinking in Systems

FITC
Types of systems Wa
Evap
Systems
can be Static or Dynamic
which can be Linear or Closed-loop
which can be Recirculating or Self-regulatory
which can be First- or Second-order
After Paul Pangaro, Hugh Dubberly

https://standardsmanual.com/products/nasa-graphics-standards-manual

https://www.youtube.com/watch?v=E2evC2xTNWg

hello-operator.softwareadvice.com. Retrieved May 25, 2017. How to Sound Like a Fortune 500 Company WithYour Company’s Auto Attendant

https://pmm.nasa.gov/education/water-cycle

FITC
Self-regulating systems have unique
properties: goals, feedback, and the
ability to act, sense, and compare.

FITC
Systems achieve goals The goal defines a relationship
between the system and its
environment, which the system
seeks to attain and maintain.

FITC
Knowing whether you
have reached your goal
(or at least are getting
closer to it) requires
feedback.
Feedback is the information loop
flowing from the system through
the environment and back into
the system.

FITC
Pilots rely on negative feedback
to steer a system toward a goal

FITC
detection of error
compares current heading
with desired heading
D= correction of error
adjusts rudder
to correct heading
C=
Steering as a feedback loop
Compares heading with
goal of reaching port
Adjusts rudder to
correct heading
Ship’s heading
Detection of Error
Correction of Error
Feedback

FITC
detection of error
compares current heading
with desired heading
D= correction of error
adjusts rudder
to correct heading
C=
Steering as a feedback loop
Comparing
ActingSensing

Temperature Control Lever
The bi-metal coil is connected
to the temperature control lever.
*The magnet insures a good contact
Fixed Contact Screw
50 | | | | | 60 | | | | | 70 | | | | | 80 | | | | | 90
Moving Contact
Bi-metal Coil
Magnet*
Temperature Indicator Pin
The bi-metal coil bends towards
the contact screw as it cools
Moving the temperature control lever
moves the bi-metal coil
Power to heaterPower in

Temperature Control Lever
Fixed Contact Screw
50 | | | | | 60 | | | | | 70 | | | | | 80 | | | | | 90
Moving Contact
Magnet*
Temperature Indicator Pin

The bi-metal coil bends tow
the contact screw as it cool
Moving the temperature control lever
moves the bi-metal coil

The bi-metal coil bends towards
the contact screw as it cools
he temperature control lever
he bi-metal coil
The bi-metal coil bends awa
the contact screw as it warm

metal coil bends towards
act screw as it cools
The bi-metal coil bends away from
the contact screw as it warms

FITC
What if you wanted to redesign this system
without knowing its inner workings?

Cold air outside
ismeasuredby
canincrease
input
output
Bi-metal coil Heater
System
Desired temperature e.g. 68º
air temperature in the room
lowersthe
. . . is indicated by adjusting the
temperature control lever
which in turn moves the bi-metal coil;
increasing the desired temperature
moves the coil closer to the contact point;
decreasing the desired temperature
moves the coil further from the contact point
Why does a bi-metal coil bend?
bi-metal coils consist of two layers of metal
(usually iron and copper)
joined together to form one flat strip;
because the metals have different coefficients
of expansion, the strip will bend
in one direction as it cools, and the opposite
direction as it warms
Contact point. . .bends to touch the. . . .
(as it cools)
external
electrical source
. . .bends the opposite
direction to lose
contact with the. . .
(as it warms)
. . . . which sends a signal to the. . .
. . . . thus no signal is sent,
and the heater shuts off...sendscurrentto...
January 2010 | Developed by Paul Pangaro and Dubberly Design Ofﬁce
Thermostat regulating room temperature
(via a heater)

ismeasuredby
input
Bi-metal coil
System
(as it cools)
external
electrical source
direction to lose
(as it warms)
. .
. .
...sendscurrentto...

canincrease
output
Heater
System
Contact point . . . . which sends a signal to the. . .
and the heater shuts off

Cold air outside
System
lowersthe
direction to lose
(as it warms)
o and Dubberly Design OfﬁceAfter Paul Pangaro, Hugh Dubberly

Cold air outside
ismeasuredby
canincrease
input
output
Bi-metal coil Heater
System
Desired temperature e.g. 68º
lowersthe
. . . is indicated by adjusting the
temperature control lever
(as it cools)
external
electrical source
direction to lose
(as it warms)
. . . . which sends a signal to the. . .
...sendscurrentto...
(via a heater)

System
Goal
Environment
Disturbances
a Comparator
isembodiedin
subtracts
the current state value
from
the desired state value
to determine
the error
ismeasuredby
affectsthe
. . . describes a relationship
that a system desires to have
with its environment
. . . may be characterized as certain types
typically falling within a known range;
but previously unseen types may emerge
. . . has
resolution – (Accuracy)
frequency – (Latency)
range – (Capacity)
. . . has
resolution
frequency
range
canaffectthe
input
output
a Sensor passes the current state value to . . . . . . . . . . responds by driving an Actuator

https://www.youtube.com/watch?v=oOvVLOTF078

2nd Order System | Created by Dave Mahmarian | Tue Apr 05 2016
Second Order Cybernetic Model: Samsung NaviBot Robot Vacuum
DISTURBANCES
(Bumping)
SENSOR:
MEASURES
FULLNESS OF BIN
INPUT
OUTPUT
ACTUATOR:
MOTOR WHICH
UNLOADS DIRT
Observed System
Goal:
To automatically unload the dirt at the charging station
Moves through it’s
environment while
vacuuming. System
learns pattern over time
Comparator:
Compares the size of the bin to
the amount of dirt it has collected
Will return to charging
station to unload dirt
when the bin is full
System gets smarter by
learning environment and
avoids disturbances
Has the ability to self-
correct if it does encounter
a disturbance
System will collect
dirt and sense the
level in the bin
The NaviBot will return to the charging station
when it senses that the power is running low
SENSOR:
VSLAM (IR)
Observing System
INPUT
OUTPUT
Comparator:
compares where it’s been to where it
needs to go to complete the pattern
Goal:
Complete the learned cleaning pattern at a speed of 100mm/second
ACTUATOR:
MOTOR
Senses the
environment using
mapping technology

DISTURBANCES
(Bumping)
SENSOR:
MEASURES
FULLNESS OF BIN
INPUT
OUTPUT
ACTUATOR:
MOTOR WHICH
UNLOADS DIRT
Observed System
Goal:
To automatically unload the dirt at the charging station
Comparator:
Compares the size of the bin to
the amount of dirt it has collected
Will return to charging
station to unload dirt
when the bin is full
System gets smarter by
learning environment and
avoids disturbances
Has the ability to self-
correct if it does encounter
a disturbance
System will collect
dirt and sense the
level in the bin
stem
te the pattern

FITC
The Automation Revolution will be driven
by smart, connected, self-regulating systems
like the Nest thermostat and the Tesla
automobile. Feedback is the mechanism that
closes the loop in self-regulating systems.

Feedback
Conversation
Language
Research
Interface
Systems thinking
<code>

FITC
@michaelryap

What is the Material of UX?

More Related Content

What's hot

Similar to What is the Material of UX?

More from FITC

Recently uploaded

What is the Material of UX?