DEVOPSdigest

WaveMaker announced the release of WaveMaker AutoCode, an AI-powered plugin for the Figma universe that produces pixel-perfect front-end components with lightning fast accuracy.

Software teams using WaveMaker AutoCode can leapfrog from design to development by converting Figma UI designs within minutes into fully functional design-perfect components, layouts, and styles, for further development on WaveMaker’s modern platform. WaveMaker AutoCode works out-of-the-box for Figma designs that use the Material 3 design system, but can be enabled to work with client-proprietary design systems.

WaveMaker AutoCode provides design-conscious professional developer teams in enterprises and ISVs a formal design-to-code workflow for delivering captivating, modern, performant applications and high-fidelity user experiences at warp speed. Key features include:

- Seamless Design-to-UI Conversion: Translates Material 3-based Figma designs into production-ready code ensuring pixel-perfect accuracy for UI elements, app navigation, and interactions.

- Automatic Component Detection: Identifies design elements like forms, lists, and cards, and maps them to corresponding widgets within WaveMaker Studio.

- Design Language Consistency: Supports Figma variables, modes and design tokens, maintaining the integrity of the original design throughout the development process.

- Easy Code Customization: WaveMaker AutoCode generated code can be easily customized to add business logic in WaveMaker’s studio environment making the handoff to the frontend engineering team easy.

- Scalable and Secure Code: Produces enterprise-grade, battle-tested Angular code (React Native for mobile) with built-in support for authentication, authorization, internationalization, and CI/CD pipelines.

- Fits With Client-Proprietary Design System: WaveMaker AutoCode conforms to the Material 3 design system out-of-the-box but is easily customizable to align with any proprietary design system, offering flexibility for enterprises with their unique Design Language System (DLS). Paired with WaveMaker MyStudio (a client-proprietary instance of WaveMaker’s studio with a 100% custom widget library based on client DLS), WaveMaker AutoCode empowers ISVs and enterprises with opinionated designs to rapidly modernize applications en masse, standardize development processes, and seamlessly add business logic, ensuring smooth design-to-development handoffs and delivery of scalable, enterprise-grade applications.

“WaveMaker AutoCode is a game-changer for application development teams battling with the twin challenges of increasing velocity to the business while striving to deliver applications that are pixel-to-pixel matched with designs,” said Vijay Pullur, Co-founder and CEO at WaveMaker. “By integrating AI-powered automation into the design-to-code process, we are enabling teams to produce cross-platform, enterprise-grade apps with unmatched efficiency and scalability.”

WaveMaker AutoCode is part of WaveMaker’s comprehensive suite of new offerings to help software developers build better software, faster. Alongside WaveMaker AutoCode, the WaveMaker UI Kit provides design teams with modern, ready-to-use UI components, while WaveMaker CoPilot, an AI-powered assistant within WaveMaker’s developer studio, enables prompt-based automatic UI customization for WaveMaker AutoCode generated UI. These three solutions work seamlessly together, allowing teams to scale custom app creation without sacrificing quality or consistency or high-fidelity UX. Developers can continue to drag and drop UI widgets to easily, quickly and cheaply compose applications using WaveMaker’s out-of-the-box widget library, all the while conforming to the Wave design language system.

WaveMaker AutoCode is now generally available. Designers and developers using WaveMaker can start building functional apps directly from their designs, leveraging WaveMaker AutoCode’s speed and accuracy to bridge the gap between ideation and deployment.