Let's face it, documentation is not fun, but it's something that every designer should be taught in school. As a lead designer, I have to be able to communicate with others to execute my team's designs.
Moby tends to work on larger, more complex websites and mobile applications. On these projects, a lot of decisions about the functionality happens during the UX and design process which the developer may or may not be a part of. To add to the confusion, the assumptions of how the product should work are not always obvious. As the project progresses I become the single core repository of these assumptions. At some point, all that stuff that's in my head has to come out so my developer can build it.
That’s where documentation in the form of developer guides come in. They provide a quick hit of design plus functionality, written out and collected in one place for the developers to reference while working on the project.
Developer guides with screen shots are extremely valuable when building out an application. I can quickly see how each screen should look and that communicates most of the key information about the features I need to implement.
How to Create a Developer Guide
Now, let's get into how to make your own developer guide. Pictures are worth a thousand words, so work from screenshots. Let the images do most of the talking. In this document you should explain the logic of the product. What state changes does this button go through? Where is the user sent after they complete this action? What parameters are in this filter dropdown? These are all questions that the developer will need answered at some point, so it makes sense to lay it all out beforehand.
Just be careful you're not going overboard. Obvious design choices don't need to be spelled out, but hidden functionality does. Anyone can see the button is blue with rounded corners, but only you know the awesome custom interaction that happens when you tap it.