Искусственный интеллект заменяет разработку без кода, и я снова влюбился в веб-дизайн

Помню, как в старшей школе я впервые освоил стандартный набор инструментов для веб-дизайна — HTML, CSS, JavaScript. После года программирования меня познакомили с новым инструментом для веб-дизайна под названием Webflow. Это был последний день, когда я писал код вручную или даже просто смотрел исходный код веб-сайта.

Знания в области программирования помогли мне освоить эти инструменты без кода и даже придали мне необходимую уверенность, чтобы спорить с разработчиками, когда я занялся UX-дизайном. От Webflow до Framer и миллиона различных решений Figma для преобразования кода — я был очарован.

Однако у этих инструментов, не требующих написания кода, были некоторые существенные недостатки.

• Инструменты без программирования были ограничены имеющимися функциями, существовали и варианты с минимальным использованием кода, позволяющие вручную добавлять функциональность. Часто приходилось изучать их собственные фреймворки и адаптироваться к определенному синтаксису при работе с ними.
• Они всегда были дорогими. Конечно, базовые стартовые планы были очень дешевыми, но вы едва получали все необходимое для запуска сайта. Более дорогие бизнес-планы, дополнительные сборы за такие дополнения, как хранилище, и запутанная структура ценообразования всегда раздражали.
• Каждый инструмент обладал своим набором функций и пользовательским интерфейсом. Некоторые были созданы для людей, не умеющих программировать, а остальные были перегружены профессиональной терминологией и предназначались для опытных программистов.
• Одно-единственное обновление может сделать весь инструмент неэффективным, и разработчикам и дизайнерам придётся мириться с этими изменениями (часто вносимыми некомпетентными в технологиях сотрудниками корпорации).

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

Протестировав все существующие инструменты и модальные окна с ИИ, я обнаружил кое-что интересное. Теперь вы не ограничены инструментом, а лишь тем, насколько хорошо знакомы с навыками, которыми обладают модальные окна с ИИ. Одно модальное окно отлично подходит для написания UX-текстов и генерации контента на основе подсказок, а другое — для UI-дизайна и создания веб-ресурсов на основе описания.

Веб-конструктор на основе искусственного интеллекта aura.build помогает пользователям выбирать подходящее модальное окно в зависимости от их предпочтений:

Клод недавно начал уделять больше внимания дизайну в сотрудничестве с Figma, V0 от Vercel и другими инструментами для дизайна. У них даже есть собственное руководство по веб-дизайну, которое можно найти здесь . Некоторые из этих модальных окон, такие как Claude Sonnet и Opus, позволяют с легкостью создавать красивые, хорошо структурированные и анимированные веб-сайты.

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

Инструменты искусственного интеллекта и интегрированные среды разработки, такие как Cursor и Lovable, действительно сделали эти функции обычным явлением в этой отрасли, а Figma Make и другие последовали их примеру.

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

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

Одним из главных факторов успеха этих инструментов стала возможность воплотить в жизнь любую «дизайнерскую идею». Суть проста: если вам нравится какой-либо веб-сайт, вы можете его воспроизвести, не имея никаких знаний в программировании.

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

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

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

На днях мне понадобилось создать собственную HTML-подпись для своих электронных писем. Что-то вроде этого:

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

Благодаря функции Cursor, которая отлично работает даже для начинающих, я также без труда смог создать плагин для Figma.

В последнее время, с появлением таких инструментов автоматизации, как Claw Bot , вы можете создавать собственные системы автоматизации на основе ИИ с кроссплатформенной интеграцией — и всё это на вашем компьютере. Это означает, что ИИ может использовать ваш компьютер в качестве сервера, подключаться к вашему календарю, электронной почте, мессенджерам и т. д., автоматизировать задачи с помощью интеллектуальных ответов и простого интерфейса чата. На мой взгляд, создание собственных ботов на основе ИИ — это следующий большой шаг в развитии технологий искусственного интеллекта.

Вы читали перевод статьи: AI is Replacing No-Code & I’m in Love With Web Design Again.