SlideShare ist ein Scribd-Unternehmen logo
1 von 220
Downloaden Sie, um offline zu lesen
Juhan’s Weight and Frequency of Sex


    First job   RingDisc Break up w/GF          New job Married   Udo born   Startup



+




-

    1994               1998              2002              2006                  2010
Sex and Design Axioms
lots of books on design guidelines, apis, usability, forms, css...
We need an
INTERFACE
DESIGN
field guide.
              for the craftsman
              less words, more visuals
              real examples
              free
              constantly evolving
              <100 pages
Photos by Alvero Carnicero
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
System approach
to design.

                  for the technically savvy artist

                  typography
                  color theory
                  composition
                  layout
                  code
                  usability
                  interaction design
                  customer service
INTERFACE     Data
            • Let data scream
DESIGN      • Reality Bites
AXIOMS          Feedback
            •   Prototype like crazy
            •   Pixel Perfect
            •   Bitch! Loud and often
            •   Eat your own dog food
            •   Stop seeking approval
            •   Date your users

              Layout
            • Grid it
            • Type less + less type
            • Color carefully

                Interaction
            •   What interface?
            •   Repeat customers ROCK
            •   Deja vu all over again
            •   Get physical
            •   Lust to Dust
c re a m
          a ta s
L e t d
Photo by ktempest
Photo by Mex Beady Eyes
Photo by kvanhorn
Sex and Design Axioms
hierarchy, priority = ?
Photo by jeffwilcox
Photo by kvanhorn
Name
Contact
Message
Company
Sex and Design Axioms
Sex and Design Axioms
1/4”
18pt



       Photo by danperry.com
Rightsizing text




There is a formula for determining the
size of a conference badge/name tag
... so that it’s legible from 10 feet.

http://www.hf.faa.gov/Webtraining/VisualDisplays/text/size1a.htm
Visual Angle Formula
For small visual angles (<10 degrees)


VA (in minutes) = (3438 x H)/D
             H = (VA x D)/3438
Visual Angle Formula

  Visual Angle Legibility                  Condition
    (minutes of arc)


          60            Excellent          visually impaired w/low vision

          25            Good               important/dynamic text

          20            Fair               important/dynamic text

          15            Poor               even w/normal vision and static text


20/20 vision is the ability to resolve a spatial pattern separated by a visual angle of 1 minute of arc.
For badges...
                         10 feet away




                         }
                    H = (VA x D)/3438

everyday reading
                    H = (25 x 120 inches)/3438
                    H = 0.9 inches
lower light,        H = (60 x 120 inches)/3438
visual impairment
                    H = 2.1 inches
@ 10 feet away
H = 0.9 inches
H = 70 points    Kate
@ 10 feet away
H = 2.1 inches
H = 145 points
Sex and Design Axioms
Size matters.
So does
typeface,
serif/non-serif,
height-to-width ratio,
spacing,
leading, and
color.
For business cards...
                    2 feet away




                         }
                    H = (VA x D)/3438

everyday reading
                    H = (25 x 24 inches)/3438
                    H = 0.17 inches (12.25pt)
lower light,        H = (60 x 24 inches)/3438
visual impairment
                    H = 0.42 inches (27pt)
H = 0.125 inches (9pt)   H = 0.2 inches (13pt)
H = 0.125 inches (9pt)   H = 0.2 inches (13pt)   H = 0.40 inches (26pt)
Size matters. Don’t be afraid of going   BIG   .
Math is on your side.
Wikipedia Concept Extractor
http://sourceforge.net/projects/conceptextract/
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
Ink and lines scream
  Data disappears

  Violates all 5 Tufte principles
  Five principles produce substantial changes in graphical design:

1. Above all else show the data.
2. Maximize the data-ink ratio (i.e., the % of ink that shows data).
3. Erase non-data ink.
4. Erase redundant data-ink.
5. Review and edit.
Clear, data-dense display




NYTimes
PROJECT            CUSTMR    STE   BURN     TOTAL $   ODC    STAFF   WTCH    SPEND

NCOI                         354   -35.1      18m     18m     498      10
AFMSTT             AF AFMC     4    -2.0       16k     16k      4       1
C2C                AF ESC      3    -1.2       14k     14k      3       1
SBR                AF MC       5      ...      25k     25k      5       1
AFTERPS            AF ESC      6    -5.7       20k     20k      6       2
GATM               AF ESC     12    -2.0       20k     20k     12      ...
CCS-C              AF ESC      3    -1.4       30k     30k      3       2
JPALS              AF PENT     4    -1.6       16k     16k      4       1
MACS               AF ESC      6    -2.3       14k     14k      6      ...
NAS                AF ESC      3    +1.0       25k     25k      3      ...
NGATS              AF MC      11      ...      20k     20k     11       1
639TH                         29    +3.9       2m      2m      41       8
DIRECT             AF ESC     14    +2.0       16k     16k     14       2
GEMS               AF ESC      1    +1.0       14k     14k      1       1
KG-3X              AF ESC      6      ...      25k     25k      6       1
MMP                AF ESC      2      ...      20k     20k      2       2
MSI                AF ESC      3    +1.0       20k     20k      3      ...
STRATEGIC & TACT              45    -7.2       5m      5m      62       7
ABN LASERCOM       AF ESC      1    -3.7       30k     30k      1       1
ADVANCED PLANS     AF ESC      5      ...      20k     20k      6       1
AIT                AF PENT     3      ...      14k     14k      3      ...
CSEL PROGRAM       AF ESC      4    +1.0       25k     25k      4      ...
FAB-T              AF ESC     14    -1.3       20k     20k     14      ...
GMS PROGRAM        AF ESC     12      ...      20k     20k     12       2
GMT                AF ESC     18      ...      30k     30k     18       2
HDR RF             AF ESC      3    -2.5       16k     16k      3      ...
TDC                AF ESC      4      ...      14k     14k      4      ...
TSAT-SE&I          AF DOD      5      ...      25k     25k      5      ...
TSAT-TE            AF ESC      1    -0.2       30k     30k      1       1
BMSW                         254   -12.1      18m     18m     295      18
AFMSTT             AF AFMC     4    -2.0       16k     16k      4       1
C2C                AF ESC      3    -1.2       14k     14k      3       1
SBR                AF MC       5      ...      25k     25k      5       1
AFTERPS            AF ESC      6    -5.7       20k     20k      6       2
GATM               AF ESC     12    -2.0       20k     20k     12      ...
CCS-C              AF ESC      3    -1.4       30k     30k      3       2
JPALS              AF PENT     4    -1.6       16k     16k      4       1
MACS               AF ESC      6    -2.3       14k     14k      6      ...
NAS                AF ESC      3    +1.0       25k     25k      3      ...
NGATS              AF MC      11      ...      20k     20k     11       1
533TH                         29    +3.9       2m      2m      41       8
DIRECT             AF ESC     14    +2.0       16k     16k     14       2
GEMS               AF ESC      1    +1.0       14k     14k      1       1
KG-3X              AF ESC      6      ...      25k     25k      6       1
MMP                AF ESC      2      ...      20k     20k      2       2
MSI                AF ESC      3    +1.0       20k     20k      3      ...
CYBERTECH                     45    -7.2       5m      5m      62       7
ABN LASERCOM       AF ESC      1    -3.7       30k     30k      1       1
ADVANCED PLANS     AF ESC      5      ...      20k     20k      6       1
AIT                AF PENT     3      ...      14k     14k      3      ...
CSEL PROGRAM       AF ESC      4    +1.0       25k     25k      4      ...
FAB-T              AF ESC     14    -1.3       20k     20k     14      ...
GMS PROGRAM        AF ESC     12      ...      20k     20k     12       2
GMT                AF ESC     18      ...      30k     30k     18       2
HDR RF             AF ESC      3    -2.5       16k     16k      3      ...
TDC                AF ESC      4      ...      14k     14k      4      ...
TSAT-SE&I          AF DOD      5      ...      25k     25k      5      ...
TSAT-TE            AF ESC      1    -0.2       30k     30k      1       1
Beauty
alone is
lovely....
Aim for beautiful and useful.
... they’re not mutually exclusive.
ID Magazine
Sex and Design Axioms
Less ink.
More bang.
There’s not much we can do with

shit data
... other than create or find better data
... or point out how shitty that data really is
Specious data and viz masquerading as validated and thorough results.
Sex and Design Axioms
Lovely poster by Jess Bachman
Let’s jam on this beautiful art
and make the data sing.
hard for humans to diff
Sex and Design Axioms
This isn’t working beautifully... yet.
as seen in adbusters
US Budget in 2009
                  (Dollar amounts in billions)



Non-Discretionary 2,000
Discretionary     1,000

Total             3,000
US Budget in 2009
          (Dollar amounts in billions)



Non-Discretionary Discretionary

2,000             1,000


Total = $3 trillion
US Budget in 2009
                      (Dollar amounts in billions)



            Non-Discretionary Discretionary
OMB
            2,000             1,000
                                         Black Ops
NYTimes
            2,000             1,100      40

Adbusters
            2,600                1,500        300
US Budget in 2009
                             (Dollar amounts in billions)



                   Non-Discretionary Discretionary
OMB
                   2,000             1,000
                                                Black Ops
NYTimes
                   2,000             1,100      40

Adbusters
                   2,600                1,500        300

Bailout + Wars +
                   2,600                1,500        300 1,800

                   Total = $6.2 trillion
Fun = integral in adoption and use

Clarity and data truth = key for
understanding

Work both.
by Brian Staats
Sex and Design Axioms
Jam on this data:


data.gov
The Theatre of Interface
software = a visual medium


Let data scream
= all about staging the scene in theatre
Backgrounds and 2ndary objects
= designed not to distract the
  audience from the action




Most screens show too much.
Think in visual terms first
= expression, action, sound
affect, music...

Then the dialog tells
something about the
product... and not the
exposition.




Exaggerated features
nose, hair, attitude,
physique, clothing
Software is staged.

Software interface design
= a series of scenes which need to be
interesting, staged, and ruthlessly
edited.
Sex and Design Axioms
Sex and Design Axioms
38%
Priorities, hierarchy

   1 filtering
   2 navigating
     ....
     ....
     ....
last patient data
Sex and Design Axioms
95%
  60%
40%

        35%
92%
90%
Let data scream



                  85%
92%   Wufoo
90    Graffle
88    Pages
82    Word
                  of the page space should
                  be for data, the actual
                  workspace
http://regex.info/i/LightroomIchigo.jpg
http://regex.info/i/LightroomIchigo.jpg
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
labels as interface (filtering)




                                                   data as interface
                                                   (direct manipulation)




labels as interface (filtering)             grid as 2ndary player
Let data scream

the data is THE story
size matters: big n’ juicy
less ink, more bang
shit data = shit displays
beautiful and useful
stage your data
85% rule
Reality
bites
Sex and Design Axioms
design with fake data = fake design
Sex and Design Axioms
Sex and Design Axioms
LOREM IPSUM
Use real data
1. Real data needs to be grokked by YOU.


See the data, know the data.
Find the core stories.
2. Real data has a min-max.

Data story and interface has to
accommodate ALL THE DATA,
including crazy data points

Key outliers = ?
Firstname Lastname

Firstname Lastname

Firstname Lastname

Firstname Lastname

Firstname Lastname

Firstname Lastname



Andrei Herasimchuk              Pick 2 ends of the data
                                spectrum (the extremes).
Dirk Knemeyer                   Impact on design = ?

Kriengsak Niratpattanasai

Tiff Biset

Katrina Penruddocked-Longoria

Juhan Sonin
3. Amplify real data


Not much we can do with shit data...
  ...but point out how shitty the data really is.

Can you make it cleaner, better... find
better data?
Can users make it better?
Mark the differences = CONTRAST
Sex and Design Axioms
4. Real data = real feedback
            = forces people to
              make real decisions

You, your colleagues, testers, early
adopters, can give higher fidelity
feedback.
How do I give meaningful feedback on
Lorem Ipsum?
Describe your hospital experience:

Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diam nonummy nibh
euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat. Ut wisi enim ad minim
veniam, quis nostrud exerci tation ullamcorper
suscipit lobortis nisl ut aliquip ex ea commodo
consequat.



                                                  Which one
Describe your hospital experience:
                                                  makes sense?
Walking into Beth Israel alone for major
surgery was a bit unnerving. I had never been
to the surgery level; it was a breeze to find
with the well-placed signage.

The was no queue for check-in. I gave the
admin a few data points and within 40
seconds, I was twittling my thumbs waiting for
the big red door to swing open, my doc to
jump out and stab me in the arm with a
sedative, and start cutting. I was pleasantly
surprised.
Sex and Design Axioms
misspellings



# of data
bigger width




not all data
is equal


all caps
Sex and Design Axioms
5. Real data won’t blow up production
If you don’t have access to real data,



craft it.
Reality bites

design with fake data = fake design
ban lorem ipsum
use real data
real data = real feedback = real decisions
Prototype
like crazy
= sketch
= prototype
= sketch/comp
= prototype
prototype =
working, touchable, clickable, feelable,
chewable service

could be feature lean (like 1 lonely but
acting function)
or using a temporary data engine/model
or...


You can
Or lick it.
              USE it.
Hand meet pencil
= sketch
big bang theory =

broken deadlines,
late compromises,
craptastical services
illusion of
project
management
Make a giant to-do list

... from product tasks to
tiddly startup jobs like
getting trash bins and
slippers

and print it BIG.
Churn baby churn!
        35
My eyes hurt.
Sex and Design Axioms
Sex and Design Axioms
Merry Christmas!
Sex and Design Axioms
OSS&E        show summary export
Last updated 2 weeks ago



                    Project X4.0                                      Project X4.2                                                        Project X4.5
                   -6m     -3m   Now                                 -6m    -3m   Now                                                    -6m   -3m       Now
                                       6   Full Compliance                              6    Full Compliance                                                   6   Full Compliance
                                       5   Process, Certification                       5    Process, Certification                                            5   Process, Certification
                                       4   SLA, Sustainment                             4    SLA, Sustainment                                                  4   SLA, Sustainment
                                       3   Implementation Plan                          3    Implementation Plan                                               3   Implementation Plan
                                       2   Processes Established                        2    Processes Established                                             2   Processes Established
                                       1   Self Assessment                              1    Self Assessment                                                   1   Self Assessment
                                       0   System Identified                            0    System Identified                                                 0   System Identified




                                                                      CLICK FOR FULL SCHEDULE




                                                              2005   2006                   2007      -6m   -3m       Now
                                                                                                                            6   Full Compliance
                                                                                                                            5   Process, Certification
                                                                                                                            4   SLA, Sustainment
                                                                                                                            3   Implementation Plan
                                                                                                                            2   Processes Established
                                                                                                                            1   Self Assessment
                                                                                                                            0   System Identified
WATCHLIST           show summary export
Last updated 1 week ago
                                                                                        State
Issue                                                                            -6m   -3m Now   Level     Weeks old   2006   2007   2008     2009   Get well by   Principle Effect   OPR
Useage of Project X4 over COP radars at risk due to incompatibility..                            PRG            57                                   31 Dec 08     Cost               McCormack, Lee
Baseline Project Management with KPIs                                                            PRG            86                                   31 Dec 08     Technical          McCormack, Lee
Definition of low bandwidth routers installed on site with...                                     PRG            48                                   26 Jul 08     Technical          Battle, Guy
Program Performance of Reorganized Project X4 Team                                               PRG GRP        86                                   31 Dec 08     Schedule           McCormack, Lee
Software Requirements in flux                                                                     PRG            86                                   20 Dec 08     Technical          Battle, Guy




LEADING INDICATORS                  show summary export
Last updated 3 weeks ago

                                             CONTRACTOR      GOVERNMENT
                                                   State           State           Comments
Leading Indicator                            -6m   -3m Now   -6m   -3m     Now     Contractor                                               Government

Processes
Resources
Requirements                                                                       Lack of concrete deliverables from AF.
Engineering Documentation
Risk Handling                                                                      Adverse working environment in desert..                  On-site development process failing..
Risk Exposure Trends
Interfaces, Integration, Interoperability,
   and Interdependencies                                                           Dependence on 3rd party (Disaster Inc)..                 Vendor cross-communication is di!cient..
Software Development                                         na
Hardware Development                                         na
Verification and Validation
Review Action Closure Trends
Sex and Design Axioms
Sex and Design Axioms
Get criticism.
Early and often.
This data
doesn’t make
 any sense.
How about...




               Where’s the
                timeline?
Be shameless.
Prototype everywhere.


Nurses
Doctors
Administrators
Insurance agents
Friends
Friends who are in Health
Family
Lawyers
Engineers
Designers

Any nitwit who wouldn’t
walk away from me...
Design critiques

Informal, formal. Daily, weekly, monthly.

Andy Grove engagement model: honest, critical
feedback to fellow colleagues (gnaw on the idea, not
the individual)... to make our ideas better.

Changing the trust model with staff... and the
customer (a la FedEx did with package delivery).
Edit, edit, and edit
first started at MITRE
now...
         Brian O’Neill
         Brian Haven
         Kerry Bodine
         Kate Sonin
         Dave Bedingfield
         Chris Doellner
         Rob McCready
         Ayal Spitz
Big prints = bigger impact


Print designs - and task lists - BIG...

obnoxious big.
It’s in your face and you can’t ingore it.
You can see your design.
Small plotters (like an
                     HP DesignJet 130) =
                     $1k




My preference =
go nuts and get an
Epson 9900.
Sex and Design Axioms
Big prints for designers, engineers, project leads
to hover around =
excellent method for on-the-fly critiques

Sending clients big prints of their work =
bigger smiles
Sex and Design Axioms
Sex and Design Axioms
Prototype like crazy

prototype = working service
big bang theory = low percentage shot
hand meet pencil
churn baby churn
get criticism early and often
buddy up
print big
Pixel Perfect
14 point Gill Sans @ 3200% zoom
Wireframes = sketches, gross screen
design (still as a sketch), ideas
Just like theatre.
Start with a sketch =
Abstract, rough interpretation of
behavior, story, objects and grouping
Sketching = we’re filling in the gaps
Low barrier of entry, low fidelity
Brainjamming, idea generation


= the power of sketching
Sex and Design Axioms
flickr: adactio   flickr: yandle
by Sloan Kulper
Sketch like a maniac,
...then move to machine-like precision with pixels.


No sketch-ish interface design in pixels.
Sketches stay on paper.
screen = any rendering on a cpu, any
instantiation of an interface using
pixels
pixel = 1 or 0, ON or OFF
precision, absolute
color, placement/layout...
Doing a ‘wireframe’ (on screen) and
ignoring type, grid, data, and behavior
= laziness
Sex and Design Axioms
low fidelity sketches
vs
high fidelity comps


Which are you going to get better
feedback with?
Sex and Design Axioms
Sex and Design Axioms
higher fidelity screens =
higher fidelity feedback
Print BIG
Design every pixel
~0.5 inch




3200% zoom
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
No half pixels
= muddy edges and
  won’t align in code, on screen
on the half pixel = a no-no
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
Sex and Design Axioms
Pixel perfect

draw baby, draw
skip wireframing, go directly to pixel jockeying
design every pixel
Repeat
customers
rock
Sex and Design Axioms
Sex and Design Axioms
Polarizing   Inclusive
Coke,
             Pepsi

Polarizing   Inclusive
Banana Rep,
BMW,         Toyota,
Apple,       Coke,
Harley       Pepsi,

Polarizing   Inclusive
Banana Rep,
BMW,                                 Toyota,
Apple,                               Coke,
Harley                               Pepsi,
               You’re Screwed Zone

Polarizing                           Inclusive


Premium Price
Differentiated Product
Intensity of Emotion
Apostle
Buyer
Prospect
Skeptic
Cynic
Apostle
           User Experience
Buyer
           Value Prop
Prospect
           Performance
Skeptic
           Facts
Cynic
Apostles are delighted
customer delight = delivered service
                   -
                   expected service
                   need, desire, promises, want, quality, past
                   performance, competition
delight = expectations

D<E        D=E                 D>E
∆ customer delight




D<E        D=E             D>E
∆ customer delight

                                   DELIGHT LEVELS




D<E        D=E                          D>E




                 Keep promises
                 Manage expectations
                 Learn service recoveries
∆ customer delight

                                               NEW DELIGHT LEVELS




                          PREVIOUS DELIGHT LEVELS




D<E   D=E                                           D>E




            Over time, it’s more difficult to deliver
            delightful services.
You want experienced users to:

• tell their friends about it
• demand other services to hook into it
• make their work products better
• make users happy (by being efficient)
• purchase upgrades, future products
ipod
iphone
GIT
RoR

Polarizing   Inclusive
Polarizing   Inclusive
Apostles = pissed

cell reception
wayfinding
reconfigurable space
maintenance




Polarizing            Inclusive
Design for repeat customers
Sex and Design Axioms
1,500
 decisions/sec
Veteran



Nimble

Capable
Hazard

          0 1 hour   10           100               1000   10,000


                          Driving experience in hours
tur
              nr
               igh
                        turn on




                   t
                       headlights                                     turn on
                                                                    hazard lights




honk here



                                    radio channel up channel down




            Explicit instruction = drive
            myself to the funny farm.
Beginners aren’t
beginners for long.
Don’t Make Me Think
= fabulous mantra.

Works most of the time.
It should just feel right.

.... but not always true.
Start posting in 10 seconds.
Sex and Design Axioms
vs
vs   vs
Expert

Intermediate

Beginner
           T                                                          WTF am
                                                                      I doing??
           Opening a      Writing, image editing,    ??   Parenting
           beer, $ from   professional reputation,
           an ATM,        farming
           finding music
           on an ipod
More powerful rewards

Expert

Intermediate

Beginner
           TIME    <T



           “It has to be easy.”
           “Noobs need to
                                  Most of the things worth
            instantly get it.”    doing, require learning,
           “No learning
            curve.”               effort, and our time.
Make a service ROCK:


1
st for the repeat, more experienced user,


2
nd for the novice, and finally


3
rd for the inexperienced user.



    Using this order = designing products
    that will pass the test of time

    HECKEL, HERASIMCHUK, TUFTE
>3 billion pages
Beginner    Intermediate    Advanced

keyword     keywords++      query operators
keywords    exact matches   ~
sentences   OR, AND, NOT    hacks
Beginner

standard objects
location
extruding

No single paths through a service
Intermediate

construction
composition
lighting
Advanced

numeric modeling
complex systems
rendering
Repeat customers ROCK!

polarize your audience
delight your apostles
design for intermediates first
design multiple paths through a service
So what?
DESIGN MATTERS
     adoption
       usage
    fun factor
     learning
   expectations
      impact
    reputation
customer delight = remarkable service
                   performance
                   &
                   service wildly
                   exceeds my
                   expectations
Global issues

1   Education
2   Energy
3   Population control
4   Food
5   Clean water
6   Sanitation
7   Open governance
8   Fiscal parity
9   Health
Interface to Energy




                                               Out of sight, out of mind



                      photo by Adventure Ken
Sex and Design Axioms
Sex and Design Axioms
Do the small stuff right...

and let the beautiful stuff
emerge naturally.
Special thanks to       CC Photo Credits

Harry Sleeper           Alvaro Carnicero
Paul Kroft              Luiz Castro
Mike Nosal              Chris Jordan
Dirk Knemeyer           GotPlaid
Rani Manoharan          Mibi
Brian Staats            NoiseCullusion
Andrei Herasimchuk      OakleyOriginals
Camille Goudeseune      Oliver Orloff
Brian Haven             Optiglot
Rob McCready            Juhan Sonin
Chauncey Wilson         Syvwich
Abigail Kirigin         Stefan Thiesen
                        Tushyd
and all of the people   Wizum
who have elevated my
design and life IQ...

and Kate Sonin.
designaxioms.com
SEX
DESIGN
             &




AXIOMS
Juhan Sonin
juhan@mit.edu
designaxioms.com

Weitere ähnliche Inhalte

Andere mochten auch

introduccion y organizacion del sn- victor mendez
 introduccion y organizacion del sn- victor mendez introduccion y organizacion del sn- victor mendez
introduccion y organizacion del sn- victor mendezReina Celis
 
89 linee operative per l’organizzazione aziendale
89   linee operative per l’organizzazione aziendale89   linee operative per l’organizzazione aziendale
89 linee operative per l’organizzazione aziendalehttp://www.studioingvolpi.it
 
Cloud connect winter 2012
Cloud connect   winter 2012Cloud connect   winter 2012
Cloud connect winter 2012Mark Casey
 
Preparando el Terreno Cap 1 al 3
Preparando el Terreno Cap 1 al 3Preparando el Terreno Cap 1 al 3
Preparando el Terreno Cap 1 al 3bebusiness
 
Mòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrqueting
Mòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrquetingMòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrqueting
Mòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrquetingDigital Granollers
 
Whitepaper transportation procurement_payment
Whitepaper transportation procurement_paymentWhitepaper transportation procurement_payment
Whitepaper transportation procurement_paymenttashikoma
 
Curso Drupal 7 SiteBuilding parte 2
Curso Drupal 7 SiteBuilding parte 2Curso Drupal 7 SiteBuilding parte 2
Curso Drupal 7 SiteBuilding parte 2Alessandro Mascherpa
 
Programa Instalador Amor
Programa Instalador AmorPrograma Instalador Amor
Programa Instalador Amormarcelarioss
 
Manual de identidad visual corp
Manual de identidad visual corpManual de identidad visual corp
Manual de identidad visual corpNatacha Castillo
 
All Physicians re everything 11-03-14
All Physicians re everything 11-03-14All Physicians re everything 11-03-14
All Physicians re everything 11-03-14Betsy Labick
 
Camfed 2013 Annual Report
Camfed 2013 Annual ReportCamfed 2013 Annual Report
Camfed 2013 Annual Reportcamfed
 

Andere mochten auch (14)

introduccion y organizacion del sn- victor mendez
 introduccion y organizacion del sn- victor mendez introduccion y organizacion del sn- victor mendez
introduccion y organizacion del sn- victor mendez
 
89 linee operative per l’organizzazione aziendale
89   linee operative per l’organizzazione aziendale89   linee operative per l’organizzazione aziendale
89 linee operative per l’organizzazione aziendale
 
Tema 1 qué es filosofíax
Tema 1 qué es filosofíaxTema 1 qué es filosofíax
Tema 1 qué es filosofíax
 
Cloud connect winter 2012
Cloud connect   winter 2012Cloud connect   winter 2012
Cloud connect winter 2012
 
Preparando el Terreno Cap 1 al 3
Preparando el Terreno Cap 1 al 3Preparando el Terreno Cap 1 al 3
Preparando el Terreno Cap 1 al 3
 
Mòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrqueting
Mòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrquetingMòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrqueting
Mòdul 2 Curs iMàrqueting -Us dels Blogs per fer màrqueting
 
Whitepaper transportation procurement_payment
Whitepaper transportation procurement_paymentWhitepaper transportation procurement_payment
Whitepaper transportation procurement_payment
 
Curso Drupal 7 SiteBuilding parte 2
Curso Drupal 7 SiteBuilding parte 2Curso Drupal 7 SiteBuilding parte 2
Curso Drupal 7 SiteBuilding parte 2
 
Programa Instalador Amor
Programa Instalador AmorPrograma Instalador Amor
Programa Instalador Amor
 
Manual de identidad visual corp
Manual de identidad visual corpManual de identidad visual corp
Manual de identidad visual corp
 
Dónde está GUAM?
Dónde está GUAM?Dónde está GUAM?
Dónde está GUAM?
 
All Physicians re everything 11-03-14
All Physicians re everything 11-03-14All Physicians re everything 11-03-14
All Physicians re everything 11-03-14
 
Revista 02
Revista 02Revista 02
Revista 02
 
Camfed 2013 Annual Report
Camfed 2013 Annual ReportCamfed 2013 Annual Report
Camfed 2013 Annual Report
 

Ähnlich wie Sex and Design Axioms

Active Filter Design Using PSpice
Active Filter Design Using PSpiceActive Filter Design Using PSpice
Active Filter Design Using PSpiceTsuyoshi Horigome
 
LG CRT TV MODEL Ct 21q92ke
LG CRT TV MODEL Ct 21q92keLG CRT TV MODEL Ct 21q92ke
LG CRT TV MODEL Ct 21q92keMalik Arif
 
The making of the Perfect MOSFET Final
The making of the Perfect MOSFET FinalThe making of the Perfect MOSFET Final
The making of the Perfect MOSFET FinalAlan Elbanhawy
 
NPN Silicon AF Transistors | Infineon Technologies
NPN Silicon AF Transistors | Infineon TechnologiesNPN Silicon AF Transistors | Infineon Technologies
NPN Silicon AF Transistors | Infineon TechnologiesInfineon Technologies AG
 
chapter5-Filter Implementation-pp32.pptx
chapter5-Filter Implementation-pp32.pptxchapter5-Filter Implementation-pp32.pptx
chapter5-Filter Implementation-pp32.pptxHarsh539534
 
AX1465-0.pdf
AX1465-0.pdfAX1465-0.pdf
AX1465-0.pdfAlgaveGv
 
2m 144 mhz 146mhz receiver
2m 144 mhz   146mhz receiver  2m 144 mhz   146mhz receiver
2m 144 mhz 146mhz receiver Gayan Sameera
 
How to make GPIO Signals to Control Hardware
How to make GPIO Signals to Control HardwareHow to make GPIO Signals to Control Hardware
How to make GPIO Signals to Control HardwareYoshiyukiUehara
 
UB SEDS Flight Computer Design
UB SEDS Flight Computer DesignUB SEDS Flight Computer Design
UB SEDS Flight Computer DesignDan Pastuf
 
Open Hardware: Arduino #barcampmexico
Open Hardware: Arduino #barcampmexicoOpen Hardware: Arduino #barcampmexico
Open Hardware: Arduino #barcampmexicoGonzalo Maldonado
 
December 2012 quick ref guide v10 1 (autosaved)
December 2012 quick ref guide v10 1 (autosaved)December 2012 quick ref guide v10 1 (autosaved)
December 2012 quick ref guide v10 1 (autosaved)MD Rahmatullah
 
OXX B66 Rx sensitivity and desense analysis issue debug
OXX B66 Rx sensitivity and desense analysis issue debugOXX B66 Rx sensitivity and desense analysis issue debug
OXX B66 Rx sensitivity and desense analysis issue debugPei-Che Chang
 
Semicoductor equipment may 23th 2020 id-5684
Semicoductor equipment may 23th  2020 id-5684Semicoductor equipment may 23th  2020 id-5684
Semicoductor equipment may 23th 2020 id-5684Emily Tan
 
Daewoo Lucoms Catalogue
Daewoo Lucoms CatalogueDaewoo Lucoms Catalogue
Daewoo Lucoms CatalogueKenChoi
 
Daewoo Lucoms Catalogue
Daewoo Lucoms CatalogueDaewoo Lucoms Catalogue
Daewoo Lucoms CatalogueKenChoi
 
Semicoductor equipment may19th 2020
Semicoductor equipment may19th 2020Semicoductor equipment may19th 2020
Semicoductor equipment may19th 2020Emily Tan
 

Ähnlich wie Sex and Design Axioms (20)

Active Filter Design Using PSpice
Active Filter Design Using PSpiceActive Filter Design Using PSpice
Active Filter Design Using PSpice
 
Lista de precios ferrer pc
Lista de precios ferrer pcLista de precios ferrer pc
Lista de precios ferrer pc
 
Reciprocal symmetry plots in Countercurrent Chromatography
Reciprocal symmetry plots in Countercurrent ChromatographyReciprocal symmetry plots in Countercurrent Chromatography
Reciprocal symmetry plots in Countercurrent Chromatography
 
LG CRT TV MODEL Ct 21q92ke
LG CRT TV MODEL Ct 21q92keLG CRT TV MODEL Ct 21q92ke
LG CRT TV MODEL Ct 21q92ke
 
The making of the Perfect MOSFET Final
The making of the Perfect MOSFET FinalThe making of the Perfect MOSFET Final
The making of the Perfect MOSFET Final
 
NPN Silicon AF Transistors | Infineon Technologies
NPN Silicon AF Transistors | Infineon TechnologiesNPN Silicon AF Transistors | Infineon Technologies
NPN Silicon AF Transistors | Infineon Technologies
 
chapter5-Filter Implementation-pp32.pptx
chapter5-Filter Implementation-pp32.pptxchapter5-Filter Implementation-pp32.pptx
chapter5-Filter Implementation-pp32.pptx
 
Carga muerta
Carga muertaCarga muerta
Carga muerta
 
AX1465-0.pdf
AX1465-0.pdfAX1465-0.pdf
AX1465-0.pdf
 
2m 144 mhz 146mhz receiver
2m 144 mhz   146mhz receiver  2m 144 mhz   146mhz receiver
2m 144 mhz 146mhz receiver
 
How to make GPIO Signals to Control Hardware
How to make GPIO Signals to Control HardwareHow to make GPIO Signals to Control Hardware
How to make GPIO Signals to Control Hardware
 
UB SEDS Flight Computer Design
UB SEDS Flight Computer DesignUB SEDS Flight Computer Design
UB SEDS Flight Computer Design
 
Open Hardware: Arduino #barcampmexico
Open Hardware: Arduino #barcampmexicoOpen Hardware: Arduino #barcampmexico
Open Hardware: Arduino #barcampmexico
 
December 2012 quick ref guide v10 1 (autosaved)
December 2012 quick ref guide v10 1 (autosaved)December 2012 quick ref guide v10 1 (autosaved)
December 2012 quick ref guide v10 1 (autosaved)
 
OXX B66 Rx sensitivity and desense analysis issue debug
OXX B66 Rx sensitivity and desense analysis issue debugOXX B66 Rx sensitivity and desense analysis issue debug
OXX B66 Rx sensitivity and desense analysis issue debug
 
Semicoductor equipment may 23th 2020 id-5684
Semicoductor equipment may 23th  2020 id-5684Semicoductor equipment may 23th  2020 id-5684
Semicoductor equipment may 23th 2020 id-5684
 
Daewoo Lucoms Catalogue
Daewoo Lucoms CatalogueDaewoo Lucoms Catalogue
Daewoo Lucoms Catalogue
 
Daewoo Lucoms Catalogue
Daewoo Lucoms CatalogueDaewoo Lucoms Catalogue
Daewoo Lucoms Catalogue
 
IT CABINET CF
IT CABINET CFIT CABINET CF
IT CABINET CF
 
Semicoductor equipment may19th 2020
Semicoductor equipment may19th 2020Semicoductor equipment may19th 2020
Semicoductor equipment may19th 2020
 

Kürzlich hochgeladen

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 

Kürzlich hochgeladen (20)

The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 

Sex and Design Axioms

  • 1. Juhan’s Weight and Frequency of Sex First job RingDisc Break up w/GF New job Married Udo born Startup + - 1994 1998 2002 2006 2010
  • 3. lots of books on design guidelines, apis, usability, forms, css...
  • 4. We need an INTERFACE DESIGN field guide. for the craftsman less words, more visuals real examples free constantly evolving <100 pages
  • 5. Photos by Alvero Carnicero
  • 9. System approach to design. for the technically savvy artist typography color theory composition layout code usability interaction design customer service
  • 10. INTERFACE Data • Let data scream DESIGN • Reality Bites AXIOMS Feedback • Prototype like crazy • Pixel Perfect • Bitch! Loud and often • Eat your own dog food • Stop seeking approval • Date your users Layout • Grid it • Type less + less type • Color carefully Interaction • What interface? • Repeat customers ROCK • Deja vu all over again • Get physical • Lust to Dust
  • 11. c re a m a ta s L e t d
  • 13. Photo by Mex Beady Eyes
  • 22. 1/4” 18pt Photo by danperry.com
  • 23. Rightsizing text There is a formula for determining the size of a conference badge/name tag ... so that it’s legible from 10 feet. http://www.hf.faa.gov/Webtraining/VisualDisplays/text/size1a.htm
  • 24. Visual Angle Formula For small visual angles (<10 degrees) VA (in minutes) = (3438 x H)/D H = (VA x D)/3438
  • 25. Visual Angle Formula Visual Angle Legibility Condition (minutes of arc) 60 Excellent visually impaired w/low vision 25 Good important/dynamic text 20 Fair important/dynamic text 15 Poor even w/normal vision and static text 20/20 vision is the ability to resolve a spatial pattern separated by a visual angle of 1 minute of arc.
  • 26. For badges... 10 feet away } H = (VA x D)/3438 everyday reading H = (25 x 120 inches)/3438 H = 0.9 inches lower light, H = (60 x 120 inches)/3438 visual impairment H = 2.1 inches
  • 27. @ 10 feet away H = 0.9 inches H = 70 points Kate
  • 28. @ 10 feet away H = 2.1 inches H = 145 points
  • 31. For business cards... 2 feet away } H = (VA x D)/3438 everyday reading H = (25 x 24 inches)/3438 H = 0.17 inches (12.25pt) lower light, H = (60 x 24 inches)/3438 visual impairment H = 0.42 inches (27pt)
  • 32. H = 0.125 inches (9pt) H = 0.2 inches (13pt)
  • 33. H = 0.125 inches (9pt) H = 0.2 inches (13pt) H = 0.40 inches (26pt)
  • 34. Size matters. Don’t be afraid of going BIG . Math is on your side.
  • 39. Ink and lines scream Data disappears Violates all 5 Tufte principles Five principles produce substantial changes in graphical design: 1. Above all else show the data. 2. Maximize the data-ink ratio (i.e., the % of ink that shows data). 3. Erase non-data ink. 4. Erase redundant data-ink. 5. Review and edit.
  • 41. PROJECT CUSTMR STE BURN TOTAL $ ODC STAFF WTCH SPEND NCOI 354 -35.1 18m 18m 498 10 AFMSTT AF AFMC 4 -2.0 16k 16k 4 1 C2C AF ESC 3 -1.2 14k 14k 3 1 SBR AF MC 5 ... 25k 25k 5 1 AFTERPS AF ESC 6 -5.7 20k 20k 6 2 GATM AF ESC 12 -2.0 20k 20k 12 ... CCS-C AF ESC 3 -1.4 30k 30k 3 2 JPALS AF PENT 4 -1.6 16k 16k 4 1 MACS AF ESC 6 -2.3 14k 14k 6 ... NAS AF ESC 3 +1.0 25k 25k 3 ... NGATS AF MC 11 ... 20k 20k 11 1 639TH 29 +3.9 2m 2m 41 8 DIRECT AF ESC 14 +2.0 16k 16k 14 2 GEMS AF ESC 1 +1.0 14k 14k 1 1 KG-3X AF ESC 6 ... 25k 25k 6 1 MMP AF ESC 2 ... 20k 20k 2 2 MSI AF ESC 3 +1.0 20k 20k 3 ... STRATEGIC & TACT 45 -7.2 5m 5m 62 7 ABN LASERCOM AF ESC 1 -3.7 30k 30k 1 1 ADVANCED PLANS AF ESC 5 ... 20k 20k 6 1 AIT AF PENT 3 ... 14k 14k 3 ... CSEL PROGRAM AF ESC 4 +1.0 25k 25k 4 ... FAB-T AF ESC 14 -1.3 20k 20k 14 ... GMS PROGRAM AF ESC 12 ... 20k 20k 12 2 GMT AF ESC 18 ... 30k 30k 18 2 HDR RF AF ESC 3 -2.5 16k 16k 3 ... TDC AF ESC 4 ... 14k 14k 4 ... TSAT-SE&I AF DOD 5 ... 25k 25k 5 ... TSAT-TE AF ESC 1 -0.2 30k 30k 1 1 BMSW 254 -12.1 18m 18m 295 18 AFMSTT AF AFMC 4 -2.0 16k 16k 4 1 C2C AF ESC 3 -1.2 14k 14k 3 1 SBR AF MC 5 ... 25k 25k 5 1 AFTERPS AF ESC 6 -5.7 20k 20k 6 2 GATM AF ESC 12 -2.0 20k 20k 12 ... CCS-C AF ESC 3 -1.4 30k 30k 3 2 JPALS AF PENT 4 -1.6 16k 16k 4 1 MACS AF ESC 6 -2.3 14k 14k 6 ... NAS AF ESC 3 +1.0 25k 25k 3 ... NGATS AF MC 11 ... 20k 20k 11 1 533TH 29 +3.9 2m 2m 41 8 DIRECT AF ESC 14 +2.0 16k 16k 14 2 GEMS AF ESC 1 +1.0 14k 14k 1 1 KG-3X AF ESC 6 ... 25k 25k 6 1 MMP AF ESC 2 ... 20k 20k 2 2 MSI AF ESC 3 +1.0 20k 20k 3 ... CYBERTECH 45 -7.2 5m 5m 62 7 ABN LASERCOM AF ESC 1 -3.7 30k 30k 1 1 ADVANCED PLANS AF ESC 5 ... 20k 20k 6 1 AIT AF PENT 3 ... 14k 14k 3 ... CSEL PROGRAM AF ESC 4 +1.0 25k 25k 4 ... FAB-T AF ESC 14 -1.3 20k 20k 14 ... GMS PROGRAM AF ESC 12 ... 20k 20k 12 2 GMT AF ESC 18 ... 30k 30k 18 2 HDR RF AF ESC 3 -2.5 16k 16k 3 ... TDC AF ESC 4 ... 14k 14k 4 ... TSAT-SE&I AF DOD 5 ... 25k 25k 5 ... TSAT-TE AF ESC 1 -0.2 30k 30k 1 1
  • 43. Aim for beautiful and useful. ... they’re not mutually exclusive.
  • 47. There’s not much we can do with shit data ... other than create or find better data ... or point out how shitty that data really is
  • 48. Specious data and viz masquerading as validated and thorough results.
  • 50. Lovely poster by Jess Bachman
  • 51. Let’s jam on this beautiful art and make the data sing.
  • 52. hard for humans to diff
  • 54. This isn’t working beautifully... yet.
  • 55. as seen in adbusters
  • 56. US Budget in 2009 (Dollar amounts in billions) Non-Discretionary 2,000 Discretionary 1,000 Total 3,000
  • 57. US Budget in 2009 (Dollar amounts in billions) Non-Discretionary Discretionary 2,000 1,000 Total = $3 trillion
  • 58. US Budget in 2009 (Dollar amounts in billions) Non-Discretionary Discretionary OMB 2,000 1,000 Black Ops NYTimes 2,000 1,100 40 Adbusters 2,600 1,500 300
  • 59. US Budget in 2009 (Dollar amounts in billions) Non-Discretionary Discretionary OMB 2,000 1,000 Black Ops NYTimes 2,000 1,100 40 Adbusters 2,600 1,500 300 Bailout + Wars + 2,600 1,500 300 1,800 Total = $6.2 trillion
  • 60. Fun = integral in adoption and use Clarity and data truth = key for understanding Work both.
  • 63. Jam on this data: data.gov
  • 64. The Theatre of Interface
  • 65. software = a visual medium Let data scream = all about staging the scene in theatre
  • 66. Backgrounds and 2ndary objects = designed not to distract the audience from the action Most screens show too much.
  • 67. Think in visual terms first = expression, action, sound affect, music... Then the dialog tells something about the product... and not the exposition. Exaggerated features nose, hair, attitude, physique, clothing
  • 68. Software is staged. Software interface design = a series of scenes which need to be interesting, staged, and ruthlessly edited.
  • 71. 38%
  • 72. Priorities, hierarchy 1 filtering 2 navigating .... .... .... last patient data
  • 74. 95% 60% 40% 35%
  • 75. 92%
  • 76. 90%
  • 77. Let data scream 85% 92% Wufoo 90 Graffle 88 Pages 82 Word of the page space should be for data, the actual workspace
  • 83. labels as interface (filtering) data as interface (direct manipulation) labels as interface (filtering) grid as 2ndary player
  • 84. Let data scream the data is THE story size matters: big n’ juicy less ink, more bang shit data = shit displays beautiful and useful stage your data 85% rule
  • 87. design with fake data = fake design
  • 92. 1. Real data needs to be grokked by YOU. See the data, know the data. Find the core stories.
  • 93. 2. Real data has a min-max. Data story and interface has to accommodate ALL THE DATA, including crazy data points Key outliers = ?
  • 94. Firstname Lastname Firstname Lastname Firstname Lastname Firstname Lastname Firstname Lastname Firstname Lastname Andrei Herasimchuk Pick 2 ends of the data spectrum (the extremes). Dirk Knemeyer Impact on design = ? Kriengsak Niratpattanasai Tiff Biset Katrina Penruddocked-Longoria Juhan Sonin
  • 95. 3. Amplify real data Not much we can do with shit data... ...but point out how shitty the data really is. Can you make it cleaner, better... find better data? Can users make it better? Mark the differences = CONTRAST
  • 97. 4. Real data = real feedback = forces people to make real decisions You, your colleagues, testers, early adopters, can give higher fidelity feedback. How do I give meaningful feedback on Lorem Ipsum?
  • 98. Describe your hospital experience: Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Which one Describe your hospital experience: makes sense? Walking into Beth Israel alone for major surgery was a bit unnerving. I had never been to the surgery level; it was a breeze to find with the well-placed signage. The was no queue for check-in. I gave the admin a few data points and within 40 seconds, I was twittling my thumbs waiting for the big red door to swing open, my doc to jump out and stab me in the arm with a sedative, and start cutting. I was pleasantly surprised.
  • 100. misspellings # of data bigger width not all data is equal all caps
  • 102. 5. Real data won’t blow up production
  • 103. If you don’t have access to real data, craft it.
  • 104. Reality bites design with fake data = fake design ban lorem ipsum use real data real data = real feedback = real decisions
  • 110. prototype = working, touchable, clickable, feelable, chewable service could be feature lean (like 1 lonely but acting function) or using a temporary data engine/model or... You can Or lick it. USE it.
  • 113. big bang theory = broken deadlines, late compromises, craptastical services
  • 115. Make a giant to-do list ... from product tasks to tiddly startup jobs like getting trash bins and slippers and print it BIG.
  • 122. OSS&E show summary export Last updated 2 weeks ago Project X4.0 Project X4.2 Project X4.5 -6m -3m Now -6m -3m Now -6m -3m Now 6 Full Compliance 6 Full Compliance 6 Full Compliance 5 Process, Certification 5 Process, Certification 5 Process, Certification 4 SLA, Sustainment 4 SLA, Sustainment 4 SLA, Sustainment 3 Implementation Plan 3 Implementation Plan 3 Implementation Plan 2 Processes Established 2 Processes Established 2 Processes Established 1 Self Assessment 1 Self Assessment 1 Self Assessment 0 System Identified 0 System Identified 0 System Identified CLICK FOR FULL SCHEDULE 2005 2006 2007 -6m -3m Now 6 Full Compliance 5 Process, Certification 4 SLA, Sustainment 3 Implementation Plan 2 Processes Established 1 Self Assessment 0 System Identified
  • 123. WATCHLIST show summary export Last updated 1 week ago State Issue -6m -3m Now Level Weeks old 2006 2007 2008 2009 Get well by Principle Effect OPR Useage of Project X4 over COP radars at risk due to incompatibility.. PRG 57 31 Dec 08 Cost McCormack, Lee Baseline Project Management with KPIs PRG 86 31 Dec 08 Technical McCormack, Lee Definition of low bandwidth routers installed on site with... PRG 48 26 Jul 08 Technical Battle, Guy Program Performance of Reorganized Project X4 Team PRG GRP 86 31 Dec 08 Schedule McCormack, Lee Software Requirements in flux PRG 86 20 Dec 08 Technical Battle, Guy LEADING INDICATORS show summary export Last updated 3 weeks ago CONTRACTOR GOVERNMENT State State Comments Leading Indicator -6m -3m Now -6m -3m Now Contractor Government Processes Resources Requirements Lack of concrete deliverables from AF. Engineering Documentation Risk Handling Adverse working environment in desert.. On-site development process failing.. Risk Exposure Trends Interfaces, Integration, Interoperability, and Interdependencies Dependence on 3rd party (Disaster Inc).. Vendor cross-communication is di!cient.. Software Development na Hardware Development na Verification and Validation Review Action Closure Trends
  • 127. This data doesn’t make any sense. How about... Where’s the timeline?
  • 128. Be shameless. Prototype everywhere. Nurses Doctors Administrators Insurance agents Friends Friends who are in Health Family Lawyers Engineers Designers Any nitwit who wouldn’t walk away from me...
  • 129. Design critiques Informal, formal. Daily, weekly, monthly. Andy Grove engagement model: honest, critical feedback to fellow colleagues (gnaw on the idea, not the individual)... to make our ideas better. Changing the trust model with staff... and the customer (a la FedEx did with package delivery).
  • 132. now... Brian O’Neill Brian Haven Kerry Bodine Kate Sonin Dave Bedingfield Chris Doellner Rob McCready Ayal Spitz
  • 133. Big prints = bigger impact Print designs - and task lists - BIG... obnoxious big. It’s in your face and you can’t ingore it. You can see your design.
  • 134. Small plotters (like an HP DesignJet 130) = $1k My preference = go nuts and get an Epson 9900.
  • 136. Big prints for designers, engineers, project leads to hover around = excellent method for on-the-fly critiques Sending clients big prints of their work = bigger smiles
  • 139. Prototype like crazy prototype = working service big bang theory = low percentage shot hand meet pencil churn baby churn get criticism early and often buddy up print big
  • 141. 14 point Gill Sans @ 3200% zoom
  • 142. Wireframes = sketches, gross screen design (still as a sketch), ideas
  • 144. Start with a sketch = Abstract, rough interpretation of behavior, story, objects and grouping
  • 145. Sketching = we’re filling in the gaps Low barrier of entry, low fidelity Brainjamming, idea generation = the power of sketching
  • 147. flickr: adactio flickr: yandle
  • 149. Sketch like a maniac, ...then move to machine-like precision with pixels. No sketch-ish interface design in pixels. Sketches stay on paper.
  • 150. screen = any rendering on a cpu, any instantiation of an interface using pixels
  • 151. pixel = 1 or 0, ON or OFF precision, absolute color, placement/layout...
  • 152. Doing a ‘wireframe’ (on screen) and ignoring type, grid, data, and behavior = laziness
  • 154. low fidelity sketches vs high fidelity comps Which are you going to get better feedback with?
  • 157. higher fidelity screens = higher fidelity feedback
  • 165. No half pixels = muddy edges and won’t align in code, on screen
  • 166. on the half pixel = a no-no
  • 171. Pixel perfect draw baby, draw skip wireframing, go directly to pixel jockeying design every pixel
  • 175. Polarizing Inclusive
  • 176. Coke, Pepsi Polarizing Inclusive
  • 177. Banana Rep, BMW, Toyota, Apple, Coke, Harley Pepsi, Polarizing Inclusive
  • 178. Banana Rep, BMW, Toyota, Apple, Coke, Harley Pepsi, You’re Screwed Zone Polarizing Inclusive Premium Price Differentiated Product Intensity of Emotion
  • 180. Apostle User Experience Buyer Value Prop Prospect Performance Skeptic Facts Cynic
  • 182. customer delight = delivered service - expected service need, desire, promises, want, quality, past performance, competition
  • 185. ∆ customer delight DELIGHT LEVELS D<E D=E D>E Keep promises Manage expectations Learn service recoveries
  • 186. ∆ customer delight NEW DELIGHT LEVELS PREVIOUS DELIGHT LEVELS D<E D=E D>E Over time, it’s more difficult to deliver delightful services.
  • 187. You want experienced users to: • tell their friends about it • demand other services to hook into it • make their work products better • make users happy (by being efficient) • purchase upgrades, future products
  • 189. Polarizing Inclusive
  • 190. Apostles = pissed cell reception wayfinding reconfigurable space maintenance Polarizing Inclusive
  • 191. Design for repeat customers
  • 194. Veteran Nimble Capable Hazard 0 1 hour 10 100 1000 10,000 Driving experience in hours
  • 195. tur nr igh turn on t headlights turn on hazard lights honk here radio channel up channel down Explicit instruction = drive myself to the funny farm.
  • 197. Don’t Make Me Think = fabulous mantra. Works most of the time. It should just feel right. .... but not always true.
  • 198. Start posting in 10 seconds.
  • 200. vs
  • 201. vs vs
  • 202. Expert Intermediate Beginner T WTF am I doing?? Opening a Writing, image editing, ?? Parenting beer, $ from professional reputation, an ATM, farming finding music on an ipod
  • 203. More powerful rewards Expert Intermediate Beginner TIME <T “It has to be easy.” “Noobs need to Most of the things worth instantly get it.” doing, require learning, “No learning curve.” effort, and our time.
  • 204. Make a service ROCK: 1 st for the repeat, more experienced user, 2 nd for the novice, and finally 3 rd for the inexperienced user. Using this order = designing products that will pass the test of time HECKEL, HERASIMCHUK, TUFTE
  • 205. >3 billion pages Beginner Intermediate Advanced keyword keywords++ query operators keywords exact matches ~ sentences OR, AND, NOT hacks
  • 209. Repeat customers ROCK! polarize your audience delight your apostles design for intermediates first design multiple paths through a service
  • 211. DESIGN MATTERS adoption usage fun factor learning expectations impact reputation
  • 212. customer delight = remarkable service performance & service wildly exceeds my expectations
  • 213. Global issues 1 Education 2 Energy 3 Population control 4 Food 5 Clean water 6 Sanitation 7 Open governance 8 Fiscal parity 9 Health
  • 214. Interface to Energy Out of sight, out of mind photo by Adventure Ken
  • 217. Do the small stuff right... and let the beautiful stuff emerge naturally.
  • 218. Special thanks to CC Photo Credits Harry Sleeper Alvaro Carnicero Paul Kroft Luiz Castro Mike Nosal Chris Jordan Dirk Knemeyer GotPlaid Rani Manoharan Mibi Brian Staats NoiseCullusion Andrei Herasimchuk OakleyOriginals Camille Goudeseune Oliver Orloff Brian Haven Optiglot Rob McCready Juhan Sonin Chauncey Wilson Syvwich Abigail Kirigin Stefan Thiesen Tushyd and all of the people Wizum who have elevated my design and life IQ... and Kate Sonin.
  • 220. SEX DESIGN & AXIOMS Juhan Sonin juhan@mit.edu designaxioms.com