Как преобразовать нарисованные вручную макеты веб-сайтов в HTML-код с помощью Sketch2Code от Microsoft

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

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

Это позволяет веб-дизайнерам и разработчикам безумно быстро создавать HTML-прототипы веб-сайтов во многих различных стилях за считанные секунды. Если вам интересно узнать, как это работает в серверной части, обязательно прочтите технические подробности о Sketch2Code на веб-сайте Microsoft.

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

Прежде всего, нарисуйте макет своего веб-сайта на доске или белом листе. Затем сфотографируйте его и сохраните на свой компьютер. После этого нажмите кнопку ниже, чтобы открыть веб-приложение Sketch2Code в вашем браузере.

Запустите веб-приложение Sketch2Code.

После открытия веб-сайта щелкните значок Загрузить дизайн и выберите изображение макета веб-сайта, которое вы нарисовали на доске или белом листе.

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

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

Вот и все. Мы надеемся, что Sketch2Code сэкономит ваше время при создании прототипа макета веб-страницы.