{"id":10776,"title":"\u0411\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u044d\u0442\u043e\u043c\u0443 \u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u0443 \u0432 \u043e\u043a\u0435\u0430\u043d \u043f\u043e\u043f\u0430\u0434\u0451\u0442 \u043c\u0435\u043d\u044c\u0448\u0435 \u043f\u043b\u0430\u0441\u0442\u0438\u043a\u0430","url":"\/redirect?component=advertising&id=10776&url=https:\/\/vc.ru\/acer_russia\/347915-acer-vypustila-pervyy-noutbuk-iz-pererabotannogo-plastika&placeBit=1&hash=368c351f012741e124bb4bc6c0b9b05d5e0f9033fab83ea5e301424877f73936","isPaidAndBannersEnabled":false}
Будущее
Denis Shiryaev

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

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

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

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

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

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

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

Примеры:

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

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

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

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

0
191 комментарий
Популярные
По порядку
Написать комментарий...
Евгений Курилов

Пиздец верстальщикам.

Ответить
112
Развернуть ветку
Евгений Беляков
Ответить
56
Развернуть ветку
Denis Shiryaev

Пока в скетч не добавят кнопку "Сверстать под все платформы и залить на FTP" я думаю нет, но вопрос времени конечно же, пара лет еще и простенький лендинг можно будет самому нафигачить

Ответить
20
Развернуть ветку

Комментарий удален

Развернуть ветку
Denis Shiryaev

Ну тут прям из скриншота, быстрее в разы мне кажется — но в целом зависит от того, добавит это кто-то из крупных редакторов или нет

Ответить
4
Развернуть ветку
Artem Korsunov

Прямо из скриншота уже никому не нужно, всё собирается из шаблонов. Дизайнерам тоже скоро такой же конец, как и верстальщикам

Ответить
10
Развернуть ветку
Сергей Артёменко

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

Ответить
34
Развернуть ветку
Artem Korsunov

Я это как раз понимаю, поэтому и написал "дизайнерам тоже скоро такой же конец, как и верстальщикам" :)

Ответить
2
Развернуть ветку
Serge Arsentiev

"дизайнерам" (в кавычках), было бы вернее.

Ответить
4
Развернуть ветку
Сергей Артёменко

а шаблоны кто рисовать будет)

Ответить
4
Развернуть ветку
colorless

Шаблоны имеется ввиду какой нибудь дефолтный material design, его уже рисовать не надо. Дизайнеры будут рисовать в итоге концепты и пример UI, дальше все роботы на основе как раз шаблонов будут строить, а люди дописывать скрипты.

Ответить
1
Развернуть ветку
Сергей Артёменко

Ни один робот не разберет че от него хочет маркетолог с гуманитарным образованием) и от бесконечных правок сюжет матрицы наступит очень скоро))

Ответить
66
Развернуть ветку
Abo Truk
Ответить
18
Развернуть ветку
Saveliy Dzvonkevych

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

Ответить
5
Развернуть ветку
Ицтерские Данелянды

Скорее будет так. Маркетолог будет работать с веб-дизайнером, задача которого будет грамотно расположить блоки в фотошопе. Уже дальше макет или верстка отдаётся фронтендеру на добавление интерактива. Если его нет, то сразу программистам.

Ответить
1
Развернуть ветку
Станислав Куликов

Так во всех конструкторах уже давно так. В том же самом Виксе, например.

Ответить
0
Развернуть ветку
Саша Грибоедов

с ума сойдешь на виксе делать сайт, а потом его обслуживать

Ответить
0
Развернуть ветку
Роман Романов

Я работаю над подобным : )

Ответить
0
Развернуть ветку
Сергей Артёменко

или верстать

Ответить
0
Развернуть ветку
Pavel Sense

Вот тогда то все и вернуться в студию Артемия Лебедева за логотипами и дизайном.

Ответить
4
Развернуть ветку
Serge Arsentiev

Нельзя с бюджетом 20 000 рублей и планиремой прибылью 40-50 000 рублей в месяц "вернуться" в то место где просят 1 млн. рублей за несколько картинок.
 
Если бы лого Лебедева позволяли, потратив 1 млн, заработать 3 млн. "по сравнению с обычным порошком", то их бы покупали и дороже. А так это просто отсечка по бедности.
 
Скажем, себестоимость спорт-каров самоделок (единичные экземпляры), держится все же в пределах $20-$30к, но с навешиванием производственной программы, подбора запчастей по принципу совместимости распространенности, налогов на всех уровнях, крэш-тестов, сертификации, плана по окупаемости имеем что имеем - $150 000 - $200 000, за в-общем те же л.с. и те же с. до 100 км/ч.

Ответить
0
Развернуть ветку
Roman Sidorov

Если дизайнерам конец придет, то подобные скрипты останутся без работы :)

Ответить
2
Развернуть ветку
Alex Pop

А шаблоны кто придумывает и делает? Хлебное дерево?

Ответить
0
Развернуть ветку
Ivan Kupalov

Видимо, давно пора уже.

Ответить
0
Развернуть ветку
Sergei Maximov

2019
FTP

Ответить
19
Развернуть ветку
Ruslan Shashkov

2019
2018

Ответить
12
Развернуть ветку
Глеб Горохов

Какое оно, будущее?

Ответить
0
Развернуть ветку
Ицтерские Данелянды

Однозначно с SFTP.

Ответить
6
Развернуть ветку
Sergei Maximov

Ксению Собчак выбрали.

Ответить
1
Развернуть ветку
M

Нужно как-то срочно сворачивать на альтернативную ветку развития истории

Ответить
3
Развернуть ветку
Yury Khudyshyn

Свернули

Ответить
0
Развернуть ветку
Denis Shiryaev

Не я виноват!

Ответить
0
Развернуть ветку
Виктор Билан
Ответить
0
Развернуть ветку
Виктор Билан

Промазал веткой, как удалить?

Ответить
0
Развернуть ветку
Виктор Билан

Docjer, ansible, k8s, балансировщик нагрузки и интеграцию с aws под лендинг :)P.S. Под некоторые вещи и ftp/sftp с головой

Ответить
0
Развернуть ветку
Аркадий Чумаков

у меня опыт близкий к нулевому, на muse собрал сайт windeo.ru без смс и регистрации, тьфу без верстальщика

Ответить
–15
Развернуть ветку
Vlad Spesyvets

Без обид, но сайт дерьмо.

Ответить
31
Развернуть ветку
Аркадий Чумаков

Без обид но он продает

Ответить
1
Развернуть ветку
TRUNGPA1 .

Вы полагаете что веб-приложения существуют только для мелких продаж? Сайт даже до говна не дотягивает, хотя лох не момент, вот и продает))

Ответить
3
Развернуть ветку
bum pum

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

Ответить
0
Развернуть ветку
TRUNGPA1 .

Ну некоторые и "качественное" бухло покупают в подвальных помещениях. Каждому свое, я же говорю не вымрет

Ответить
0
Развернуть ветку
bum pum

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

Ответить
1
Развернуть ветку
TRUNGPA1 .

Ну лучше тогда шаблон за 3-5т. взять, и набить его через админку, чтобы хоть прилично выглядело, хотя и там о каких-то улучшениях говорить не приходится. Тут он прогадал и повелся на рекламу, это очевидно.

Ответить
2
Развернуть ветку
TRUNGPA1 .

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

Ответить
0
Развернуть ветку
bum pum

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

Ответить
0
Развернуть ветку
TRUNGPA1 .

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

Ответить
0
Развернуть ветку
bum pum

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

Ответить
0
Развернуть ветку
TRUNGPA1 .

Проще в каком смысле? С точке зрения знаний, то само их получение для работы, например, инженером или программистом для подавляющего большинства владельцев палаток курей просто не представляется возможным. Я некоторое время был ИП и знаю эту кухню, куча геморроя и бумаг, вся сложность обусловлена нашим законодательством. Палатки держат даже люди с образованием ПТУ, а с точки зрения нервов работа таксиста не менее спокойна. А работа шахтера или лесоруба в разы сложнее. Но я рассматриваю проще/сложнее сточки зрения способностей, а не трудозатрат. Программист сможет держать палатку курей, а вот наоборот никак. Если принять вашу логику то работать кассиром сложнее, чем разработать торговый автомат, ну в каком-то смысле так. Но чтобы потом было проще сначала надо учиться.

Ответить
0
Развернуть ветку
bum pum

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

Ответить
–1
Развернуть ветку
Илья Меджидов

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

Ответить
1
Развернуть ветку
Аркадий Чумаков

Интересно, что никто из комментаторов ничего не предложил. Считай, готового клиента успускают. Я как раз сайт менять думаю

Ответить
0
Развернуть ветку
Цветной коктейль

Комментарий удален по просьбе пользователя

Ответить
0
Развернуть ветку
bum pum

собственнику важнее продажи нежели красиво не красиво иди убого... исполнители всегда недовольны продуктом который делали не они - это ко всему относится... а если есть продажи можно и в улучшение вложиться что наверняка продажи только увеличит

Ответить
0
Развернуть ветку
TRUNGPA1 .

Ну вот когда до улучшений дорастет тогда и обратится к специалистам)

Ответить
0
Развернуть ветку
Olia Nayda

доказательство, что профессия дизайнера ещё долго не умрёт)

Ответить
17
Развернуть ветку
Aleksandr Pavlenko

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

Ответить
15
Развернуть ветку

Комментарий удален

Развернуть ветку
Станислав Тамат

Ох, блядь... мои глаза

Ответить
4
Развернуть ветку
Саша Грибоедов

Сайт отстой как и любой код сгенеренный muse

Ответить
2
Развернуть ветку
Taras Vasylivskyy

А теперь зайди на него с мобильного, и радуйся

Ответить
1
Развернуть ветку
Евгений

Разворачиваются комментарии и исчезают видео и кнопка внизу)) Сайт дерьмо)) Не пользуйся мьюсом

Ответить
0
Развернуть ветку
Виталя Шнайдерсон

И опцию под какую CMS )))

Ответить
3
Развернуть ветку
Mihael Isaev

ROFL )

Ответить
1
Развернуть ветку

Комментарий удален

Развернуть ветку
Агнец невинный

обратно на завод!

Ответить
3
Развернуть ветку
topovyj

Вряд ли. Они могут и будут использовать разные инструменты (в том числе похожие) для своей работы и брать деньги за это.

Ответить
1
Развернуть ветку
Cg Bear

Как мне кажется, скоро (лет через 5-10) верстальщикам, да и вообще всей IT индустрии в целом, нужно будет переучиваться делать всё под VR\AR.

Ответить
1
Развернуть ветку
TRUNGPA1 .

Ну эт считай что паленый вискарь, что-то отдаленно похожее на сайт. Для верстки сайта администрации мухосранска конечно пойдет)

Ответить
0
Развернуть ветку
Ivan Kupalov

Вообще, при таких завалах готовых шаблонов и вполне годных сервисов "запустить сайт за 5 минут" они и так без работы скоро останутся.

Ответить
0
Развернуть ветку
Разный историк

Ховеры, адаптивность, динамика, кросс-браузерность, ... Верстка не должна только выглядеть, как верстка, она должна работать блять.

Ответить
60
Развернуть ветку
Gleb Kudryavtcev

Добавить сюда адаптивность и кроссбраузерность гораздо проще, чем вам кажется.

Ответить
4
Развернуть ветку
Евгений Алленов

И чо и чо?

Вам никогда не приходилось тратить часы на простую базовую верстку с большим объёмом, на основне который ппц срочно надо делать mvp?

Ответить
–2
Развернуть ветку
Разный историк

Нет, ведь для этого есть CSS/JS фреймворки а-ля Bootstrap.

И для особо жаждущих есть даже визуальные редакторы, в которых можно это получить — о Боже (!) ничего не кодя.

Ответить
10
Развернуть ветку
Еремей Бричкинд

для тебя, дружочек, сделали эдоби мус на русском

Ответить
1
Развернуть ветку
TRUNGPA1 .

К сожалению это невозможно применить ни для какого типа верстки

Ответить
0
Развернуть ветку
Vlad Spesyvets

Не заменит еще лет 5 технологии верстальщка. Но для оптимизации работы, самое то.

Ответить
2
Развернуть ветку
Vlad Mira
Ответить
0
Развернуть ветку
Разный историк

Да. Как лесник, которого заменила бензопила.

Ответить
4
Развернуть ветку
Разный историк

* лесоруб

Ответить
5
Развернуть ветку
TRUNGPA1 .

А она сама чтоль пилит?

Ответить
0
Развернуть ветку
Разный историк

Это была шутка

Ответить
3
Развернуть ветку
Aleksandr Pavlenko

readymag и неделя практики

Ответить
0
Развернуть ветку
Zi Super

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

Ответить
40
Развернуть ветку
Denis Shiryaev

Мне кажется верстальщикам может и правда конец, но front-end инженеры будут нужны еще очень долго и их всегда не хватает.

Ответить
10
Развернуть ветку
Zi Super

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

У верстальщиков есть куча инструментов и знаний (всякие саасы препроцессеры, компараторы пиксельперфекта) (не только верстки, но и UX). Эффективность профессионального верстальщика в десятки раз выше чем эффективность человека, который делает вёрстку + JS и я не один такой. Всё зависит от времени и денег. Если у тебя есть время пилить вёрстку и JS - велкам. Но если всё поставлено на поток и требует высокого качества на выходе, то без проф верстальщика - никуда.

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

Ответить
21
Развернуть ветку
Nikolay Talanov

Все именно так. Я не верстальщик (верстальщик это вообще матерное слово и такая позиция существует только в снг), но фронтендер с очень серьезным богажем скиллов по части UI/UX/интерактивности. И вот со мной в команде есть второй инженер (не считая джуна, который первую неделю работает), классический фронтендер. Вместе пилим серьезную аппу уже год.

В общем 99% всех стилей и 90% изначального кода в JSX реакта написано мною. У нас в быту постоянно ходят шутки что я css-nazi. Каждый раз когда он что-то где-то меняет (требования по изменениям логики, которые затрагивают JSX), заканчиваются "я там все визуально сломал, пофикси плз когда будет возможность". Он пытался писать стили несколько раз, каждый раз я с нуля их переписывал, ибо это даже словами не описать насколько огромная пропасть между "я у мамы классический программист" и "так бля подажжи ебана, тут глобальная переменная вставляется в миксин который юзается в другом миксине и все это юзается в глобальном компонентном css классе с BEM-неймингом и строгим соблюдением каскадности".

Ну и помимо всего этого еще есть сложные анимации (их их оптимизация), общая оптимизация рендеринга/картинок и подобных вещей, кастомная лабуда с SVG, всякие продвинутые css фишки и вагон других вещей, включая банальную css-магию, когда без модификации основной логики приложения можно делать всякие шикарные вещи используя 10-20 строчек css. А без знания как все это правильно готовить вместе (что требует огромного количества жопочасов практики и страданий), можно сделать какую-нибудь фуллскрин анимацию с использованием clip-path, поверх которой будут юзаться blend-modes и все это будет работать с 5 фпс на мощном компе (в то время как в умелых руках результат будет на 10/10).

Ответить
12
Развернуть ветку
Serge Arsentiev

Вроде vc.ru отказался от практики размещения резюме :)
Впрочем, на одном женском форуме был (и есть) специальный раздел "Хвасталки" - надо и здесь такое попросить завести :)

Ответить
3
Развернуть ветку
Nikolay Talanov

Можете в моем твиттере открыть ссылочку на codepen, мне уже давно незачем хвастаться на vc :) Как минимум потому-что тут в основном только представители СНГ компаний.

Ответить
1
Развернуть ветку
Serge Arsentiev

Вы продолжаете делать это :)

Ответить
2
Развернуть ветку
Zi Super

Красавец!

Ответить
0
Развернуть ветку
Коля Фёдоров

Ох как же ты круто сказанул.

Ответить
0
Развернуть ветку
Alexander Belov

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

Ответить
2
Развернуть ветку
Zi Super

Значит Вы не работали над сложными проектами, где требуется качество и скорость. Вот скажите мне, зачем верстальщику знать паттерны проектирования и прочие алгоритмы и приемы оптимизации кода да и вообще кучу языков программирования и шаблонизации? И в тоже время, зачем программисту знать баги CSS браузеров и как сверстать так, чтобы эффективно утилизировать GPU? Чувствует как эти 2 области ну совсем не коррелируют. Что в одном, что в другом случае нужно потратить тысячи часов чтобы стать экспертом. Если Вы всё это умеете, поздравляю, Вы - фулстек разработчик с уклонов во фронтенд.

Ответить
1
Развернуть ветку
Alexander Belov

"утилизировать Gpu"? Зачем верстальщикам его утилизировать? :)

Повторюсь, вы не фронтенд разработчик, если вы не разбираетесь в том, как правильно и эффективно верстать и создавать интерфейсы, которые бы работали быстро на разных устройствах. Если вы не понимаете базовые принципы: reflow, repaint и тд, то о чем можно говорить? Собеседование в любой нормальной IT компании вы не пройдёте как минимум. Мои слова подтвердят даже средние фронты, которые умеют делать приложения на реакте.

Ответить
0
Развернуть ветку
sf

чувак ты просто ленивый. пиксельперфект никому не нужен. препроцессорами можно овладть за неделю. да и не в них дело. надо просто почитать как работает верстка и бразуер. из моей практики я 20% может верстаю, а потом 80% пишу для всего этого богатства JS

Ответить
1
Развернуть ветку
Zi Super

Можешь кинуть ссылки на свои интерфейсы или скриншот?

Ответить
0
Развернуть ветку
sf

чисто такой профессии как верстальщик вроде уже давно нет

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

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

Ответить
8
Развернуть ветку
Anton Matrosov

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

Ответить
1
Развернуть ветку

Комментарий удален

Развернуть ветку
Anton Matrosov

По моему опыту, обычно такое бывает, если навешана куча скриптов от различных вендеров, аналитика, адвертайзинг и тд. Где-то на Медиуме, кажется, один разработчик наглядно показывал разницу во времени загрузки и производительности популярных сайтов, если убрать с них весь этот коммерческий хлам.

Ответить
1
Развернуть ветку

Комментарий удален

Развернуть ветку

Комментарий удален

Развернуть ветку
Artem Pylypchuk

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

Ответить
0
Развернуть ветку

Комментарий удален

Развернуть ветку
Nikolay Talanov

Удачи вам серьезное приложение на ванилле написать, не сойдя с ума и сделав его поддерживаемым и расширяемым в условиях командной разработки (ибо для таких вещей изначально и создавали все эти либы и фрейморки). Юзать реакты для лендосов это уебанство само собой.

Ответить
10
Развернуть ветку
Коля Фёдоров

Он про фреимворк сказал, как мне показалось. А он достаточно мощен

Ответить
–2
Развернуть ветку
Abo Truk

vanilla js -- это просто js

Ответить
1
Развернуть ветку
TRUNGPA1 .

И даже плюсик кто-то поставил) Просто js это натив. vanilla js - фреймворк. https://habrahabr.ru/post/150594/

Ответить
–1
Развернуть ветку
Abo Truk

Вы-то сами прочитали свой пост и комментарии?

Ответить
0
Развернуть ветку
TRUNGPA1 .

Конечно, это старый прикол)

Ответить
0
Развернуть ветку
Artem Osipov

Тяжело когда не понимаешь что несёшь, да?)

Ответить
4
Развернуть ветку

Комментарий удален

Развернуть ветку
Андрей Иванов

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

Ответить
24
Развернуть ветку
Слон Петрович

Какая-то очень притянутая за уши тема. Распознавание рисунка, а зачем вообще рисунок нужен? Сейчас тьма бесплатных удобных блочных drag and drop редакторов, обычно на бутстрапе, освоившему их несложный интерфейс такой "сайт" как в демо можно наверное меньше чем за минуту собрать.

Ответить
15
Развернуть ветку
Никита Никифоров

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

Ответить
6
Развернуть ветку
Выпил ли mojo?

Татьяныч с вами не согласен.
"Если говорить о профессии дизайнера, то наиболее продвинутые дизайнеры уже сегодня занимаются скриптованием, а не в фотошопе сидят. А через пять лет вопрос будет полностью закрыт - дизайнер станет скорее программистом, чем богемным распиздяем. Хотя я не сильно ошибусь, предположив, что дизайнеры через пять лет будут богемными распиздяйскими программистами."

Ответить
2
Развернуть ветку
Serge Arsentiev

Все ждут каких-то революционных изменений, а _практическая_ ежедневная работа меняется очень и очень медленно.
Вот вчера в мелком салоне сотовой связи манагеры обещали руководству послать какой-то фотоотчет. Ну а несколько лет назад - просто почту бы скинули. А еще несколько лет назад - может факсанули бы рукописное. А еще до этого - продавали бы не сотовые телефоны, а пейджеры - и просто написали бы отчет руками, а директор наутро проверил.
 
Дизайнер же, как сидел и сводил очередные "Скидки! Акция" с очередным стоковым фотоизборажением, так и делает это - последние 20-25 лет, минимум. Если контора побогаче - то делает это с фото со спец. фотосессии - если контора сетевая -то дизайнера нет, есть промо материалы присылаемые из головного офиса, и тот же банальный листочек А4 на стекло окна/двери, где также точно в Ворде напечатано: "Только сегодня - Акция на ... "

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

На сях ромб хуярить будут шоле?

Ответить
3
Развернуть ветку
Выпил ли mojo?

Пфф, как два байта.
=======
#include<stdio.h>

void main()
{
int n,i,j,k;
printf("enter number of rows");
scanf("%d",&n);
for(i=0;i<=n;i++)
{
for(j=0;j<=n-i;++j)
{printf(" "); }
for(k=0;k<=2*i;k++)
{ printf("*");}
printf("\n");
}

for(i=0;i<=n;i++)
{
for(j=n;j>=n-i;j--)
{printf(" ");}
for(k=2*(n-i);k>=0;k--)
{printf("*");}
printf("\n");
}}
=======

Ответить
0
Развернуть ветку
Слон Петрович

Так а причем тут дизайнеры, если речь о верстке? Если человек принципиально не выходит за рамки своей профессии, ему это и так и так не надо. А если выходит, то наверняка умеет пользоваться какой-нибудь программой-конструктором.

Ответить
0
Развернуть ветку
Никита Никифоров

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

Ответить
1
Развернуть ветку
Юрин Иван

Для прототипов думаю самое то

Ответить
0
Развернуть ветку
Ilgar Dadashov

Ну так вся соль не в «дизайне», а в развитии нейросетей, показывают их обширные возможности развития в любом направлении.

Ответить
1
Развернуть ветку
Serge Arsentiev

Илгар, "Вчера смотрел женский футбол, там показывали интересные комбинации, но до гола дело так и не дошло".
Вот правда - сколько можно "показывать возможности" - в основном сводящиеся к сверке примера с базой данных образцов, может быть пора уже показать реальную работу нейросети?
 
Поиск текста в базе данных - базовая операция, доступная уже лет 50, и вот последние 5-7 лет стал доступен поиск паттерна пикселов в базе данных изображений - но почему это внезапно называется "нейросеть", я не понимаю. В проекте статьи пошли в другую сторону - картинка сравнивается с паттерном шаблонов (очевидно), после чего подбирается подходящая комбинация элементов кода ..
 
Почему это нейросеть, а не switch / case ?
С таким же успехом это можно назвать "прикидывание кхм, пальца к носу", на основе базы из миллионов носов.

Ответить
2
Развернуть ветку
Алексей Руденко

Кекеке, а почему в результатах 550 циклов код абсолютно идентичный оригинальной верстке?

Ответить
11
Развернуть ветку
Sultan Zhumatayev

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

Ответить
9
Развернуть ветку
Вава Мики

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

Ответить
6
Развернуть ветку
Serge Arsentiev

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

Ответить
0
Развернуть ветку
Egor Gorobetz

Overfitting

Ответить
4
Развернуть ветку

Комментарий удален

Развернуть ветку

Комментарий удален

Развернуть ветку
Alex Demin

И на весь экран попап-нэйтИв.
Наверстай, и пусть закрыть попробуют.

Ответить
7
Развернуть ветку

Комментарий удален

Развернуть ветку
Alex Demin

От дедлайна до дедлайна отмотал за мердж в мастер ветку.

Ответить
8
Развернуть ветку

Комментарий удален

Развернуть ветку
Егор Гумин

90% CSS с !important. Но если обучали на выборке с говнокод.ру, то получили то, чего хотели, здорово!

Ответить
11
Развернуть ветку
Владимир Миленко

Так код-то говно

Ответить
4
Развернуть ветку
Alex Demin

А может это код говна!

Ответить
6
Развернуть ветку
Рыжий Кот

Тогда недурно

Ответить
25
Развернуть ветку
Andrew

Она уже верстает лучше, чем 90% вестальщиков с фл ру

Ответить
8
Развернуть ветку
Никита Никифоров

Шикарная вещь для прототипирования быстрого. Однозначно это ускорит работу специалистов, но 100% не заменит. Для меня это было бы удобнее использовать чем invision например или marvel. Намного нагляднее и интерактивнее при той же скорости

Ответить
7
Развернуть ветку
Глеб Горохов

Я сам не тестил, но сейчас выглядит пригодным только для "верстки" всякой шаблонной элементарной хрени. Хороший верстальщик в своей работе учитывает кучу важных вещей, о которых робот не догадается (по крайней мере, пока). Даже адаптив часто оказывается не такой простой задачей, т.к. требует особой структуры HTML-кода, а где-то и JS'а. Так что рано вы верстальщиков хороните, товарищи.

А дизайнеры, которые хотят делать код из своих макетов, пусть дизайнят сразу в WebFlow

Ответить
5
Развернуть ветку
Глеб Горохов

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

А вот если дизайн будет рисовать тоже нейросеть, то вероятность успеха выше — роботы думают одинаково (логично)

Ответить
3
Развернуть ветку
Руслан Целебный

классика дезигна - я дезигнер, я так вижу. А то что вы там не можете полупрозрачность последнего символа в попапе внутри попапа со скроллом сделать и округлить края буквы О в центре слов - ваши проблемы

Ответить
3
Развернуть ветку
TRUNGPA1 .

Ну их надо уметь грамотно ставить на место.

Ответить
0
Развернуть ветку
Артём Денница

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

Ответить
6
Развернуть ветку
Dmitriy Nester

Я не спец по верстке - но на в скидку исходники вообще кроме выравнивания ничем не отличаются, разве так может быть? Разве в верстке на один вид страницы должен быть один код?

Ответить
0
Развернуть ветку
Артём Денница

нет конечно, так не может быть. Есть adobe muse, типо верстает, так там классы .class182398123_!231231 такие... но никак не такие логичные как ту... это фейк

Ответить
1
Развернуть ветку
Yuriy Orlov

Основная проблема любой модели - это количество и качество разделённые данных. Вот если бы было пару миллионов размеченных по определённом шаблону страниц, то тогда верстальщик стало бы грустно. Пока такого датасета не существует - все будет хорошо только в "лабораторных" условиях.

Ответить
6
Развернуть ветку
Saveliy Dzvonkevych

Посмотрел код. Да, адаптивности нет, стили прикручиваются к айдишниками и очень суровый каскад "#container #homepage #latest article figure h2".

Но тем не менее, как для нейросети это колосальный успех, и я уверен, очень скоро мы по прощаемся с верстальщиками.

Ответить
3
Развернуть ветку
Serge Arsentiev

Скорее верстальщики поприветствуют новый удобный инструмент :)

Ответить
10
Развернуть ветку
Флейм

Задача обычно в том, чтобы сделать хороший UX, а не хороший дизайн. Для этого надо пробовать разные идеи уже на месте, доводя точность мелких деталей до идеала, чего робот не даст. И мышление дизайнеров обычно сильно далеко от нужд бизнеса и людей впринципе. Кроме того, UI должен быть поделён на логические вебкомпоненты внутри фреймворка, чтобы с ним можно было работать кодеру, и впоследствии долгосрочно дорабатывать проект. Но для какого-то быстрого прототипирования мб и хорошо, и дизайнеры смогут пощупать не в фотошопе свои творения, поняв реальные проблемы своих фантазий, и мб даже презы устраивать. Это будет развивать индустрию.

Ответить
5
Развернуть ветку
Serge Arsentiev

Задача - как это показывает например обновленный Vc.Ru -
1. Сделать
И потом разбираться с возможными проблемами. Потому что "хороший УХ" или хороший дизайн - это просто долго, дальше кодеры начинают "упрощать" - потому что у них так не верстается, дизайнер бесится переделывать, потому что реально некрасиво (не по канону), и начинается поиск точек соприкосновения - а фактически одна переделка за другой, а там уже и сроки, к которым надо было новый/переделанный сайт вывесить и чтобы он начал работать - остаются в глубоком прошлом :(

Ответить
2
Развернуть ветку
Евгений Сатонин

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

Ответить
4
Развернуть ветку
Serge Arsentiev

робот может делать эту же работу в 5 раз быстрее и дешевле...
Видимо, Вы имели в виду производственную линию, все же. Перенастройка которой, в случае чего, стоит больших времени и денег, и во многих случаях в принципе невозможна - т.е. превращается в выброшенные деньги, которые ну просто никак не вернуть.
Единственный вариант, когда это получилось - - в публикации VC о молочном короле Александрове - который, цитирую:
https://vc.ru/16490-by-aleksandrov
"В Прибалтике в это время стояло шесть линий глазированных сырков. В Белоруссии — девять. Возникли какие-то проблемы, из-за которых и Прибалтика, и Белоруссия перестали ввозить сырки в Россию. В рынке образовалась громадная яма — пятнадцать линий. А каждая линия выпускает где-то по 80 тысяч сырков в день. То есть образовалась яма в миллион сырков каждый день, и мы эту яму быстренько наполнили. Скупили все линии Прибалтики и заказали у них еще линии."

Ответить
1
Развернуть ветку
Евгений Сатонин

Нет, не производственную линию. Это как пример. Я в целом о тенденциях. Это всего лишь первые пробы. Уже сейчас верстальшики автоматизировали огромный паст своей работы, которую еще 3-5 лет назад делали руками. (Точнее для них это сделали программисты, слушая потребности верстальщиков). Лет через 10, теже программисты упростят работу дизайнерам. Верстка уйдет как класс, как этап разработки. Тот же muse от adobe, уже сильно облегчил работу мне, как дизайнеру. 70-80% типовых страниц я могу запустить в продакшн без участия верстальшика. Пускай там код говно, но для теста этого хватает выше крыши. Представьте, настанет время, когда нейронная сеть научится анализировать информацию из интернета сама. Скармливаешь ей например дизайн страницы, указываешь цели для этой задачи , а она ищет сайты, где подобный дизайн уже реализован, подключается к базам гугл аналитикс, анализирует поведенчиский фактор для этих страниц, находит наилучшие варианты для заданной вами цели, и "собирает" вам идиальную с технической точки зрения страницу, отвечающую вашим целям и максимальго подходящим дизайном. Вам останется только... ничего.

Ответить
1
Развернуть ветку
Serge Arsentiev

Это все волшебно, но Вы про заводы и рабочих ведь говорили. Прошу продолжить на эту тему - например про автопром - и учесть что стоимость той самой "замены" рабочих на роботизированную линию - предусматривает серьезную производственную программу, ну скажем хотя бы 500 000 автомобилей за несколько лет. Далее, для такой линии требуется поступление либо производство полного цикла, либо гарантия поступления всех компонентов с минимальными допусками (погрешностями в размерах), краски/лаки строго определенного качества, и так далее. Хотите поменять какую-то деталь в сборке? Перенастраивайте робота :) Пришла партия, допустим, дверей, с небольшим отклонением? Робот ее не возьмет :)
 
Разница между заводом с роботизированными линиями, и заводом с полуручной сборкой - миллиард (и больше) долларов.
 
Т.е. это вопрос не принципиальный или модернисткий, а чисто экономический - надо делать 20-30 000 авто в год - делаем полуручную сборку, есть четкое понимание что завод будет 5 лет гнать одну модель на "жадные" рынки, ставим роботизированную линию - она 100% окупится.

Что там и как будет подспорьем в нажатии на кнопочки и возюканьем мышкой - это другой разговор.

Ответить
1
Развернуть ветку
Никита Бобровский

Видимо, Вы не слышали о гибких производственных системах
https://youtu.be/2qc0-yTXBts

Ответить
1
Развернуть ветку
Serge Arsentiev

а) нет, не слышал
б) данная система собирает ролики (их?) 3-х разных модификаций - для удобства они обозначены разными цветами движущейся части.
в) чтобы перенастроить эту линию, например, на сборку 5-ти прямоугольных деталей в одну (скажем, из Лего), придется все равно ее перестраивать полностью ... тогда как, добавление или удаление ролика из номенклатуры - да, наверное сделать проше.
То есть, не убедили :)

Ответить
0
Развернуть ветку
Уоррен Баффет

Ну, пока ферма индусов верстает на порядки лучше.

Ответить
3
Развернуть ветку
Сергей Кондратьев

Больше на фейк похоже, код почти 1в1 совпадает, кроме пробелов.

Ответить
3
Развернуть ветку

Комментарий удален

Развернуть ветку
Виталя Шнайдерсон

И альты

Ответить
5
Развернуть ветку
Надежда Рябоштанова

ссылка read more в теге footer не в футере, например, а в подвале еще один <footer>

Ответить
2
Развернуть ветку
Dmitry Rodionov

Посмотрите оригинальный код и код сделанный "нейронной сетью"... Они идентичные, дальше думайте сами... Статья лжива, как оказывается.

Ответить
2
Развернуть ветку
Юрий Ключевский

"ноутбук для запуска в Jupyter лежит тут"

WTF? Что за формулировка?

Ответить
1
Развернуть ветку
Serge Arsentiev

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

Ответить
1
Развернуть ветку
Юрий Ключевский

Фраза из оригинала:

"All the code is prepared on Github and FloydHub in Jupyter notebooks. All the FloydHub notebooks are inside the floydhub directory and the local equivalents are under local."

В общем действительно ноутбуки. Только имеют ввиду они под этим - виртуальные машины.

Они предоставляют свои вычислительные мощности для работы нейросети. И на GitHub лежит код. А "ноутбуки" на сервисе FloydHub.

Ответить
0
Развернуть ветку
Serge Arsentiev

Честно, в первый раз слышу, чтобы виртуалки называли именно ноутбуками. Обычно же вроде VM, да? Благодарю за пояснения.

Ответить
0
Развернуть ветку
Egor Gorobetz

```The Jupyter Notebook is an open-source web application that allows you to create and share documents that contain live code, equations, visualizations and narrative text. Uses include: data cleaning and transformation, numerical simulation, statistical modeling, data visualization, machine learning, and much more.``` http://jupyter.org/
В пайтоне используется, чтобы красиво показывать код другим людям, с визуализацией и пошаговой работой.

Ответить
1
Развернуть ветку

Комментарий удален

Развернуть ветку
Serge Arsentiev

Со прошедшим Старым Новым Годом, как классно Вы в 00:00 разместились :)
В моем детстве HTML не было, а юность началась с ... Hot Dog web editor :)
Ну и конечно Teleport Pro, WsFTP => CuteFTP, Reget :)

Ответить
1
Развернуть ветку
Никита Квитко

Храни господь верстальщиков

Ответить
1
Развернуть ветку
Максим Мостовой

Отдельной должности "верстальщик" не встречал уже не помню сколько лет

Ответить
1
Развернуть ветку
Sasha Tanya

круто

Ответить
1
Развернуть ветку
Dmitry Yaremenko

Пока такой же громкий хайповый заголовок как и в случае с pix2code. Распознаются уже известные сети элементы и из них составляется лейаут. Еслиесть набор готовых компонент то это расставить их по простому лейауту можно с минимальными знаниями хтмл кода (а примеров со сложным лейаутом я там не увидел).

Ответить
1
Развернуть ветку
Pavel Redych

еще один thegrid

Ответить
1
Развернуть ветку
Андрей Сазонов

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

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

Говорят сториборды для иОС тоже делать сетки обучают. Мне видится что эта задача попроще, чем HTML.

Ответить
1
Развернуть ветку
Anton Boyko

Такое чувство, что работа верстальщика заключается только в единоразовой верстке страницы по макету. А дальнейшую поддержку проекта тоже нейросеть будет делать? Да она уволится после второго цикла, когда наломает все, что было создано изначально и уже было натянуто на какой-то движок.

Ответить
1
Развернуть ветку
Андрей Нефедов

Этот проект делает сайты лучше:
https://site-bot.ru

Ответить
–17
Развернуть ветку
Anton Zhitarev

что это за поебень?

Ответить
3
Развернуть ветку
Андрей Нефедов

бот делает адаптивные одностраничные сайты бесплатно.

Ответить
0
Развернуть ветку
Слон Петрович

Мда

Ответить
0
Развернуть ветку
Alexey Ermolaev

как это развидеть?

Ответить
0
Развернуть ветку
Андрей Нефедов

по примерам которые сделала нейронка

Ответить
0
Развернуть ветку
Anton Boyko

@делаем адаптивные сайты
@у самих сайт со смартфона не работает

Ответить
0
Развернуть ветку
Андрей Нефедов

это бот. там 3d графика и речь. специфика такая.
а сайты адаптивные, да.
и сайт работает со смартфона. просто пишет что нужно зайти с ПК. так что всё адаптивно.

Ответить