Single-page web apps are an ideal environment for close designer/developer collaboration. Developers often lack the intricate knowledge of CSS and HTML layouts they need to implement a designer’s work as first imagined. Fortunately, many designers have experience with front-end web development. Cooperation between these two “teams” yields faster implementation of designs that represent the designer’s intent.
Working with a designer on web app development can be a great experience, provided you take a few important steps.
1. Understand Your Designer’s Expertise
Knowing how much knowledge and experience your designer has with development is key to understanding how to best work with them. Designers skilled in development can work closely to implement their own designs. Some designers even feel comfortable making their own commits and pull requests. This level of involvement removes the interpretation of their designs before they’re brought to life in the app.
On the other hand, one of the largest hurdles to having designers help with development is making sure that their code integrates well with the rest of the codebase. The more experience a designer has, the easier it will be to integrate their code. If the code you get becomes trivial to integrate, you may have struck gold and found a developer who is also a designer.
2. Conduct Design Reviews
Making sure that the designer’s work is implemented correctly is always of the highest priority. Design reviews are a key part of a good code/feature review process, whether they’re done after a developer adds functionality to styling/layout code or after the designs are implemented. The review process that has worked the best for our team goes like this:
- Code Review
- Design Review
- Stakeholder Review
Reviewing the designs after code review helps smooth out any wrinkles left in the branch before merging code. Changes made in code review won’t affect the designer’s review very often, but reviewing after code is merged results in the most reliable review process for the designer.
Having the designer review before the stakeholder review is important for similar reasons. If the stakeholders see an incorrectly implemented design, it can undermine your team’s credibility. It reflects on the team’s ability to communicate, write good code, craft good designs, and manage projects.
3. Pair with Your Designer
When a developer and a designer pair, it’s a collision between two areas of expertise. The developer will have the best understanding of how to change and add to the codebase, while the designer will have the best understanding of the designs, plus a wealth of experience with CSS and HTML layouts.
Depending on your circumstances, a pairing session could last for an entire feature, or it could just be a brief session to sort through a few rough areas that came up when interpreting the designs.
The integration of design and development is crucial to the success of your project. When you find the right way for the two groups to work together, you get designs that are implemented quickly and correctly.