A presentation at Batony #5 in in Łódź, Poland by Łukasz Przywarty
Batony #5 – October 2, 2019 WORKING WITH DEVELOPERS Łukasz Przywarty
Łukasz Przywarty Head of Design, Infermedica
Once upon a time, there was a designer… @LukaszPrzywarty
Incorrect animations 1 Expectations vs reality vs 2 3 Missing elements Wrong colors
This is not what I’ve designed. Developers don’t care about design. There was too much to do and too little time. I can’t talk to developers. It’s not my fault. ! @LukaszPrzywarty
1 PREPARE
Become a design advocate
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? @LukaszPrzywarty
Next steps Host design workshops Show off your work (e.g. “demo days”) Invite developers to research sessions, etc. @LukaszPrzywarty
“ I saw Łukasz designing this. Paweł, Infermedica
Get to know your developers
How? Grab a coffee and… talk! Learn how do developers work (process, tools) Find out how do they like to communicate @LukaszPrzywarty
2 DESIGN
Include developers in your design process
“ The ultimate goal is to feel included. Jake Archibald, Developer at Google @LukaszPrzywarty
How? Remote work is not an excuse Collaborate from the start Brainstorm, research, design together Leverage the knowledge of engineers
Share your work early and often
How? Share prototypes (InVision, etc.) Share user research findings Ask for feedback
Justify your decisions
How? Show the path that led you to the current design Discuss the pros and cons of different solutions Use data
Answer “Why?”
Think like an engineer
How? Find out how things work (read the docs, use developer tools, etc.) Learn a few technical terms (API, cache, requests, etc.) Consider learning to code
What if there’s no picture? Edge cases What happens when errors occur? What happens when there’s no Internet access? What happens if the element is empty? @LukaszPrzywarty
Hand off your designs
“ The best hand-off is no hand-off Bjørn Rostad, Product Designer at Dropbox @LukaszPrzywarty
How? Find out what the developers need from you Provide as much information as you can Don’t made developers guess Unless you want to test their creativity! @LukaszPrzywarty
Use hand-off tools
Create a style guide
Design all possible flows
Prototype in code
Use real data (InVision Craft, populate.design, tinyfac.es, etc.) Remember about language differences
3 DEVELOP
Regularly check progress
How? Set up the design review process Make use of developers’ meetings Prioritize design tweaks @LukaszPrzywarty
Share your comments
4 FOLLOW UP
Developers are not your enemies @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 @LukaszPrzywarty
Get to a solution together @LukaszPrzywarty
Sources • • • • • • 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? @LukaszPrzywarty
THANK YOU! @LukaszPrzywarty on Twitter lukasz@przywarty.com
How to bridge the gap between designers and developers? This talk was presented during Batony #5 meetup in Łódź.
for free. You
can too.