After using Figma to create user interfaces and experiences, developers are faced with the difficult task of coding the design to create a functional website or app. Locofy, a Singapore-based front-end development platform powered by Accel, hopes to save time by instantly converting Figma and AdobeXD prototypes into code with one-click tools.
Locofy’s new tool, called Lightning, is built on the startup’s Large Design Model (LDM). Locofy founders Honey Mittal and Sohaib Muhammed compare this to how OpenAI pioneered LLM before ChatGPT introduced it to the rest of the world. They believe tools like Lightning are needed because a developer shortage causes companies to lose revenue and leaves coders exhausted by the workload.
Lightning runs as a Figma plug-in, and Locofy’s founders say it can automate nearly 80% of front-end development so lean startup developers can focus on running their startups and getting to market.
The tool will initially be available for Figma, websites and web apps. Later this year, it will be available for more design tools, including Adobe XD, Penpot, Sketch, Wix and possibly Canva and Notion.
Mittal said the company invested more than $1 million to develop Lightning, targeting startups and customer-focused enterprises with small teams that need to accelerate front-end development. Lightning and its LDM are built in-house and trained on a dataset containing millions of designs.
The company started rolling out Locofy Classic in 2021, requiring users to go through five steps: design optimization; markup of interactive elements; styling to adapt the design to different screen sizes; components and props to identify repeating elements and modularize them; allowing Edit the category name; and adapt it to your preferred configuration, such as typescript or JS.
Mittal and Mohammad understand how to automate each step by combining techniques such as image-based neural networks, including multimodal converters, graph-based neural networks, sequence-to-sequence models, stacked indicator networks, heuristic models, and master of Law. They say they used these models to build a unified large-scale design model that contains nearly 500 million parameters from millions of designs.
Locofy Lightning’s steps, including markup, layer grouping, responsiveness, component and category names, each run their own combination of artificial intelligence-based techniques and are then fine-tuned through heuristics. Then condense the steps into one so Lightning can do it in one click.
After generating the front-end code, users can view it with an interactive preview and fine-tune the code before exporting.
Founded in 2021, Locofy has raised $7.5 million from investors including Accel and Northstar Ventures.
In the future, it plans to expand its platform beyond design by including tools to build a design system, use public UI libraries, and build front-end and back-end through integrations such as Github Copilot and CI-CD. It also plans to provide artificial intelligence assistants for designers, as well as hosting and deployment to host complete applications.
Locofy has been free to test for two years and plans to become profitable in 2024. Its founders told TechCrunch that AI code generation is a new category and the business model will be different from other SaaS and developer tools. Locofy is still finalizing its pricing, but it will be based on factors such as the number of screens or components that are converted to code and regularly maintained through artificial intelligence.
