Lesson 3: Things I wish I knew about design handovers
At the end of every designer's iterative process, the design handover is the key point which can make or break the implementation of your product or feature. Here's 3 learnings that I wish I knew when I first started out.
1. Empty states are also a part of the user's experience
When I first started out, I spent 90% of my time focusing on how the product or feature will look after it's been populated with data.
Now, I understand that the empty state of a page is as much part of the user's experience as the end state. Utilise empty states as opportunities for inspiring curiosity and anticipation; or at the very least, help the user orient themselves so they know exactly what they should be doing next.
2. Consider all the ways things could go wrong
The key difference between designing for the web, and designing for print is that web content is never static. How will a beautifully laid out card look when the user decides to give it a ridiculously long title? If the user tries to submit a form without filling out all the necessary information, how do they know what's missing so they can proceed?
While most of your time will likely be focused on the ideal user pathways, you'll also need to dedicate time to reinforce guardrails (by limiting interactions or input), or set up signboards (UI, error messaging) to send the user back to the happy paths.
Expectations vs Reality: Perfect wireframes versus real-world implementation challenges
3. Things are probably not going to turn out the way you imagined it (the first time round)
At the end of the day, no matter how detailed your handover specs may seem, the first build of the product is probably not going to turn out exactly like your Figma prototype.
In times like these, it's important to remember that building products in a startup is iterative. We do want to strive for perfection, but a more realistic goal is getting things shipped, and improving on it in the next round.
Finally, when preparing handovers, remember that you are designing the user experience of your developers as they figure out how to build the wireframes. Listen when devs tell you something isn't working. That way, you can work together to create a handover process that works for your team.
If you enjoyed reading this, you might also wanna check out my previous post on working with engineers. Here's some great advice from other designers on perfecting your design handovers, setting up your Figma file, and writing great specifications.