Collaborative culture in Figma between Product Design and Tech

Behind every digital product at Soluble is the search for a great goal: To achieve agility, coherence and excellence; for Soluble, for the brands and users. And we’ve found that the way to accomplish this is to take the utmost care of all the processes that are integrated into the flow that goes from design to the final product that’s later seen and used.

At Soluble, two teams are working in alignment in each of these processes. Two disciplines that share a culture of constant communication, and that always make the results shine: Product Design and Tech.

Do you want to know how they collaborate at Soluble to create better digital products with maximum agility? Read on to find out how Julia Vallina, Tech Lead, and Ada Fàbregas, Digital Product Designer, shared their expertise in a live stream you can now watch on replay.

This is not the first time that we’ve opened the studio's doors to show our processes and our workflow. In the summer we shared, in a live stream with our Design team, how we approach each project and how we organize our Design System. This time we take a look at the other side of the equation: the development side. Because our Tech area also makes the most of Figma’s ease of use and collaboration features, and has a lot to say about Soluto, our Design System.

At Soluble, Product Design and Tech follow the same roadmap and guidelines to streamline the work of designers and developers, speed up processes and ensure fluidity in projects. The use of the same tools, such as Figma, and always using our Design System as a starting point, makes it much easier. But there’s more: The Product Design team always meets a series of requirements for the handoff, ranging from the use of the same nomenclature and the constant use of variants —one of Figma’s new features we explored in our previous live stream— to creating components for every element and solving the design for all types of screens. Ada explained step by step how they ensure that the Tech team takes over the project in the shortest possible time and with all the support they need.

The Design System may be the unsung hero of design in many cases, but not at Soluble. Soluto, our DS, is our solid foundation for making design decisions. Thanks to it, Product design and Tech have a shared understanding and frameworks to speed up the creation of digital products, ensure consistency and reduce the margin of error to a minimum.

Translated into code, Soluto is a single repository that can cover everything in terms of technology, even if each project commonly has a very specific stack. Julia showed us, in a practical example, how the technical part of our Design System works, how the foundations are translated and how it’s used to create a new DS.

For that, she took us to the team’s playground, Storybook, where they experiment, validate and test. Here we can see how the different components of Soluto behave, and how important it is for reducing discrepancies between code and assets, speeding up the construction of each product and improving communication thanks to a shared language between developers and designers.

Saving time and effort, being more efficient and, above all, happier. To achieve these great objectives, having a culture of organization and collaboration between teams is essential. How? By defining and maintaining the same standards, a unique file structure and nomenclature, and reusing elements. But also by keeping constant communication between teams, to align objectives, needs and progress in all projects. This also includes our DS, which is constantly evolving and improving, to be broader and more efficient every day. Because investing in Soluto is investing in better digital experiences, but also in the happiness of our teams.

If you want to dig deeper into all the details of this digital meeting that Ada and Julia shared with more than 200 people, press play and take note of everything they have to tell you. See you at the next Soluble Goes Live!