How to bridge the gap between designers and developers? This talk was presented during Batony #5 meetup in Łódź.

1. WORKING WITH
DEVELOPERS
Batony #5 – October 2, 2019
Łukasz Przywarty

2. Łukasz
Przywarty
Head of Design, Infermedica

3. @LukaszPrzywarty
Once upon a time, there
was a designer…

4. Expectations
vs reality
1
2
3
Wrong colors
Missing elements
Incorrect animations
vs

5. @LukaszPrzywarty
This is not what I’ve designed.
Developers don’t care about design.
There was too much to do and too little time.
It’s not my fault. !
I can’t talk to developers.

6. PREPARE1

7. Become a design
advocate

8. @LukaszPrzywarty
First, explain the basics
What is the job of a designer?
What is the business value of design?
What are the examples of great product design?

9. @LukaszPrzywarty
Host design workshops
Show off your work (e.g. “demo days”)
Invite developers to research sessions, etc.
Next steps

10. “I saw Łukasz
designing this.
Paweł, Infermedica

11. Get to know your
developers

12. @LukaszPrzywarty
Grab a coffee and… talk!
Learn how do developers work (process, tools)
Find out how do they like to communicate
How?

13. DESIGN2

14. Include developers
in your design
process

15. @LukaszPrzywarty
“The ultimate goal is to feel included.
Jake Archibald, Developer at Google

16. Collaborate from the start
Brainstorm, research, design together
Leverage the knowledge of engineers
How? Remote work is not
an excuse

17. Share your work
early and often

18. Share prototypes (InVision, etc.)
Share user research findings
Ask for feedback
How?

19. Justify your
decisions

20. Show the path that led you to the
current design
Discuss the pros and cons of
different solutions
How?

21. Answer “Why?”

22. Think like an
engineer

23. Find out how things work (read the
docs, use developer tools, etc.)
Learn a few technical terms (API,
cache, requests, etc.)
How?
Consider learning to code

24. @LukaszPrzywarty
What happens if the element is empty?
What if there’s no picture?
What happens when errors occur?
What happens when there’s no Internet access?
Edge cases

25. Hand off
your designs

26. @LukaszPrzywarty
“The best hand-off is no hand-off
Bjørn Rostad, Product Designer at Dropbox

27. @LukaszPrzywarty
Find out what the developers need from you
Provide as much information as you can
Don’t made developers guess
How?
Unless you want to test
their creativity!

28. Use hand-off tools

29. Create a style guide

30. Design all states of design

31. Prototype in code

32. Use real data (InVision Craft,
populate.design, tinyfac.es, etc.)
Remember about language
differences

33. DEVELOP3

34. Regularly check
progress

35. @LukaszPrzywarty
Set up the design review process
Make use of developers’ meetings
Prioritize design tweaks
How?

36. Share your comments

37. FOLLOW UP4

38. @LukaszPrzywarty
Developers are not your enemies

39. @LukaszPrzywarty
“How can we honestly build empathy for our
users if we can’t empathize with each other,
or those outside of our towers?
Mustafa Kurtuldu, Design Advocate at Google

40. @LukaszPrzywarty
Get to a solution together

41. @LukaszPrzywarty
• A mindful design process
• Creating a collaborative environment
• Everyone is a designer. Get over it
• How designers work with developers
• How to work effectively with engineers
• The beauty of imperfection in
interface design
• The nine states of design
• The power of experience mapping
• When design feels like an uphill battle
• Who is responsible for design?
Sources

42. THANK YOU!
@LukaszPrzywarty on Twitter
lukasz@przywarty.com