Creating an outstanding user experience requires an incredible amount of hard work and skills. Moreover, a coordinated effort of the whole team is the only way to deliver the application that feels like a finished product. Developers and designers need to collaborate to accomplish the project. Working together is essential but not something that’s easy to do because while both types of professionals work on the same project, their perspectives differ a lot. Let’s look into some ways to make collaboration easier for both parties and ensure that the user experience is as efficient and engaging as it should be.
Designers must make the behavior of their designs clear, make sure that developers implemented everything correctly and ensure that all errors or deviations are fixed in the final outcome unless there’s a very good reasoning of not doing so. On the other hand, developers must be involved in the design process since the early stages to provide feedback on various implementation aspects and ask questions about things that were overlooked by the designers.
Designers should involve developers early on
Designers are often not aware how certain features like image carousels of screen transitions are implemented. Some designers know how to code, but most of them don’t, and it’s causing a lot of issues if developers are not involved in the design process early one. Something that designer would create within a few hours as a set of interface states can take weeks of development. It would look very unprofessional to tell clients or stakeholders that design will have to be changed because it will take too long to implement if they have already signed off on it.
Designers should annotate designs heavily
Annotations help understand how static designs will work in an interactive environment. Of course, prototypes are much more comprehensive, but you can’t prototype every button and list, it’s just not practical. We use Figma as a primary design tool, and it makes annotation fairly easy — just add notes on the outline of the frame and make sure they are descriptive enough. Describing how elements are going to load, specifying what spinner to use when waiting for content to load and pointing to button states in the UI kit will help developers a lot. These things often look straightforward for designers, but it’s too easy to assume that everyone has the same understanding of the behaviors.
Developers should review designs and annotations thoroughly
Details matter. Developers hate to hear that they need to make trivial changes like changing the padding or slightly adjusting the color of elements, but all of this matters in a user interface. It can be quite discouraging to be asked to do such simple things after spending hours on big and challenging feature, but there’s no such thing as cosmetic, all design choices are on purpose.
Another case is when developers have their own vision and deviate from the design intentionally. There’s nothing more that designers hate than this unless you have a valid reason behind the deviations. Be prepared to argue and explain the reasoning to the teammates. There are different situations, but in general, it’s better to give feedback and adjust the design in the early stages rather than just changing the approved style or functionality.
Developers should ask questions when unsure
Asking the right questions goes a long way. If you’re a developer, don’t just assume how something should work and wait for the team to test the outcome and catch something. Ask a designer. It’s an excellent opportunity for the developer to find pieces that haven’t been thought through by the team and make right decisions. By making assumptions, you set yourself up for failure by spending time on something that should have been done differently.
There’s also a reverse problem — developers asking too many questions. Sometimes it’s safe to make assumptions so that you’re not continually distracting your team members with something that’s not very important. Usually, it’s safe to assume something if it's relatively easy to change and you’ve done before in this particular interface. For example, it’s safe to assume button states if there are other buttons or it’s safe to imagine how a spinner will look like and what placeholder to use if you’ve built this type of screen before in this project.
Designers should create prototypes and flow maps
Unfortunately, that’s not something a lot of teams can afford, but it makes designs much more comprehensive. Prototypes with interactive animations show developers, stakeholders, and everyone involved how an interface should work most straightforwardly. Sometimes even the prototype is not enough to get a grasp of the user experience, in that case, a flow map can give everybody a bird’s eye view on how different screens relate to each other and how the user can move and perform typical tasks.
Designers should be very organized with the assets
Being a developer is not easy. Having to receive icons as email attachments or digging through the project folders to find the latest version of the design makes the life of a developer even harder. If you’re a designer, then you can make your team members life so much easier just by being organized. Using the right tools helps a lot in this case. By switching to Figma, we were able to always work with the latest version of the design that is stored in the cloud. It also allows developers to easily export assets from the design file without the need to ask a designer to do that. Of course, designers still have to keep the files clean so that all groups and layers are properly named and arranged.
Communication and empathy are essential to make teamwork efficient and enjoyable. Design and development are all about creativity and working together. Too bad that often we are carried away with short-term personal goals. We need to remember that everyone shares the same overall goal of creating a great product that brings value to users and that everyone on a team wants to achieve that goal, just in a different way.
