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

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

Работа алгоритма делится на 3 этапа:
1. Алгоритм получает JPEG-изображение дизайна страницы.

Нейронная сеть, которая верстает сайты по картинке Верстка, Сайт, Нейронные сети, Алгоритм, Гифка, Длиннопост

2. Алгоритм конвертирует элементы в HTML- и CSS-код.

Нейронная сеть, которая верстает сайты по картинке Верстка, Сайт, Нейронные сети, Алгоритм, Гифка, Длиннопост

3. Полученный результат

Нейронная сеть, которая верстает сайты по картинке Верстка, Сайт, Нейронные сети, Алгоритм, Гифка, Длиннопост

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


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

Примеры:
- 250 циклов работы алгоритма;

- 350 циклов работы алгоритма

- 450 циклов работы алгоритма;

- 550 циклов работы алгоритма.


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

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

Взято отсюда.

Web-технологии

457 постов5.8K подписчик

Добавить пост

Правила сообщества

1. Не оскорблять других пользователей

2. Не пытаться продвигать свои услуги под видом тематических постов

3. Не заниматься рекламой

4. Никакой табличной верстки

5. Тег сообщества(не обязателен) pikaweb

Вы смотрите срез комментариев. Показать все
157
Автор поста оценил этот комментарий
Меня, как айтишника, очень радует прогресс в технологиях и вот это всё. Но и, как верстальщика, пугает)
раскрыть ветку (83)
108
Автор поста оценил этот комментарий
Думаю тебе, как верстальщику, гораздо больший вред нанесли соцсети, куда очень плотно перебрался малый бизнес. Многим теперь достаточно просто группы вк, безо всякого сайта.
раскрыть ветку (10)
7
Автор поста оценил этот комментарий

На самом деле желающих иметь сайт всё равно ещё очень много, зачастую в фирме 1,5 человека работает и на тендерах и прочих не онлайн продажах, а сайт всё равно нужен как визитка компании. Да, многие через соц.сети продают, но это довольно небольшая ниша ширпотреба, а очень много фирм которые либо b2b, либо продают дорогие товары, им без сайта или хотя бы площадки на каком-нить агрегаторе никуда.
Впрочем у меня может быть деформация картины мира, из ЦА нашей компании. Но опыт подсказывает что любой зачуханный магазин мебели/дверей на окраине и то хочет себе онлайн магазин(то что он ему не нужен, не значит что он его не хочет и не купит).

раскрыть ветку (2)
2
Автор поста оценил этот комментарий

Соглашусь, но мало кто это поймет.

1)ВК выбирают не потому что это круче, а потому что это единственная возможность хоть как-то получить продажи, без особых затрат, у всех нормальных компаний есть и страница в ВК и сайт и инстограмм и по чуть чуть с каждого источника получают свою ЦА.

Плюс к этому не всю ЦА можно найти в соцсетях. (щебень, пожарные сигнализации, медицина и еще около 10000 тематик)

Картина поменяется если VK сделает полноценные магазины как в Ebay

2) WEb сейчас в моде и только развивается, веб состоит не только из сайтов визиток, сейчас любая аналитическая система, панель управления делается в виде веб интерфейса (на беке API для фронта, на фронте react/vue) , доля таких проектов в среднем бизнесе очень велика.

3) Нейросеть никого не заменит, но она поможет веб-разработчикам делать какие-то простые вещи быстрей, подготавливать структуру проекта и всякое такое, а мелкие блоки и логику придется уже продумывать сасостоятельно, т.е. другими словами , человек который пользуется нейросетью все равно должен будет знать от А до Я CSS+JS. И самое главное не стоит забывать о поддержке кода, написать можно все что угодно, а написать поддерживаемый код, придерживаясь методологий , код стайлов - это уже сложней. А еще докумнетация нужна, тесты и куча всего.

p.s. FLOAT:LEFT , кому это нужно в 2018? , уже флексы давно используют.

раскрыть ветку (1)
Автор поста оценил этот комментарий

Полностью с вами согласен)

ещё комментарии
47
Автор поста оценил этот комментарий

Интересная тема с этими сетями нейронными пошла. Они уже и фотошопят и порнуху снимают. Теперь вот сайты. Рано или поздно это приведет к созданию полностью автоматизированного интеллекта который сможет всем этим управлять и выдавать точные и качественные результаты. А учитывая неминуемую популярность - будет быстро обучаться. Как итог получим качественные и дешёвые ИТ продукты. С которыми не сможет конкурировать даже гениальный человек чисто физически (жрать, срать, спать - роботу не нужно).

ВЫВОД: Бросаем учебу и срочно устраиваемся в ЖЭК дворниками. Скоро эта вакансия станет дефицитом. Получается такой регресс человечества через прогресс машин.

раскрыть ветку (51)
43
Автор поста оценил этот комментарий

Говоришь, прямо как после изобретения парового двигателя. Или как после появления электричества. И во времена индустриализации так же говорили. А еще после появления компьютеров.

раскрыть ветку (33)
27
Автор поста оценил этот комментарий

Есть разница между изобретением топора и изобретением "изобретателя топоров". Все о чем ты говоришь - топоры.

раскрыть ветку (25)
25
Автор поста оценил этот комментарий

Шустро вы версатальщиков с созидателей записали. Но если обойтись без философии, то речь идет всего лишь о том, что машины снова отберут работу у низкоквалифицированных рабочих. Правда, как показывает практика, работа для них все равно находиться, несмотря на бурный рост населения.

раскрыть ветку (24)
2
Автор поста оценил этот комментарий

Ну верстальщики это просто пример я думаю. Сюда можно практически любую специальность прикрутить при желании. Как оно будет на самом деле, разумеется, покажет время. Однако не стоит недооценивать происходящее я думаю.

раскрыть ветку (22)
DELETED
Автор поста оценил этот комментарий

Если бы вы почитали о том что такое нейросети, то не питали бы иллюзий относительно их всемогущества. Автоматизировать через них можно далеко не все. Нейронкам по прежнему недоступны абстракции, и едва ли когда будут. А значит архитектура программирования едва ли когда-то будет автоматизирована. Плюс технологии не стоят на месте, и развивают их опять же люди. Обучать нейронки новым технологиям долго и дорого. Очень дорого. Учитывая как часто они сейчас выходят)

3
Автор поста оценил этот комментарий

Специалистов, занимающихся созидательной деятельностью - на данном этапе нельзя заменить машиной. Как и художников всех мастей.

раскрыть ветку (20)
4
Автор поста оценил этот комментарий

О!

Нейросеть пишет музыку в стиле Баха так, что более 50% людей, не имеющих высшее образование, не могут отличить музыку, созданную Бахом, от музыки, созданной Н.

Н. Научилась оценавать ценность картин лучше людей. Критиков в топку.

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


Про художников вообще молчу- в стиле любых художников пишут картины или переводят фотки в картины или что угодно.


Нейросети обучаются в миллионы раз быстрее людей. Мы уже выпустили джинна из бутылки и мы уже проиграли.

раскрыть ветку (6)
5
Автор поста оценил этот комментарий
Н. Научилась оценавать ценность картин лучше людей. Критиков в топку.
по каким критериям? учитывая, что это очень часто субъективно
Нейросеть пишет музыку в стиле Баха так, что более 50% людей, не имеющих высшее образование, не могут отличить музыку, созданную Бахом, от музыки, созданной Н.
я и так Баха от других композиторов не отличаю
раскрыть ветку (1)
Автор поста оценил этот комментарий

1. По стоимости работ. Все тупо.

2. В том-то и фишка, что оценивали люди, которые могут/должны отличать.

2
Автор поста оценил этот комментарий

1- эта музыка звучит как саундтрек к контре, но никак не в стиле Баха.

2-про оценку картин вовсе бред. Если оценщики опиентируются на ощущения, то на что ориентируется машина? В обоих случаях несерьёзно.

3- тут хз, я не медик

4- произведение искусства это не то, как оно выглядит, а то, что оно за собой несет, насколько увлекает. Нейросеть может создать картину "в стиле"  какого-нибудь Айвазовского, но не может выработать собственный стиль и собственные мысли.

раскрыть ветку (2)
Автор поста оценил этот комментарий

Вы знаете, о чем пишите, или "по ощущениям"?

раскрыть ветку (1)
Автор поста оценил этот комментарий

Если бы не знал- то работал бы на заводе ;)

Автор поста оценил этот комментарий

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


Пиздец врачи пидорасы. Лучше пусть люди умирают от неверных диагнозов зато мы не потеряем работу. Я еще слышал что в Америке из за забастовок врачей не ввели робота анестезиолога хотя он делал инъекции в 10 раз дешевле. И при этом лучше высчитывал дозы. Но нет сохранить свою работу важнее чем чью то жизнь.

3
Автор поста оценил этот комментарий

Нейросети фотошопят уже. Что мешает им научится рисовать? Сделал фото с натуры, перевел в нужный формат, подфотошопил что надо, распечатал на спецовом принтере, который брызгается масляной краской или любым другим инструментом. Вот тебе и художник.

раскрыть ветку (12)
4
Автор поста оценил этот комментарий
нейросеть как школьник, которого научили решать стандартные задачи, что-то нестандартное ставит в тупик
раскрыть ветку (9)
8
Автор поста оценил этот комментарий

Но ведь школьник превращается... превращается школьник... в элегантные шор... в студента всмысле.

раскрыть ветку (6)
Автор поста оценил этот комментарий
те кто научатся думать, да, а остальные так и живут всю жизнь "школьниками"
Автор поста оценил этот комментарий

тут скорее информация к тому, то нужно быть не верстальщиком, а погонщиком нейросети которая верстает. Что именно это скоро станет современным и быстрым инструментом.

раскрыть ветку (1)
DELETED
Автор поста оценил этот комментарий

Нейронкам недоступно представление абстракции.

раскрыть ветку (2)
1
Автор поста оценил этот комментарий

Выше написал, что это не так.

Да и игру в го, например, стандартной задачей не назовешь- там слишком много вариантов.

1
Автор поста оценил этот комментарий

Есть нейросети с обучением через "как надо" и сети с обучением без учителя

Автор поста оценил этот комментарий

Быть им мешает неумение мыслить, отсутствие чувств и человечности в целом. Ты можешь быть сколько угодно техничным скульптором, но какой в этом смысл, если никто не хочет смотреть на твои работы? В добавок ко всему, нейросети создают ничего нового, они смешивают существующее.

раскрыть ветку (1)
Автор поста оценил этот комментарий

Человек тоже делает что то новое лишь смешивая старое. Люди это и есть высокотехнологичные компьютеры

Автор поста оценил этот комментарий

сегодня верстальщики, а завтра у тебя считывают мысли, и ИИ сам пишет код под твои хотелки

Автор поста оценил этот комментарий
_А что не так? С изобретением конвеерного производства из 100 рабочих осталось штук 20. После появления компьютеров - штук 10.
_Если вы не заметили у нас уже больше 70-80% людей работает в сфере обслуживания, так как производство почти все автоматизированно. Если автоматизируют обслуживание, людям уже деваться толком некуда будет.
раскрыть ветку (3)
1
Автор поста оценил этот комментарий
Сижу я сейчас у автоматизированного станка, решил вздремнуть пока файлы пилятся, нажал кнопку "работа без оператора". Проснулся я от ощущения тишины, эта железяка сделала первый файл и ушла в ребут. Ребята, время полной авторизации наступит, не спорю, но об этом следующий раз я поговорю с автоняней в доме престарелых.
Автор поста оценил этот комментарий

Люди будут заниматься чем то еще? Что за упаднический консерватизм, сейчас огромное количество людей заняты в областях, которых не существовало 5, 10, 15, 20 лет назад, и глупо считать, что мы уперлись в потолок, и ничего нового уже не будет. Люди будут больше заниматься интеллектуальным и творческим трудом, сфера развлечений растет как на дрожжах, люди уже играют в игры за деньги, пока роботы гайки закручивают. Вот так потеря, да?

Автор поста оценил этот комментарий

Базовый доход ? Кто-то же должен покупать произведенное и автоматизированное


А вообще, чиновников давно пора автоматизировать.

Автор поста оценил этот комментарий

Потому что тяжело человеку с нынешними знаниями просто на ровном месте представить, чем ты будешь зарабатывать на хлеб в будущем. Потому что никогда не будет той халявы и равноправия как было у людей в мультике WALL-E. Хотя даже там ими всеми правил один ИИ.

Автор поста оценил этот комментарий
Говоришь, прямо как после изобретения парового двигателя.

Паровая машина - пустая затѣя. Угля хватитъ въ лучшемъ случаѣ на сто или двѣсти лѣтъ.

раскрыть ветку (1)
Автор поста оценил этот комментарий

Можно нефть использовать как топливо, но и она тоже конечная. Динозавры вряд ли снова появятся.

3
Автор поста оценил этот комментарий

Дворниками?

Т.е. их не заменят машины? )

раскрыть ветку (2)
Автор поста оценил этот комментарий

А им ходить по улицам не надо. )

Автор поста оценил этот комментарий

А ещё строителей и джамшутов

1
Автор поста оценил этот комментарий

нейросеть, к сожалению, так не работает. она работает на патернах, обучаясь уже на готовых предметах, что-то дать ей новое без примера, чего свет не видел, она не сможет ничего сделать/построить. Именно поэтому надо уходить в науку

раскрыть ветку (1)
Автор поста оценил этот комментарий

Есть обучение с учителем и без

2
Автор поста оценил этот комментарий

Интересная тема с этими двигателями. Они уже и телеги толкают и и ткани шьют. Теперь вот автомобили. Рано или поздно это приведет к созданию полностью автоматизированного машины который сможет всем этим управлять и выдавать точные и качественные результаты. А учитывая неминуемую популярность - будет быстро улучшатся. Как итог получим качественные и дешёвые продукты. С которыми не сможет конкурировать даже сильнейший человек чисто физически (жрать, срать, спать - роботу не нужно).



ВЫВОД: Бросаем учебу и срочно устраиваемся в ЖЭК дворниками. Скоро эта вакансия станет дефицитом. Получается такой регресс человечества через прогресс машин.

Плохой вывод...

Иллюстрация к комментарию
Автор поста оценил этот комментарий

А чо, норм. Человек будет избавлен от необходимости писать тонны строк кода

раскрыть ветку (3)
DELETED
Автор поста оценил этот комментарий
И рабочие места тоже проебем, и целый сегмент фриланс бирж уйдёт в никуда
раскрыть ветку (1)
1
Автор поста оценил этот комментарий

Есть еще заводы

Автор поста оценил этот комментарий
Ага, лет 10 ещё будут писать. Смотрел их код. Ребята ищут инвесторов)
DELETED
Автор поста оценил этот комментарий
Так, порнуха есть, ждём когда появится алгоритм генерирующий российский кинематограф. Запасаемся поп-корном.
Предпросмотр
раскрыть ветку (1)
Автор поста оценил этот комментарий

"Завод станкостроительных станков" смотрел? Уже в шаге от российского кинематографа

Автор поста оценил этот комментарий

Это всего лишь означает, что будет нужно меньше программистов, вот и все, никуда они не исчезнут. "Качественные и дешевые ИТ продукты" будут только те, которые шаблонные

Автор поста оценил этот комментарий

Ну и бредятина.

Автор поста оценил этот комментарий
Либо усиленно изучать электронику и машиностроение.
раскрыть ветку (2)
9
Автор поста оценил этот комментарий

И учить языки программирования, пока машины не сделали их государственными.

раскрыть ветку (1)
Автор поста оценил этот комментарий

В этом государстве три официальных языка 1С, Visual Basic и Паскаль.

2
DELETED
Автор поста оценил этот комментарий

Ты просто теряешь основную фишку, у тебя появился инструмент который позволит тебе делать работу быстрее, потому как эта история повторяется постоянно: сначала все сайты делали вручную, потом появились готовые CMS, но разработчики не осталась без работы.
Я вот планирую присмотреться и возможно возьму на вооружение, что бы оно за меня делало часть скучной работы, а нюансы прорабатывать буду я.

раскрыть ветку (1)
Автор поста оценил этот комментарий
Ну как бы, код там не айс + нужен специально обученный дизайнер иначе все пичаль
5
Автор поста оценил этот комментарий

А меня - нет. Обычный клипальщик говносайтов.

3
Автор поста оценил этот комментарий

нуу, я тоже верстак, но никогда не парюсь по этому поводу и вот почему:
наклепать какую-нибудь хрень сможет и нейросеть и еще куча всего.

но сделать хороший продуманный сайт с анимацией не смогут нейросети явно, так что, если ты хороший верстак - бояться нечего)

раскрыть ветку (4)
3
Автор поста оценил этот комментарий

Пока не сможет.

3
Автор поста оценил этот комментарий

Это задача создателей прототипов.

Да и до этого дойдет быстро.

раскрыть ветку (2)
Автор поста оценил этот комментарий

почти уверен, что вся разработка замениться нейросетью, кроме всяких сисадминов, возможно.
это дело времени

раскрыть ветку (1)
Автор поста оценил этот комментарий

Скорее всего, к этому времени, привычных нам сайтов не будет.

То есть, относительно, скоро.

Автор поста оценил этот комментарий

Курс по ИИ тебе в помощь! Пока не поздно, так сказать ;) Не будешь верстать, будешь нейросети обучать!

Автор поста оценил этот комментарий

Да, есть такое. Я безумно рад развитию технологий и тому, что новички все быстрее приходят к чистому коду и его форматированию. Но также отпугивает повышение конкуренции и реально заменой роботами того, чем ты раньше зарабатывал.

Еще чуть и требования на джуна будут такие большие, что потянет лишь нынешний senior

Автор поста оценил этот комментарий
верстать больше не надо :) боюсь за качество кода на выходе...
Автор поста оценил этот комментарий

верстальщиков это не убьет, просто определенный сегмент рынка сможет решать свои задачи без верстальщиков, многим нужны говно сайты без поддержки кода и всяких наворотов, без качественной структуры кода, новых технологий и прочего добра. Сейчас многие вроде как делают даже сайты на WIX , убило ли это веб? зарплаты фронтенд разработчиков только растут.


Когда вышел Bootstap все говорили, что верстка умерла, теперь можно сделать сайт за 30 минут адаптивный, но у где этот бутстрап? Никто им не пользуется, кроме как прототипов или каких-то очень простеньких структур сайта, так же и с этой технологией будет.

Автор поста оценил этот комментарий

PHP комманды туда пока AI не вставит, ровно как и на JS шаблоны для SAP не распилит, и поведение элементов не напишет...

раскрыть ветку (4)
Автор поста оценил этот комментарий

Это временно

раскрыть ветку (3)
Автор поста оценил этот комментарий

По скриншоту начнет понимать весь возможный интерактив? Никогда.

Для этого нужна дополнительная инфа на входе, тогда сути это будет работать как любой из существующих конструкторов сайтов.

раскрыть ветку (2)
Автор поста оценил этот комментарий

По паре скриншотов уже вполне можно создать   поведение. Для 90 %заказов этого поведения будет достаточно если заказчик Что то особенное вдруг не захочет. В чем проблема написать бекенд? В большинстве своем одна и тоже функциональность.

раскрыть ветку (1)
Автор поста оценил этот комментарий

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

Здесь уже описали идеальное применение этой технологии на данный момент -- быстрое создание живых прототипов будущего сайта для наглядности. Это да, это полезно

1
DELETED
Автор поста оценил этот комментарий

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

1
Автор поста оценил этот комментарий

Не парься, была куча попыток избавиться от верстальщиков и не одна не взлетела

раскрыть ветку (1)
2
Автор поста оценил этот комментарий
Технологии шагают вперед, скоро взлетят.
Вы смотрите срез комментариев. Чтобы написать комментарий, перейдите к общему списку