Home > Collaborative prototyping > How to keep developers happy: A quick guide for UXers
Making team collaboration more powerful with Justinmind’s agile collaboration UI. Read on for the all-in-one solution to designer-developer misalignment

Make team collaboration more powerful with Justinmind’s agile UI. Your solution for designer-developer misalignment

As a UX designer, you are responsible for designing digital experiences that delight your users. And when you’re done flexing your creative muscles, the next step is to hand your designs off to development.

The problem is, getting everyone on the same page in agile software development isn’t always plain sailing. Establishing common ground with the developer team is often thwarted by misunderstandings, incoherent documentation or missing resources. And according to IEEE’s Why Software Fails, miscommunication and sloppy hand off between teams directly contributes to software project failure.

But what’s the key to keeping development teams happy? Aside from buying them beers on Fridays, obviously. The Justinmind development and design teams put their heads together and came up with some must-know tips for design-development collaboration. From downloading our latest collaboration boosting prototyping tool to prioritizing development needs and rethinking documentation, UXers need to know these developer friendly tips.

So follow our quick-start guide to work better with developers and translate your designs into amazing products more efficiently. After all, as UX guru Francisco Inchauste reminds us:

“The end product (website or application) should always be the focus.”

Treat design documentation to a make over

Developers are the HTML to our CSS. We sweat the details down to the last pixel, and then it’s up to our agile development team to weave our beautiful designs into amazing software and apps.

To make this a reality, developers need to know exactly which UI elements go where, the distance between them, the ratios, x/y/w/h values – the whole shebang. To access this information, the design team provides style guides or technical documentation that map out the lay of the land.

But as fellow designers know, writing these technical documents can be a real drag. Minute details and constant updates mean we could be at it all day. Leave anything out and developers will be at a loose end – Toptal’s Front-end Developer Vedran Aberle Tokić tells a cautionary tale of the importance of complete documentation.

Show, don’t tell

“We have to kill the mentality that there is an assembly line of workers waiting for it to be their turn, and instead embrace more focused collaboration across the project’s entire team.” Brian Krall, Smashing Magazine

In an effort to make sharing design specs less of a pain, Justinmind has come up with a visual alternative for agile teams. Gone are the days of puzzling information architecture – developers now have exactly what they need to develop code against, without relying on a linear design-developer workflow.

With the new collaboration UI, developers can see the exact measurements and spacing between UI elements in pixels on the canvas itself. Using the developer UI, developers will also be able to copy and paste CSS styles from Justinmind to other programs, cloning colors, typography, element height, width, opacity, size, alignment, and letter spacing of the prototypes.

There’s no need for developers to waste any more time waiting on a document to arrive or for the designers to create style guides. With Justinmind, it’s already taken care of. And designers? Well now we can stick to what we do best: designing.

Download Justinmind now and prototype, design and develop collaboratively

Download free

Avoid repetitive work with Justinmind’s team collaboration software

Save the development team time by centralizing design assets within an agile framework.

As Photoshop’s guide to designing with etiquette has it, assets are the gift that keeps on giving. It’s true! We don’t go through all that pixel pushing for nothing! When you sign off on the design process, you’re essentially signing off on all your icons, widgets, screens and images. Then *click*zip*send* – and it’s off to the development team right?

Unfortunately it’s not usually that easy. All too often the lowly developer is left to rummage through the designer’s toolbox, waiting for the right assets to make an appearance. Wouldn’t it be better if the developer could access the right assets at the right time by default?

In Justinmind’s developer UI, source materials are available automatically. Developers can grab assets and store them locally, ready to be used in other programs or shared with others. They can even retain asset properties, such as the size and color of images by saving them as vectors. No repetition, no headaches.

Having assets readily available in an agile collaboration tool means less back and forth between team members and less risk of assets getting lost or damaged. And with a read-only canvas, designers don’t have to worry about developer changes to the final design. Is that project collaboration or what?

Developer approval trumps client approval in agile software

The customer isn’t always right, the developer is. Face it, you’ll be hard-pressed to undo a design promise you’ve made to your client, so check in with your developer prior to client review.

As Developer Vedran relays in his love letter to designers, there is a big difference between what can be done and what is appropriate in software. And despite the influx of hybrid designers and unicorns, it’s the development team who decides if a design is production-ready, or even production-realistic.

Although securing design approval from clients is a top priority, it’s also important to settle up with development first. Imagine you submit a prototype to a client, they love it. It gets sent to development straight away. But wait, what’s this? The development team says it’s a no go. Good luck convincing the client to go another route.

Remember, your design has to be able to run as well as look a certain way. With Justinmind, it’s easy to check in with the development team and make sure that your design assumptions fit the bill. With a visual prototype, developers will understand the flow of your design and as a team, you’ll find common ground and be able to identify potential product roadblocks prior to client review. If you’ve created a high-fidelity prototype with events and interactions, developers will be able to visualize how you intend for your design to come to life. Have them review it and give you feedback with the comments in Simulation mode.

Click here to set your developers up with Justinmind.

We’re no longer working in a silo. Collaborating with the development team is a necessary step to creating effective agile products. And when your tools and resources align, it’s easier to create a collaborative environment. So download Justinmind now to bridge the gap with developers and design better agile software.

Emily is Marketing Content Editor at Justinmind


Your email address will not be published. Required fields are marked *

  • I’ve been in the web design industry since html2 and tables for layout. I think designers have—or should have—moved beyond the concept of “pixel perfect” specs. What we need is a tool that enables designers to spec and communicate responsive, percentage based layouts and type.

    Layouts and proportions change based on viewports and device widths, so we need to move past thinking in terms of fixed widths and pixels.

  • Thanks for the tips, they all sound very practical! And I got curious about Justinmind’s software, I will dig into that! I wanted to share myself that recently a group of colleagues just published an article about this subject. It was based on an experience with a project in which we designed & developed a mobile app.