We are excited to share a new addition to the Adaptive Card Designer, enabling you to instantly create a card from a bitmap image.
Pic2Card automatically converts a card-like image into an Adaptive Card payload. The generated Adaptive Card will reproduce any internal images, text, color, fonts, and even detect input fields – so that the output card matches the source image as closely as possible.
This service helps users get started quickly with the Adaptive Card Designer, especially those who are more comfortable with traditional image editing tools.
Pic2card uses Machine Learning and other heuristic processing to recreate the Adaptive Card from the image. The entire pipeline is shown below. The two main parts are:
- The Machine Learning model identifies each elements’ bounding box to identify what type of element is resembles
- The pipeline then does all the layout settings, property extraction, etc.
Curious to see how it was built?
- This entire pipeline is part of the pic2card backend
service, which is hosted as an Azure Function.
- The frontend part of the pic2card integrates with the Adaptive Card Designer
Try it now at https://adaptivecards.io/designer by clicking New Card and then Create from Image
We’ll be improving the model over time, so please let us know if you encounter any issues via GitHub.
This entire feature was built by our wonderful community member Imaginea. Many thanks to your whole team for bringing this feature to Adaptive Card users, including: