After creating user interfaces and experiences in Figma, developers must code the designs to build usable websites and applications. Locofy, an Accel-backed Singaporean frontend development platform, seeks to save hours with a one-click solution that converts Figma and AdobeXD mockups to code.
Lightning, Locofy’s latest tool, uses the startup’s Large Design Models. Honey Mittal and Sohaib Muhammed, Locofy’s creators, compare it to OpenAI’s LLM pioneering before ChatGPT popularized it. They needed Lightning because developer shortages cost organizations money and tire out programmers.
Lightning, a Figma plugin from Locofy, automates 80% of frontend development, so lean startup developers can concentrate on operating their businesses and getting them to market.
First, it will be available for Figma websites and online applications. Later this year, AdobeXD, Penpot, Sketch, Wix, and probably Canva and Notion will support it.
Mittal said the business spent over $1 million to build Lightning for startups and customer-focused organizations with small teams who need to expedite frontend development. Lightning and its LDMs were created in-house and trained on millions of drawings.
Locofy Classic, launched in 2021, required five steps: design optimizations, tagging interactive elements, styling to work on different screen sizes, components and props to identify repeating elements and make them modular, class name edits, and adapting to preferred configurations like typescript or JS.
Mittal and Muhammed learned how image-based neural networks, multimodal transformers, graph-based neural networks, sequence-to-sequence models, stack-pointer networks, heuristic models, and LLMs might automate each step. The Unified Large Design Model has over half a billion characteristics from millions of designs, they claim.
Each of Locofy Lightning’s steps—tagging, layer grouping, responsiveness, components, and class names—uses AI-based algorithms and heuristics. Lightning is one-click after steps are reduced to one.
Users may inspect frontend code, see an interactive preview, and tweak it before exporting.
Locofy, founded in 2021, got $7.5 million from Accel and Northstar Ventures.
Beyond design-to-code, it wants to add tools to develop design systems, leverage public UI libraries, and build backends to frontends using Github Copilot and CI-CD interfaces. Hosting and deployments for entire applications and AI assistance for designers are also planned.
Locofy hopes to monetize in 2024 after two years in free beta. The creators told Eltrys that AI-code creation is a new category with distinct revenue models compared to SaaS and developer tools. Locofy’s costs will depend on the number of screens or components translated to code and updated regularly using AI.