Published: Apr 13, 2021
Apr 2021

Remember the research project pix2code that showed how to automatically generate code from GUI screenshots? Now there is a productized version of this technique — imgcook is a SaaS product from Alibaba that can intelligently transform various design files (Sketch/PSD/static images) into front-end code. Alibaba needs to customize a large number of campaign pages during the Double Eleven shopping festival. These are usually one-time pages that need to be developed quickly. Through the deep-learning method, the UX's design is initially processed into front-end code and then adjusted by the developer. Our team is evaluating this tech: although the image processing takes place on the server side while the main interface is on the web, imgcook provides tools that could integrate with the software design and development lifecycle. imgcook can generate static code as well as some data-binding component code if you define a DSL. The technology is not perfect yet; designers need to refer to certain specifications to improve the accuracy of code generation (which still needs to be adjusted by developers afterward). We've always been cautious about magic code generation, because the generated code is usually difficult to maintain in the long run, and imgcook is no exception. But if you limit the usage to a specific context, such as one-time campaign pages, it's worth a try.