When a discussion between a designer and a developer reaches a dead-end, it happens that both of them start talking mumbo jumbo, using big words just to close the thread in their favour, leveraging the different skills of each other. This was the baseline idea for Davide Di Pumpo, front-end developer with UX/UI design skills, when thinking about a title for his talk at Codemotion Milan 2018. While the talk (and thus the title) was taken in Italian, its title can be translated as “Like Gestalt, with Redux on the right”. It sounded interesting, but all the attendees discovered that even the title was just mumbo jumbo (a “supercazzola”, as he said referring to a popular Italian movie): there was nothing about Gestalt, nothing about Redux. It was about the eternal struggle between designers and developers.
When designers think about a project, like for instance a new layout for a website or a mobile application, they usually put it on paper with mockups and sketches, and then developers will implement their idea using the most appropriate technologies. However, many designers agree that often the output of this process is not exactly what they had in mind, as if something got lost in the implementation process. How to solve this problem? Is this due to developers’ oversights? Or did the designer do something wrong?
Davide proposed an interesting approach to fill the gap in the communication process between developers and designers. Instead of using only the traditional design tools, like Adobe Sketches or similar software, he proposes to use a single JSON file, where all the information about design details can be summed up. JSON is commonly used to allow communication among computers, and it has the advantage of avoiding any kind of ambiguity. But instead of asking developers to work on such data, why not ask designers to use JSON files as a unique “source of truth”, where all the information about design is stored? This approach was used by Davide’s company, Credimi, where designers were able to re-design the layout of their website in just eight hours.
Of course, learning JSON and GraphQL is not enough. Designers still want to have tools to see what they are doing with their design ideas. For these reasons, Davide also proposed a set of useful tools for designers, which can actually also be used by developers in some situations:
- Storybook: a development environment for UI components that allows you to browse a component library, view the different states of each component, and interactively develop and test components. It is freely downloadable from GitHub
- Framer X: an interactive design tool that allows you to design mobile applications and websites from scratch. It is useful for defining components and easily changing them on the fly. Demos and more information can be found on framer.com
In conclusion, using great tools along with good communication strategies can definitely improve the whole design process.