Design-to-code App Builder story
App Builder enables you to go from Design to Code in a single click. Import Figma, Sketch and Adobe XD files and create Apps with ease. Use the Indigo.Design System plugins directly inside Figma, Sketch and Adobe XD to deliver custom themes, import images assets, and ensure all components are mapped one-to-one with controls from the App Builder Toolbox.
Indigo.Design UI Kit
The Indigo.Design System uniquely combines UI Kits that map to real UI controls and components, with tooling that delivers unprecedented productivity helping digital product teams go from pixel-perfect design to production-ready code. Anything you design can be turned into real, usable code, simplifying the designer-developer handoff.
What is a Design System?
Design systems are usually described as a set of design principles and assets that translate to consistency in the way you build user interfaces. The three core advantages of using a design system are:
- Tunes into a specific usage context and app domain.
- Works as an inventory of UX design patterns and brand style guidance.
- Speeds up the design process and significantly improves consistency.
Turn your designs into code
Use file import or your favorite design tool.
Below are the 4 simple steps to get from Design to Code with the App Builder with simple drag & drop.
Step 1: Click New App from the Indigo Cloud or App Builder Home Screen
Step 2: Drag your Sketch file into the "Create from existing design" Drop Area
Step 3: Review the Design in the Cloud IDE
Step 4: Review or Download your Angular code
Download the application
Publish via Plugin
The plugin will help you to publish your designs into App Builder. You can download it by following these steps:
- Open App Builder
- Click on "Crete new application"
- Click on "Get assets for.."
Now you can start using the plugin.
Adobe XD Plugin
Adobe XD Plugin Create App
Sketch Plugin Create App
You can download the Plugins, UI kits and sample apps from the Download Assets page..
Or through the direct links below:
- Figma UI Kit
- Plugin for Figma
- Sample Apps
- Adobe XD UI Kit
- Plugin for Adobe XD
- Sample Apps
- Sketch UI Kit
- Plugin for Sketch
- Sample apps