Bridging the design-engineering divide
How we mix design and engineering to foster close collaboration at Virta
At Virta, we have typical Software Engineering roles and a cross-functional role, UX Engineer. Beyond being a title to put in our HR system, the breakdown of actual work tends to like this:
Besides a slightly different responsibility set, the key difference is that a UX Engineer’s first and foremost concern is user experience. It’s not that Software Engineers don’t care about user experience, it’s that their core focus is building “modern, scalable, and maintainable” apps and services.
What collaboration between design and engineering looks like in practice
When we embark on building a new feature, this might start with designing low-fidelity wireframes. Our goal is to create something that we can verify with product and various stakeholders that we have the right business needs met, to create shared understanding around what kind of data we want to display, and the interactions we want. This helps the backend team plan and get started planning on what infrastructure updates need to be made. This also allows us to discuss concessions that we might want to make that would speed up implementation.
We then work with the backend engineers writing the API to plot out what kind of endpoints we will need when we build the client.
After adjustments have been made and parties have agreed on the data model, the backend engineers start work on building out the API. At this point, those working on the UI can either start on their feature with stubbed out data or wait for the backend engineer to finish.
Some features make more sense to spend more time in a visual design tool like Figma. Other features, it makes more sense to experiment in code.
For our recent graph update, we knew it was important to look at our chart designs in the lens of real patient data. In this case it was easier to make adjustments in code because then we could quickly see whether how our adjustments affected the readability of data . For interactive features, it’s also nice to be able to send a link to various stakeholders to give feedback. Either way, it’s not a requirement for pixel perfect mockups to start work.
What are the benefits of having designers who code?
While we don’t require that all designers code, we’ve found that there are clear benefits to have some members who code:
Communication and Empathy
When there is overlap in skills between teams, you build a common bridge and a shared language. While working on development, you build greater empathy of what it takes to build robust applications.
Experimentation
One of the biggest benefits of working with code is being able to take advantage of existing APIs and see your designs populated with real data. A limitation of Sketch, Figma, and other vector tools is that’s it’s easy to design with data that is not representative of reality. Your reality might be that you have widely varying data, and your designs need to be robust enough to handle all (or close to all) of them.
Overhead
Sometimes there are changes you want to update, but it’s hard for these things to make it into the sprint. Even if it does, there’s overhead in writing a ticket and explaining it to someone else. UX Engineers are able to identify small UX or visual issues and can address them as they go. This is much more expedient than having your designers file tickets for engineers about shifting something 1 pixel to the right or making sure that an input provides the correct keyboard on a mobile device.
Catch data issues
Recently, we were designing a new endpoint when someone proposed modification. As the person who designed the user experience and soon to be building the UI, I quickly saw that this change would make it impossible to do one of the planned UI features.
User experience first and foremost
There is always an attraction to shiny new technologies and a desire to re-architect systems that won’t necessarily confer value to users. It’s helpful to have an advocate for users when these discussions happen.
While some of the benefits can be achieved in other ways, we found that this process works for us. If this process sounds interesting, please check out our careers page, we are hiring.
