Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How To Speak Unicorn: Improving Designer/Developer Collaboration

E195ae45320d9202eaa01c9f1d31a416?s=47 Michelle Schulp
September 20, 2014

How To Speak Unicorn: Improving Designer/Developer Collaboration

It seems that designers and developers speak different languages: developers are fluent in How, while designers are fluent in Why. Both are extremely important to a project, but this difference often leads to communication breakdowns. This talk will give developers insight into the design process, including vocabulary, problem solving methods, and workflow, and outline some simple methods to avoid “fail points” along the way.

E195ae45320d9202eaa01c9f1d31a416?s=128

Michelle Schulp

September 20, 2014
Tweet

More Decks by Michelle Schulp

Other Decks in Design

Transcript

  1. HOW TO SPEAK UNICORN: Improving Designer/Developer Collaboration

  2. HI, I’M MICHELLE @marktimemedia

  3. WHO IS A UNICORN?

  4. MYTHICAL CREATURE WITH EQUAL TALENT IN MULTIPLE DISCIPLINES

  5. IF I’M A SPECIALIST… WHY SHOULD I GENERALIZE?

  6. BE A UNICORN SPEAK UNICORN

  7. WHY SPEAK UNICORN?

  8. YOUR TEAMMATES ARE NOT YOUR OPPONENTS

  9. HOLISTIC PROCESS

  10. BETTER FINAL PRODUCT

  11. WHEN CAN DESIGN THINKING HELP DEVELOPERS?

  12. SEE THE BIGGER PICTURE…

  13. …AND THE DETAILS

  14. BETTER COMMUNICATION

  15. ADAPTING ON THE FLY

  16. WRITE BETTER CODE

  17. WHAT DO DESIGNERS THINK ABOUT?

  18. #1 VOCABULARY WORD: WHY?

  19. BIG PICTURE

  20. USER EXPERIENCE HOW PEOPLE INTERACT AND ENGAGE WITH THE SITE

    Information Architecture, GUI, Interaction Design KEY TAKEAWAY: Make functionality decisions with the end user in mind, not the application or development process.
  21. BRANDING COMMUNICATING THE ORGANIZATION’S MESSAGE, VALUES, AND EXPERIENCE Design System,

    Essence, Archetypes, Brand Strategy KEY TAKEAWAY: Create experiences that reinforce the company’s brand
  22. COMPOSITION HOW THE CONTENT AND AESTHETICS OF THE SITE WORK

    TOGETHER Proximity, Harmony, Unity, Balance KEY TAKEAWAY: Each element should feel like it belongs within the site layout, not added as an afterthought
  23. DETAILS

  24. TYPOGRAPHY AESTHETIC DECISIONS ABOUT THE ARRANGEMENT OF TYPE Line Spacing,

    Letter Spacing, Kerning, Fonts KEY TAKEAWAY: Typographic choices should be deliberate, both reinforcing big-picture systems and being aesthetically appealing and easy to read/understand
  25. COLOR AESTHETIC DECISIONS ABOUT THE USE OF COLOR IN A

    COMPOSITION Hue, Value, Shade, Tint, Saturation KEY TAKEAWAY: Color choices should be deliberate and used consistantly across the entire site
  26. HIERARCHY THE RELATIVE IMPORTANCE AND VISIBILITY OF PIECES OF INFORMATION

    Emphasis, Scale, Readability, Flow KEY TAKEAWAY: Decisions made about the styling and position of elements have a huge impact on the site experience
  27. WHERE CAN I PRACTICE?

  28. EVALUATE EXISTING EXAMPLES

  29. TALK TO DESIGNERS!

  30. QUESTIONS? Michelle Schulp michelle@marktimemedia.com @marktimemedia bit.ly/speak-unicorn