The Design of Everyday Games
100
The Design of Everyday Games
-
Upload
christina-wodtke -
Category
Design
-
view
1.377 -
download
0
Transcript of The Design of Everyday Games
The Design of
Everyday
Games
Associate Professor, California College of the Arts@cwodtke | eleganthack.com
Christina Wodtke
Apple’s Cargo Cult
OW! MY EYES!
User Interface
Interaction Design
Information Architecture
User Psychology
Concept Models
"User experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products.
Don Norman
Let’s be honest: It’s all about the smiling boxes.
The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother.Don Norman
A) Amazon understands I always run out of razors!B) Amazon understands I have no clue how often to buy them!
Next comes simplicity and elegance that produce products that are a joy to own, a joy to use. True user experience goes far beyond giving customers what they say they want, or providing checklist features.
Don Norman
In order to achieve high-quality user experience in a company's offerings there must be a seamless merging of the services of multiple disciplines, including engineering, marketing, graphical and industrial design, and interface design.
Don Norman
WHAT IS USER EXPERIENCE?
The mini cooper convertible has my favorite car experience. The way it handles, accelerates as well as the beautiful interior, the innovative half-open position of the roof!.
But the experience doesn’t stop at the car. There are stickers, swag, driving adventures, dedicated AAA support for the life of the car and music services! What does it mean to enjoy driving a car, they asked… then answered.
User Experience Design:
the design of anything
independent of medium
or across [device]
with human experience as an explicit outcome
and human engagement as an explicit goal
-Jesse James Garrett
Jesse James Garrett
UI
IxDIA
The User
Copywriting Graphic Design
MA
RK
ET
ING
CU
ST
OM
ER
SE
RV
ICE
Pre-use Use Post-use
User experience designKey word is USE
Things you should know
UNIVERSAL PRINCIPLES
● Affordances
● Feedback
● Direct Manipulation
● Standards UI
IxDIA
“Like putting an
Armani suit on Attila
the Hun, interface
design only tells how
to dress up an
existing behavior.” –
Alan Cooper
AFFORDANCESThings that look pushable, get pushed. Things that look pullable, get pulled.
UI
IxDIA
AFFORDANCES
UI
IxD
IA
Buttons that look pushable, get pushed
Forms should say “type here”
See: Flat UI and Forms by JESSICA ENDERS
MEANING
Links, buttons and inputs are not decorative. They tell a story.
UI
IxD
IA
UI
IxD
IA
BUTTONS HAVE MEANING
LINKS HAVE MEANINGUI
IxD
IA
You are always communicating.
Don’t be rude.
Set expectations, meet expectations
UI
IxD
IA
FeedbackLet people know it worked
UI
IxD
IA
Feedback
On Facebook, they show the link preview as soon as you add it, so you know all is working (and can preview)
UI
IxD
IA
Feedback
Your new status is always posted on top, to let you know it was successfully posted (even if a new status came in a second after, and is thus newer)
UI
IxD
IA
Alphabear won’t embarrass me socially
Recognition over recall
Seeing is easier than scavenger hurtsUI
IxD
IA
Don’t do thisDon’t make people memorize where things are!
UI
IxD
IA
Variation Unique Visitors Unique Clicks
Hamburger 120543 1211
Menu 121152 1455
Unique
Visitors
Hamburger
Clicks
% Menu Clicks %
iOS 148097 906 0.61% 1143 0.77%
Android 87245 216 0.25% 237 0.27%
UI
IxD
IA
UI
IxD
IAPJ McCormick, Challenging Data Driven Design, WarmGun 2013
UI
IxD
IA
PJ McCormick, Challenging Data Driven Design, WarmGun 2013
What do these dots
mean?
UI
IxD
IA
PJ McCormick, Challenging Data Driven Design, WarmGun 2013
UI
IxD
IA
PJ McCormick, Challenging Data Driven Design, WarmGun 2013
UI
IxD
IA
PJ McCormick, Challenging Data Driven Design, WarmGun 2013
The navigation carries information.
Unless:
Clear affordances + Recognition over recall
UI
IxD
IA
USE CLEAR LANGUAGE 58
UI
IxD
IA
Direct Manipulation
Harry Potter Years 1-4 on IpadDirect Manipulation
Harry Potter Years 5-7 on IpadVirtual Controller
Contextual Principles● What you know about the context/users/activity. E.g.
● Recipes must be scannable
● User should know where they are in a recipe
● Recipes allow users to find ingredients for shopping and mise en place by listing them apart from instructions
UI
IxD
IA
Tivo Tennants●It’s entertainment, stupid.●It’s TV, stupid.●It’s video, dammit.●Everything is smooth and gentle.●No modality or deep hierarchy.●Respect the viewer’s privacy.●It’s a robust appliance, like a TV.
FarmVille 2 Postmortem: What Grew Wild & What Withered Away: Wright Bagwell, Mike McCarthy
Things you do
OBSERVE
from IDEO’s Designkit.org
67CONTEXTUAL INQUIRY, FIELD STUDIES, & ETHNOGRAPHY
http://www.flickr.com/photos/halversongroup
ANALYZE
from IDEO’s Designkit.org
CHUNK
FINDINGS
INTO AFFINITY GROUPS
Play with possible models
Relationship to other data
Credit: Steve Portigal
MAKE
COMMUNICATE START HERE:
CONCEPT MODELS
We explain things with pictures all
the time. How to conceive, how to
build…
CONCEPT MODEL: a visual
representation of a set of ideas
that clarifies their meaning for
both the thinker and the
audience
Concept models for ideas
See http://boxesandarrows.com/how-to-make-a-concept-model/
Concept Models to Communicate to team
Architecture concept model
User
Designer
Computer designed by Daniel Shannonfrom The Noun Project
Mental
model
Conceptual
model
1. Discover
Mental Model
2. Understand
system
3. Synthesize
into conceptual
model
System
For Software,Concept modeling proces
How areas of site interlock
Via Andrew Hinton@inkblurt
Consider conceptual models over sitemaps
Stone Librande’s One Page Designs are concept models
Flows
Paula Scher modelled out the approval process at CBS records in hope of saving her sanity.
8
7
Content Models & Information Architecture
https://www.interaction-design.org/literature/article/what-is-information-architecture
Organizing content (like inventory, collections, etc)
And yes, User Interface.
WHAT MUST BE DONE WELL
UI
IxDIA
The User
Observe & Understand
OrganizeContent
Design Behavior
Communicate Clearly
USER EXPERIENCE DESIGN IS A BIG JOB
Too big?
95 dan saffer
UI
IxDIA
The User
Copywriting Graphic Design
MA
RK
ET
ING
CU
ST
OM
ER
SE
RV
ICE
The Heart of UX is Small● Start with the user: her
goals, needs and habits
● Follow known principles
● Finish with the user, test during design.
● Everyone must care for the user.
It’s all about the
USER’S
EXPERIENCE
DISCUSSION
LEARN MORE
Don’t Be This Guy
@cwodtke
Why I am Not a Painter
Frank O'Hara
I am not a painter, I am a poet. Why? I think I would rather be a painter, but I am not. Well,
for instance, Mike Goldberg is starting a painting. I drop in "Sit down and have a drink" he says. I drink; we drink. I look up. "You have SARDINES in it." "Yes, it needed something there." "Oh." I go and the days go by and I drop in again. The painting is going on, and I go, and the days go by. I drop in. The painting is finished. "Where's SARDINES?" All that's left is just letters, "It was too much," Mike says. But me?
One day I am thinking of
a color; orange. I write a line
about orange. Pretty soon it is a
whole page of words, not lines.
Then another page. There should be
so much more, not of orange, of
words, of how terrible orange is
and life. Days go by. It is even in
prose, I am a real poet. My poem
is finished and I haven't mentioned
orange yet. It's twelve poems, I call
it ORANGES. And one day in a gallery
I see Mike's painting, called SARDINES.
