{"id":14294,"url":"\/distributions\/14294\/click?bit=1&hash=434adac65d5ae5d3e2e945d184806550325dd9068ef9e9c0681ca88ae4a51357","hash":"434adac65d5ae5d3e2e945d184806550325dd9068ef9e9c0681ca88ae4a51357","title":"\u0412\u043d\u0435\u0434\u0440\u0435\u043d\u0438\u0435 \u0418\u0418 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u043d\u043e\u0441\u0438\u0442\u044c \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f\u043c \u043c\u0438\u043b\u043b\u0438\u0430\u0440\u0434\u044b \u0432 \u0433\u043e\u0434","buttonText":"","imageUuid":""}

Нейронная сеть, которая верстает сайты по картинке Статьи редакции

Прошёл почти год с того момента, как на GitHub опубликовали алгоритм pix2code. И вот ребята из FloydHub на его основе создали нейронную сеть для вёрстки страниц, которую уже можно запустить самому.

Работа алгоритма делится на три этапа:

1. Нейронной сети передаётся картинка-исходник в формате JPEG
2. Алгоритм конвертирует элементы в HTML- и CSS-код
3. На выходе получается свёрстанная версия

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

Пример датасета

Алгоритм учится предсказывать соответствующие HTML-теги, последовательно «изучая» изображение на входе. Когда алгоритм предсказывает следующий тег разметки, он получает скриншот и все «правильные» теги HTML-разметки для этого элемента.

Примеры:

  • 250 циклов работы алгоритма;
  • 350 циклов работы алгоритма;
  • 450 циклов работы алгоритма;
  • 550 циклов работы алгоритма.

Везде выше можно посмотреть пример исходного кода, сгенерированного нейронной сетью, а вот оригинальный сайт, скриншоты которого скармливали алгоритму.

Если вы вдруг фронтенд-инженер (я нет), поделитесь в комментариях: как вам код, сгенерированный алгоритмом?

Более техническое описание проекта доступно по ссылке, а ноутбук для запуска в Jupyter лежит тут.

0
192 комментария
Написать комментарий...
Zi Super

У меня горит пукан, когда говорят, что верстальщикам конец. Я сам не верстальщик, но перед верстальщиками голову предклоняю. Хороших верстальщиков днем с огнем не сыщешь. Всё время попадаются какие-то мудаки, которые кроме лендосов ничего не делали. Как только дело касается что-то сложнее тупого вывода картинок, т.е. появляются формы таблицы и дропдауны, фильтрации, да ещё это всё надо посадить на реакт, то пиздец голову в жопу засовывают или делают месяцами.

Ответить
Развернуть ветку
Кирилл Макеев

Хорошие, думающие верстальщики, быстро съебывают из верстальщиков, потому что хорошо думают. К тому же им не очень приятно работать среди мудаков.

Ответить
Развернуть ветку
189 комментариев
Раскрывать всегда