Как да конвертирате ръчно нарисувани оформления на уебсайтове в HTML код с помощта на Sketch2Code от Microsoft

Чудили ли сте се колко готино би било просто да нарисувате нещо на хартия и да го оставите да оживее в реалния свят? Е, това е просто нещо, което Microsoft постигна с AI захранваното уеб приложение Skletch2Code, което може да преобразува ръкописни чертежи от бяла дъска в HTML уебсайтове с едно натискане на бутон.

Sketch2Code може да конвертира всяко ръчно нарисувано оформление на уебсайт в HTML само за секунди. Инструментът използва услугата на Microsoft Computer Vision AI за откриване на HTML обекти в чертеж и след това използва разпознаване на текст, за да извлече ръкописния текст в чертежа, за да комбинира и изгради HTML фрагменти от всички елементи на дизайна в изображението.

Това прави безумно бързо за уеб дизайнерите и разработчиците да изградят HTML прототипи на уебсайт в много различни стилове за броени секунди. Ако се интересувате да знаете как работи това в бекенда, не забравяйте да прочетете техническите подробности за Sketch2Code на уебсайта на Microsoft.

По-долу е даден бърз урок, който да ви покаже колко лесно е да използвате Sketch2Code за преобразуване на чертежи на оформление на уебсайтове в реални HTML страници.

Първо, нарисувайте оформление на вашия уебсайт върху бяла дъска или бял лист. След това направете снимка и я запазете на компютъра си. След това щракнете върху бутона по-долу, за да отворите уеб приложението Sketch2Code във вашия браузър.

Стартирайте уеб приложението Sketch2Code

След като отворите уебсайта, щракнете върху Качете дизайн бутон и изберете картината на оформлението на уебсайта, която сте нарисували върху бяла дъска или бял лист.

След като качите ръчно нарисувания дизайн на уебсайт, седнете и гледайте как Sketch2Code използва AI автоматично генерира HTML страница въз основа на оформлението в изображението, което сте качили.

След като процесът приключи, ще ви бъде показана визуализация от прясно генерираната HTML страница заедно с опцията за изтегляне на пълния код. Кликнете върху Изтеглете своя HTML код бутон, за да получите .html файла на ръчно нарисуваното оформление на уебсайта си, за да можете да го тествате и визуализирате локално във вашия уеб браузър.

Това е. Надяваме се, че Sketch2Code ви спести време за създаване на прототип на оформление на уеб страница.