Разблокировка преобразования веб-снимков в HTML-код с использованием набора данных WebSight.

Unlocking the conversion of Web Screenshots into HTML Code with the WebSight Dataset

March 14, 2024

Авторы: Hugo Laurençon, Léo Tronchon, Victor Sanh

cs.AI

Аннотация

Использование моделей видео-языка (VLM) в веб-разработке представляет собой многообещающую стратегию для повышения эффективности и разблокировки решений без кода: предоставив снимок экрана или эскиз пользовательского интерфейса, VLM может сгенерировать код для его воспроизведения, например, на языке HTML. Несмотря на прогресс в области VLM для различных задач, конкретная задача преобразования снимка экрана в соответствующий HTML была минимально исследована. Мы предполагаем, что это в основном связано с отсутствием подходящего, высококачественного набора данных. В данной работе представлен WebSight, синтетический набор данных, состоящий из 2 миллионов пар HTML-кодов и соответствующих им снимков экрана. Мы донастраиваем фундаментальную VLM на нашем наборе данных и демонстрируем умение преобразовывать снимки веб-страниц в функциональный HTML-код. Для ускорения исследований в этой области мы открываем исходный код WebSight.

English

Using vision-language models (VLMs) in web development presents a promising strategy to increase efficiency and unblock no-code solutions: by providing a screenshot or a sketch of a UI, a VLM could generate the code to reproduce it, for instance in a language like HTML. Despite the advancements in VLMs for various tasks, the specific challenge of converting a screenshot into a corresponding HTML has been minimally explored. We posit that this is mainly due to the absence of a suitable, high-quality dataset. This work introduces WebSight, a synthetic dataset consisting of 2 million pairs of HTML codes and their corresponding screenshots. We fine-tune a foundational VLM on our dataset and show proficiency in converting webpage screenshots to functional HTML code. To accelerate the research in this area, we open-source WebSight.