Як перетворити намальовані вручну макети веб-сайтів у HTML-код за допомогою Sketch2Code від Microsoft

Ви коли-небудь замислювалися, як круто було б просто намалювати щось на папері і дати йому ожити в реальному світі? Що ж, це саме те, чого Microsoft досягла за допомогою веб-програми Skletch2Code на основі штучного інтелекту, яка може конвертувати рукописні малюнки з дошки на веб-сайти HTML одним натисканням кнопки.

Sketch2Code може перетворити будь-який намальований від руки макет веб-сайту в HTML за лічені секунди. Інструмент використовує службу Microsoft Computer Vision AI для виявлення об’єктів HTML на кресленні, а потім використовує розпізнавання тексту для вилучення рукописного тексту на малюнку, щоб об’єднати та створити фрагменти HTML усіх елементів дизайну на зображенні.

Завдяки цьому веб-дизайнери та розробники дуже швидко створюють HTML-прототипи веб-сайту в різних стилях за лічені секунди. Якщо вам цікаво дізнатися, як це працює у серверній частині, обов’язково прочитайте технічні відомості про Sketch2Code на веб-сайті Microsoft.

Нижче наведено короткий посібник, який покаже вам, як просто використовувати Sketch2Code для перетворення креслень макета веб-сайту на справжні сторінки HTML.

Спочатку намалюйте макет свого веб-сайту на дошці або білому аркуші. Потім сфотографуйте його та збережіть на своєму комп’ютері. Після цього натисніть кнопку нижче, щоб відкрити веб-програму Sketch2Code у своєму браузері.

Запустіть веб-програму Sketch2Code

Відкривши веб-сайт, натисніть на Завантажити дизайн і виберіть зображення макета веб-сайту, яке ви намалювали на дошці або білому аркуші.

Після завантаження намальованого вручну дизайну веб-сайту сядьте і подивіться, як Sketch2Code використовує штучний інтелект, який автоматично створює HTML-сторінку на основі макета зображення, яке ви завантажили.

Після завершення процесу вам буде показано попередній перегляд щойно згенерованої HTML-сторінки разом із можливістю завантажити повний код. Натисніть на Завантажте свій HTML-код кнопку, щоб отримати файл .html з намальованим макетом веб-сайту, щоб ви могли протестувати та попередньо переглянути його локально у своєму веб-браузері.

Це воно. Ми сподіваємося, що Sketch2Code заощадить ваш час на створення прототипу макета веб-сторінки.