Internet related News · 2020-01-03

Microsoft’s new tool uses AI to turn design into HTML code -News


sketch2code

Sketch2Code is a product by Microsoft that uses artificial intelligence (AI) to convert sketches to HTML code.

Typically, in the creative design process, ideas & designs are drawn on a whiteboard to illustrate & organize them, & subsequently, they are manually converted to HTML codes as a framework. While this process works, it takes a lot of time. Sketch2Code is aimed at speeding up the creative design process by helping designers to convert their hand-written designs to working HTML codes instantly using AI. 

The Sketch2Code AI system can intelligently detect work-flow & design patterns. This custom model has been trained to recognize meaningful HTML design elements in every image & handwritten text using object & text recognition services. Sketch2Code can also understand structures & detect the position of objects in images fed into the algorithm. These are then used to build a working HTML prototype with all the design elements that have been detected in an image. 

Sketch2Code is part of Azure Cognitive Services. It uses Computer Vision & Custom Vision APIs to detect object & OCR to recognize handwritten texts. 

With Sketch2Code, designers can draw their ideas on a whiteboard & see the codes for testing the new ideas for their Webpages in no time at all. The process is quite seamless & straightforward. You take a picture of your design sketch & upload to the Sketch2Code Website. The AI goes to work on your uploaded design & you can get download the HTML code generated instantly. You can download the HTML code created using the “Download HTML” button or even view the predicted details of all the objects on your sketch. You can then check the downloaded code & make the required changes if there is any at all. Sketch2Code is free to use.


Image Credit: Microsoft


Click here to opt-out of Google Analytics