SlideShare a Scribd company logo
1 of 57
Download to read offline
make it go to

1   2   3   4   5   eleven              6   7   8   9   10




                       Idan Gazit
                        @idangazit


                    DjangoCon US 2011
wilson made:

  DJANGO
APPLE.COM
EVERYBLOCK
     RDIO
omgwt bq, amirite?
BDesigner FL
table of contents
HTTP://FLIC.KR/P/5K9ORX
HTTP://FLIC.KR/P/7ZE3R9
HTTP://FLIC.KR/P/MWSWJ
design
compromise
is the soul of design
PHYSIOLOGY & PSYCHOLOGY

                          HTTP://FLIC.KR/P/7RHSFX
COLORBREWER2.ORG
7186014416
                     vs.

718-601-4416
  http://en.wikipedia.org/wiki/Chunking_(psychology)
MEDIUM

         HTTP://FLIC.KR/P/89UTSR
HTTP://FLIC.KR/P/5G1ZHW
1 2 3 4
qwrz
a s i o
e ^ S ILLUSTRATIONS PROVIDED BY GESTUREWORKS (WWW.GESTUREWORKS.COM)
who
           what
           when/where
AUDIENCE   why
constraints inform
choices
UX
IxD
UI
IA
VIZ


      HTTP://FLIC.KR/P/NCNZV
delight & obviousness
     1-100
     29-53
     unbounded
UX
input/output
      mediating I/O
IxD   paving cowpaths
Top




Right




Left

 HTTP://WWW.LUKEW.COM/FF/ENTRY.ASP?504
1


    2
            Top
    3




    1

    2       Right
    3



1       2

3       4   Left
5       6

             HTTP://WWW.LUKEW.COM/FF/ENTRY.ASP?504
expose functionality
     cues & clues
     affordance
     discoverability
     conventions
UI   interactability
info hierarchy
     sort criteria
IA   findability
visual hierarchy
      establishing connections
      mood & narrative
VIZ   beauty = performance
UX
IxD
UI
IA
VIZ
HTTP://WWW.KICKERSTUDIO.COM/BLOG/IMAGES/UX.JPG
CODE   “the fence”   DESIGN
ok, so what?
HTTP://FLIC.KR/P/KZPSX
MAKE IT
PRETTY




          HTTP://FLIC.KR/P/4PWUVG
why? because we can.
lack of
business constraints
“patches accepted.”
is this…
code              design




       good?
uphill battle
django
relatively awesome.
“non-code”
docs
tests
BDesigner FL
MOAR!
FEW
  CHEFS
    PER
KITCHEN


          HTTP://FLIC.KR/P/93CO6Q
MATCHMAKING

              HTTP://FLIC.KR/P/7M2TL6
1   2


                     PASSION THRESHOLD

ABILITY


                     SUCK THRESHOLD
                     bit.ly/suck-threshold




          TIME
1   2


                     PASSION THRESHOLD

ABILITY


                     SUCK THRESHOLD
                     bit.ly/suck-threshold




          TIME
1   2


                     PASSION THRESHOLD

ABILITY


                     SUCK THRESHOLD
                     bit.ly/suck-threshold




          TIME
pain points
python on windows
local setup
project templates
deployment
ux.djangoproject.com
      (doesn’t exist yet)
trac
doesn’t work for designers (yet?)
EDUCATION




            HTTP://FLIC.KR/P/S1CNA
style guide
we already have code guidelines
Pioneering
we can be a shining example
devops
devigner?
deseloper?
come talk to me.
THANK YOU!
   @idangazit

More Related Content

What's hot

Building the Media Block in ReactJS
Building the Media Block in ReactJS Building the Media Block in ReactJS
Building the Media Block in ReactJS Nicole Sullivan
 
Brad frost: Atomic design (Webdagene 2014)
Brad frost: Atomic design (Webdagene 2014)Brad frost: Atomic design (Webdagene 2014)
Brad frost: Atomic design (Webdagene 2014)webdagene
 
Beyond Squishy: The Principles of Adaptive Design
Beyond Squishy: The Principles of Adaptive DesignBeyond Squishy: The Principles of Adaptive Design
Beyond Squishy: The Principles of Adaptive DesignBrad Frost
 
MIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design WorkflowMIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design Workfloweaselsolutions
 
Atomic Design - BDConf Nashville, 2013
Atomic Design - BDConf Nashville, 2013Atomic Design - BDConf Nashville, 2013
Atomic Design - BDConf Nashville, 2013Brad Frost
 
Atomic Design - An Event Apart San Diego
Atomic Design - An Event Apart San DiegoAtomic Design - An Event Apart San Diego
Atomic Design - An Event Apart San DiegoBrad Frost
 
Presentation tools for the classroom 2011
Presentation tools for the classroom 2011Presentation tools for the classroom 2011
Presentation tools for the classroom 2011Karen Brooks
 

What's hot (10)

Building the Media Block in ReactJS
Building the Media Block in ReactJS Building the Media Block in ReactJS
Building the Media Block in ReactJS
 
Brad frost: Atomic design (Webdagene 2014)
Brad frost: Atomic design (Webdagene 2014)Brad frost: Atomic design (Webdagene 2014)
Brad frost: Atomic design (Webdagene 2014)
 
Atomic design
Atomic designAtomic design
Atomic design
 
Beyond Squishy: The Principles of Adaptive Design
Beyond Squishy: The Principles of Adaptive DesignBeyond Squishy: The Principles of Adaptive Design
Beyond Squishy: The Principles of Adaptive Design
 
MIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design WorkflowMIMA 2014 - Changing your Responsive Design Workflow
MIMA 2014 - Changing your Responsive Design Workflow
 
Atomic Design - BDConf Nashville, 2013
Atomic Design - BDConf Nashville, 2013Atomic Design - BDConf Nashville, 2013
Atomic Design - BDConf Nashville, 2013
 
Atomic Design con Pattern Lab
Atomic Design con Pattern LabAtomic Design con Pattern Lab
Atomic Design con Pattern Lab
 
Atomic Design - An Event Apart San Diego
Atomic Design - An Event Apart San DiegoAtomic Design - An Event Apart San Diego
Atomic Design - An Event Apart San Diego
 
Presentation tools for the classroom 2011
Presentation tools for the classroom 2011Presentation tools for the classroom 2011
Presentation tools for the classroom 2011
 
Getting Your Hooks into Cordova
Getting Your Hooks into CordovaGetting Your Hooks into Cordova
Getting Your Hooks into Cordova
 

Viewers also liked

Viewers also liked (7)

Uescespc Washington
Uescespc WashingtonUescespc Washington
Uescespc Washington
 
CSS for Designers
CSS for DesignersCSS for Designers
CSS for Designers
 
Co Gen Presentation Final
Co Gen Presentation FinalCo Gen Presentation Final
Co Gen Presentation Final
 
2009 M & V Plastics Extrusion Plant
2009  M &  V  Plastics  Extrusion  Plant2009  M &  V  Plastics  Extrusion  Plant
2009 M & V Plastics Extrusion Plant
 
CSS Extenders
CSS ExtendersCSS Extenders
CSS Extenders
 
CSS for Designers
CSS for DesignersCSS for Designers
CSS for Designers
 
Datadesignmeaning
DatadesignmeaningDatadesignmeaning
Datadesignmeaning
 

Similar to Designers Make It Go to Eleven!

Pechakucha 2012 Ambient Technology
Pechakucha 2012 Ambient TechnologyPechakucha 2012 Ambient Technology
Pechakucha 2012 Ambient TechnologyAndrew Lovett-Barron
 
The Web Performance Testing Toolbox (Jfokus 2013)
The Web Performance Testing Toolbox (Jfokus 2013)The Web Performance Testing Toolbox (Jfokus 2013)
The Web Performance Testing Toolbox (Jfokus 2013)Tobias Järlund
 
I tools for the pragmatic visionary handout
I tools for the pragmatic visionary handoutI tools for the pragmatic visionary handout
I tools for the pragmatic visionary handoutCASupts
 
Codecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-us
Codecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-usCodecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-us
Codecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-usCodecamp Romania
 
Keypoints html5
Keypoints html5Keypoints html5
Keypoints html5dynamis
 
Practical guide for front-end development for django devs
Practical guide for front-end development for django devsPractical guide for front-end development for django devs
Practical guide for front-end development for django devsDavidson Fellipe
 
もし青森の女子WebデザイナーがAndroidと出会ったら。
もし青森の女子WebデザイナーがAndroidと出会ったら。もし青森の女子WebデザイナーがAndroidと出会ったら。
もし青森の女子WebデザイナーがAndroidと出会ったら。keiko kudo
 
Simplifying build scripts with Gradle
Simplifying build scripts with GradleSimplifying build scripts with Gradle
Simplifying build scripts with GradleSaager Mhatre
 
Dart on Arm - Flutter Bangalore June 2021
Dart on Arm - Flutter Bangalore June 2021Dart on Arm - Flutter Bangalore June 2021
Dart on Arm - Flutter Bangalore June 2021Chris Swan
 
Apache Flex and the imperfect Web
Apache Flex and the imperfect WebApache Flex and the imperfect Web
Apache Flex and the imperfect Webmasuland
 
Enterprise AIR Development for JavaScript Developers
Enterprise AIR Development for JavaScript DevelopersEnterprise AIR Development for JavaScript Developers
Enterprise AIR Development for JavaScript DevelopersAndreCharland
 
Web development Hackathon
Web development HackathonWeb development Hackathon
Web development HackathonAl Sayed Gamal
 
Take a Picture, It'll Last Longer
Take a Picture, It'll Last LongerTake a Picture, It'll Last Longer
Take a Picture, It'll Last LongerDean Shareski
 
State of Akka 2017 - The best is yet to come
State of Akka 2017 - The best is yet to comeState of Akka 2017 - The best is yet to come
State of Akka 2017 - The best is yet to comeKonrad Malawski
 
HiUED 前端/web 發展和體驗
HiUED 前端/web 發展和體驗HiUED 前端/web 發展和體驗
HiUED 前端/web 發展和體驗Bobby Chen
 

Similar to Designers Make It Go to Eleven! (20)

Pechakucha 2012 Ambient Technology
Pechakucha 2012 Ambient TechnologyPechakucha 2012 Ambient Technology
Pechakucha 2012 Ambient Technology
 
State of Web APIs 2017
State of Web APIs 2017State of Web APIs 2017
State of Web APIs 2017
 
The Web Performance Testing Toolbox (Jfokus 2013)
The Web Performance Testing Toolbox (Jfokus 2013)The Web Performance Testing Toolbox (Jfokus 2013)
The Web Performance Testing Toolbox (Jfokus 2013)
 
I tools for the pragmatic visionary handout
I tools for the pragmatic visionary handoutI tools for the pragmatic visionary handout
I tools for the pragmatic visionary handout
 
Codecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-us
Codecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-usCodecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-us
Codecamp iasi-26 nov 2011-unit-testing-for-the-rest-of-us
 
Developer < eat love code >
Developer   < eat love code >Developer   < eat love code >
Developer < eat love code >
 
How to be a Developer
How to be a DeveloperHow to be a Developer
How to be a Developer
 
URL Design
URL DesignURL Design
URL Design
 
Keypoints html5
Keypoints html5Keypoints html5
Keypoints html5
 
Practical guide for front-end development for django devs
Practical guide for front-end development for django devsPractical guide for front-end development for django devs
Practical guide for front-end development for django devs
 
もし青森の女子WebデザイナーがAndroidと出会ったら。
もし青森の女子WebデザイナーがAndroidと出会ったら。もし青森の女子WebデザイナーがAndroidと出会ったら。
もし青森の女子WebデザイナーがAndroidと出会ったら。
 
Simplifying build scripts with Gradle
Simplifying build scripts with GradleSimplifying build scripts with Gradle
Simplifying build scripts with Gradle
 
Dart on Arm - Flutter Bangalore June 2021
Dart on Arm - Flutter Bangalore June 2021Dart on Arm - Flutter Bangalore June 2021
Dart on Arm - Flutter Bangalore June 2021
 
Apache Flex and the imperfect Web
Apache Flex and the imperfect WebApache Flex and the imperfect Web
Apache Flex and the imperfect Web
 
Don't screw it up! How to build durable API
Don't screw it up! How to build durable API Don't screw it up! How to build durable API
Don't screw it up! How to build durable API
 
Enterprise AIR Development for JavaScript Developers
Enterprise AIR Development for JavaScript DevelopersEnterprise AIR Development for JavaScript Developers
Enterprise AIR Development for JavaScript Developers
 
Web development Hackathon
Web development HackathonWeb development Hackathon
Web development Hackathon
 
Take a Picture, It'll Last Longer
Take a Picture, It'll Last LongerTake a Picture, It'll Last Longer
Take a Picture, It'll Last Longer
 
State of Akka 2017 - The best is yet to come
State of Akka 2017 - The best is yet to comeState of Akka 2017 - The best is yet to come
State of Akka 2017 - The best is yet to come
 
HiUED 前端/web 發展和體驗
HiUED 前端/web 發展和體驗HiUED 前端/web 發展和體驗
HiUED 前端/web 發展和體驗
 

More from Idan Gazit

Web typography
Web typographyWeb typography
Web typographyIdan Gazit
 
CSS: selectors and the box model
CSS: selectors and the box modelCSS: selectors and the box model
CSS: selectors and the box modelIdan Gazit
 
CSS: selectors and the box model
CSS: selectors and the box modelCSS: selectors and the box model
CSS: selectors and the box modelIdan Gazit
 
Repeatable Deployments and Installations
Repeatable Deployments and InstallationsRepeatable Deployments and Installations
Repeatable Deployments and InstallationsIdan Gazit
 
An Introduction to Celery
An Introduction to CeleryAn Introduction to Celery
An Introduction to CeleryIdan Gazit
 
Django 1.1 Tour
Django 1.1 TourDjango 1.1 Tour
Django 1.1 TourIdan Gazit
 

More from Idan Gazit (7)

Web typography
Web typographyWeb typography
Web typography
 
CSS: selectors and the box model
CSS: selectors and the box modelCSS: selectors and the box model
CSS: selectors and the box model
 
CSS: selectors and the box model
CSS: selectors and the box modelCSS: selectors and the box model
CSS: selectors and the box model
 
Why Django
Why DjangoWhy Django
Why Django
 
Repeatable Deployments and Installations
Repeatable Deployments and InstallationsRepeatable Deployments and Installations
Repeatable Deployments and Installations
 
An Introduction to Celery
An Introduction to CeleryAn Introduction to Celery
An Introduction to Celery
 
Django 1.1 Tour
Django 1.1 TourDjango 1.1 Tour
Django 1.1 Tour
 

Designers Make It Go to Eleven!