• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Design Essentials for Developers
 

Design Essentials for Developers

on

  • 1,705 views

To help designers communicate more effectively with each other and provide a vocabulary for clear and productive UX feedback.

To help designers communicate more effectively with each other and provide a vocabulary for clear and productive UX feedback.

Statistics

Views

Total Views
1,705
Views on SlideShare
1,695
Embed Views
10

Actions

Likes
3
Downloads
27
Comments
1

3 Embeds 10

http://ludmilartorres.blogspot.pt 6
http://paper.li 3
http://us-w1.rockmelt.com 1

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

11 of 1 previous next

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Video here?

Design Essentials for Developers Design Essentials for Developers Presentation Transcript

  • Design Essentials for Developers
    • Improving understanding, communication and collaboration
  • Why hello there.
    • RJ Owen
    • Senior Software Architect
    • EffectiveUI
    • @rjowen
    • [email_address]
    Michael Salamon Lead Experience Architect EffectiveUI @michael_salamon [email_address] Tweeting our session? Use the hashtag: #effectiveui
  • Who are you?
  • Design Essentials for Developers
  • A common language
  • Developers do design already...
  •  
  • What we’re going to fit in today: Design Research Interaction Design Graphic Design
  • Making intent visible and emotional. Design Research Interaction Design Graphic Design
  •  
  • “ Effective use of the Language of Form” – Paul Rand
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imagin ary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • Images from “Paul Rand Retrospective” by Imaginary Forces.
  • More than the sum of it’s parts.
  • Emergence image from Wikipedia.
  •  
  •  
  •  
  •  
  •  
  •  
  • Exposing intent through actions and feedback. Design Research Interaction Design Graphic Design
  • Image from http://farm5.static.flickr.com/4084/5115934573_6701948ed2.jpg
  • (Don Norman’s) Design Vocabulary
    • Visibility
    • Affordances
    • Feedback
    • Mapping
    • Constraint
    • Consistency
  • Visibility
  •  
  •  
  •  
  • Affordance
  •  
  •  
  • Feedback
  • http://www.flickr.com/photos/meganbarton/3023756556/
  •  
  • Mapping http://www.flickr.com/photos/docsearls/181012863/
  • http://www.flickr.com/photos/docsearls/181012863/
  •  
  • Constraints (preventing errors before they can occur)
  •  
  • Consistency (in the way visual objects are used)
  •  
    • Interactive elements should be visible, recognizable, reactive (feedback), safe, and consistent.
  • Defining, validating, and auditing an application’s intent. Design Research Interaction Design Graphic Design
  • What is design research?
  • Research and the design process
  • Research and the development process
  • 1. Analyze the design, you expert you.
  • 2. Validate your hunches with quick user interviews.
  • How many people to interview?
      • Jakob Nielsen: http://www.useit.com/papers/heuristic/heuristic_evaluation.html
  • Who to interview? http://good-times.webshots.com/photo/ http://www.kenrockwell.com/katie/2008.htm http://wingstoafrica.com/mali-pictures-part-2.html
  • What to say? Where to go?
  • Demo
  •  
  •  
  • Analyze your results.
    • Turn your results into findings.
    • Summarize the findings in terms of a set of agreed-upon design heuristics.
  • In Conclusion…
  • Don’t disrespect your designers.
  • Do appreciate beautiful design: graphic, interactive, and otherwise.
  • Do validate hunches, and validate those with quick user interviews.
  • Don’t use Comic Sans
  • DON’T USE YELLOW ON WHITE
  • DON’T USE ALL CAPS WITH SCRIPTS
  • Don’t put Drop Shadows on EVERYTHING
  • Don’t make the logo bigger.
  • Do feel empowered to design!
  • Thanks! (any questions?)
  • But you don’t have to take our word for it…
    • Jakob Nielsen
      • Ten Usability Heuristics: http://www.useit.com/papers/heuristic/heuristic_list.html
      • Heuristic Evaluation: http://www.useit.com/papers/heuristic/heuristic_evaluation.html
    • Bill Buxton: Sketching User Experience Design
    • Donald Norman: The Design of Everyday Things
    • William Lidwell, Kritina Holden, Jill Butler: Universal Principles of Design
    • Robin Williams: The non-designers design book
    • Mental Modeling by Indi Young
    • Re-imagining the Design of Everyday Things (slideshare)
    • Stephen Few: Information Dashboard Design - The Effective Visual Communication of Data
    • Rudolf Arnheim: To the Resuce of Art - Twenty-six Essays
      • • http://www.slideshare.net/EveFife/humancentered-design-and-the-intersection-of-the-physical-and-digital-worlds?from=ss_embed
      • • http://imaginaryforces.com/featured/3/415