Each&Other
ChalkTalks:
Connecting Design
and Development
Workflows

Each&Other ChalkTalks are a monthly talk series, where we invite design, technology and business people to talk about their innovations, challenges and general trends and phenomena. ChalkTalks serve as a forum for networking and sharing ideas and thoughts, and more importantly to learn something new.

Michael founded Interplay (with a little help from Each&Other too!) about three years ago after much research on different design tools and design systems and ops. Michael had been working in a full stack agency in Sydney and experienced some of the major pain points first hand, then realised there’s no one out there solving them and decided to take on the challenge! Lucky for the rest of us.

What is a design system?

Product building is a team sport

Michael is a strong believer that building products is a team sport and should be a seamless collaboration between design and engineering. One of the biggest challenges in this collaboration often is that the teams are lacking a shared common language.

Design systems have been around for a long time, however designers and engineers are still working in incompatible formats with one another. When different teams essentially work in different systems, it’s impossible to keep up to date on the latest versions and be efficient in avoiding unnecessary work and guessing.

This all led Michael’s team at Interplay to think about what the process of coding with design would look like. They determined meeting designers where they are as a first point of action in bringing code components into design tools. In practice this meant having a code rendering at the background of a design system while a designer is adding elements - Eventually leading to a situation where a designer is handing off actual code to an engineer, instead of images.

Interplay also has a new plugin that’s able to speed up the process of transferring designs to code - the holy grail between designers and engineers.

Here are the top 4 problems Interplay are trying to solve:

1. High maintenance design libraries
   Keeping design libraries upd to date is incredibly high maintenance.
2. Speaking a different language
   Generally design components don’t match up to the code and teams need to overwrite a lot of information. 
3. Complex and unrealistic prototypes
   Because we’re using images to visualise an application, a designer needs to spend a lot of time creating something that already may exist on code. User tests are difficult and don’t help the tester to focus on the right things. 
4. Expensive handover
   It’s a lot of work and a lot of back and forth to finally hand over a design to engineering.

Using your own product for building your own product

What’s really interesting is that Michael’s team is currently using Interplay to build Interplay (Inception-vibe warning!)!

This journey, like all good product journeys, has involved a lot of lessons learned, and one of them is realising there is no single source of truth. Interplay has figured that using code as the only source of truth is no longer relevant when looking into the future. Code should be the source of truth in the current state, while design should be the source of truth in the future state.

Interplay suits teams with a somewhat mature design system using Figma and React. The team at Interplay are currently designing a two-way handover system where designers can make suggestions for a code, which the code engineer can then have a look at and build on before sending it back to the designer. And it doesn’t end there - Interplay’s roadmap is full of features and launches which we at Each&Other are very excited to get our hands into!