Бизнес в интернете полон рутины: раньше у предпринимателей уходили часы на создание сайтов и лендингов. Но развитие нейросетей позволяет автоматизировать эти процессы — теперь сделать сайт можно за 15 минут
Некоторые ИИ-сервисы созданы в помощь веб-мастерам, — используя их, сконструировать простой сайт или лендинг не составляет проблем.
Рассмотрим в обзоре несколько популярных нейросетей, которые используют сайтостроители и арбитражники.
Framer Ai
Framer Ai запустили в 2015 году как сервис онлайн-прототипирования, а в 2022 он стал полноценным конструктором. После инвестирования 25$ млн в 2023 году сервис начал активно развиваться, сделав ставку на развитие искусственного интеллекта.
Сегодня Framer Ai совмещает в себе различные функции, реализованные на похожих популярных платформах — Figma, Tilda, Webflow и Axure. Есть и несколько исключительных особенностей, которые выделяют конструктор на фоне других. Это специально разработанная библиотека эффектных анимаций и шрифтов, встроенный перевод на 500 языков и возможность превращения готового сайта в собственную CMS — удобную систему управления контентом.
Как работать с Framer Ai
Зарегистрироваться в сервисе можно через почту или Google-авторизацию. Интерфейс десктопной версии достаточно прост и интуитивно понятен — никаких лишних меню и кнопок.
Для начала работы кликаем по меню «Pages» и выбираем один из вариантов конструируемой страницы — например, блога, лендинга, сайдбара или портфолио.
В Framer встроено большое количество нативных страниц, блоков и форм, которые работают по аналогии с Tilda. Новые элементы добавляются при нажатии на иконку «плюсика» — вариативность создания страницы под любой формат сайта здесь огромная.
В левой части экрана располагается панель с дополнительно настраиваемыми элементами на каждую страницу.
CMS также можно создать через меню «Pages». Как и в конструкторе Webflow, все типы динамического контента здесь обозначаются коллекциями. Так, можно создать коллекцию страниц новостей, карточек спикеров на лендинге или карточек товара для интернет-магазина. На базовом, бесплатном тарифе добавляется только одна определенная коллекция.
Параметры той или иной конструируемой страницы всплывают в левом меню экрана:
Чтобы сгенерировать страницу с помощью ИИ, кликаем по иконке меню «Actions», после чего выбираем команду «Generate Page»:
В появившемся окне промптов вводим описание будущей страницы. Составить промпт легко: даем для страницы простое описание и добавляем короткое описание того, что хочется увидеть на сайте. Дополнить промпт всегда можно с помощью Chat GPT.
После введения в форму «Framer» готового промпта нажимаем на «Start» и получаем сгенерированную в несколько секунд страницу — теперь ее можно корректировать по собственному вкусу: например, добавить или убрать элемент или блок, изменить цвет. 
Преимущество сервиса Framer — возможность загрузить созданный ранее в другом конструкторе — например, в той же Figma — шаблон и «допилить» его с помощью ИИ-промпта. Через меню «Insert» добавляются разные креативы, формы и медиа. Сервис поддерживает добавление как собственных фото, гифок и видео, так и контента с популярных западных платформ, стримингов: YouTube, Vimeo, Spotify, Apple Podcasts, Apple Music, SoundCloud, Lottie.
Через форму Mailchimp будущий сайт можно связывать с собственным аккаунтом рассылки популярного сервиса — так вы автоматизируете сбор контактов будущих посетителей и лидов.
Еще одна фича сервиса Framer — использование анимации, которая приводит в движение слои на дизайн-макете. При этом можно работать с разными свойствами слоев, играя фоновыми цветами, высотой, шириной, радиусом рамки и прочими параметрами.
Для работы с анимацией желательно иметь базовое представление о CSS и HTML. В разделе «Framer Motion» представлена документация, есть многофункциональная библиотека production-ready анимаций Framer Motion, коллекция динамических элементов. Преимущество Framer Motion в том, что он работает с событиями React и поддерживает различные жесты — наведение, касание, перетаскивание и другие.
Framer позволяет работать и с кодом, с помощью которого можно добавить в дизайн сайта эффекты анимации и нестандартные компоненты. Для работы с кодом необязательно быть программистом или фронтендом. Сервис по максимуму упростил процесс добавления фрагментов, их в готовом виде можно взять на странице библиотеки Framer Motion.
Для работы с кодом переходим в меню «Assets», кликаем по «Code», нажимаем на плюс и добавляем новый файл.
Преимущества Framer Ai
Среди достоинств сервиса отмечают:
- Гибкие настройки стилей и тем. Мастер-компоненты, собранные в отдельном разделе.
- Библиотека готовых страниц, блоков с инструментами визуализации разных разрешений экрана.
- Возможность вставки собственного кода в готовый сайт, а также частичная генерация кода на основе прототипа
- Подключение динамического контента в CMS-редакторе.
- Создание анимированных элементов на дизайн-макете.
- Инструменты автоматизации при связывании компонентов страницы.
- Интеллектуальный поиск необходимых элементов.
Прайс Framer Ai
Бесплатная версия с ограниченным функционалом: можно создать проект на домене сервиса с одной коллекцией и с выводимой плашкой Made in Framer
Планы Mini, Basic и Pro расширяют возможности, годовой тариф можно купить со скидкой:
Самые высокие ставки по RU, BY, KZ от прямого рекламодателя FONBET PARTNERS!
К заливам!
Gamma AI
Gamma AI — это сервис, с помощью которого можно создавать различные бизнес-страницы — например, презентации, веб-страницы идокументы.
Особенность платформы в том, что она сама анализирует загружаемые тексты и изображения, после чего автоматически генерирует слайды с контентом, который максимально точно соответствует теме презентации. При этом шаблоны презентаций по качеству не уступают тому, что предлагает Canva, а редактирование структуры идет быстрее.
Gamma работает с разными форматами — с веб-сайтами и графикой, с GIF-файлами, анимацией и видео. Каждый проект доступен для коллективного управления и комментирования, причем заметки можно использовать в автономном режиме.
Как работать с Gamma AI
После регистрации через почту или Google-аккаунт, выбираем опцию персонального пользования сервисом и кликаем по команде «Create Workspace». Также придется ответить на два простеньких вопроса на английском о том, в какой сфере планируется использование сервиса.
На дашборде Gamma сразу предлагает выбрать один из трех вариантов создания AI-креатива:
— Paste in text
Сервис предлагает создать страницу на основе заметок, набросок или скопированного контента.
— Generate
Мгновенное создание страницы через ИИ-промпт.
— Import a file
С помощью этой опции можно импортировать документ или файл презентации.
Преимущество Gamma в том, что платформа понимает русский язык. Чтобы его выбрать в выпадающем меню на следующем шаге создания промпта. Сразу же выбираем и количество экранов: в бесплатной версии можно использовать не более 8.
Сами промпты можно задавать в ультракоротком стиле — буквально в три-четыре слова.
После клика по команде «Generate outline» сервис предлагает свой вариант структуры сайта с названиями, которые можно тут же отредактировать или же удалить.
Ниже располагается меню настроек с выбором одного из вариантов текстового объема: brief, medium и detailed.
Для добавления графики можно добавить изображения из интернета или сгенерировать оригинальные креативы с помощью ИИ. Уточнить тип и стиль необходимого графического контента можно в специальном поле промпта «Image style».
На следующем шаге сервис предоставляет на выбор несколько десятков дизайнерского оформления с предлагаемыми фильтрами отбора той или иной темы — dark, light, professional и colorful.
При той или иной генерации с пользовательского счета списывается определенное количество кредитов — всего на счету у фри-аккаунта 400 кредитов.
На следующем шаге можно отредактировать весь контент одностраничника. В правой части экрана среди доступных инструментов появляются опции добавления шаблонов, блоков, встраивания приложений, веб-страниц, кнопок и форм, также можно добавить изображения и видео. Тут же редактируется весь текстовый контент и дизайнерский стиль всего сайта.
Отредактировать всю страницу или отдельные части можно и с помощью AI ассистент. Он умеет:
— Добавлять и менять изображения.
— Дополнять, сокращать и переписывать тексты.
— Создавать, редактировать списки, таблицы и таймлайны.
— Изменять структуру слайда в презентациях.
Когда виртуальная страница будет готова, Gamma предложит ее опубликовать готовую страницу на своем домене с именем gamma.site в адресе. Для кастомизации домена придется перейти на один из платных тарифов сервиса.
С помощью кнопки «Share» можно «расшэрить» готовый проект для дальнейшей коллективной работы и комментирования полученного результата коллегами:
При клике на три точки в верхней правой части экрана откроется меню, с помощью которого можно посмотреть историю создания страницы, вернуться на любой шаг назад или скачать проект в виде документа PDF или Power Point.
Преимущества Gamma AI
Сервис представляет собой универсальный инструмент по созданию и редактированию самого разного контента.
Среди плюсов:
- Разнообразие форматов и встраиваемых форм для создания и редактирования веб-ресурса.
- Быстрота создания веб-ресурса с помощью встроенных инструментов ИИ: создать и отредактировать сайт под собственные нужды можно буквально за полчаса.
- Условная бесплатность — даже на фри-тарифе можно сконструировать яркий и функциональный рабочий сайт.
- Простота и доступность интерфейса: все кнопки и меню для редактирования на дашборде всегда под рукой, а иконки со всплывающими англоязычными подсказками интуитивно понятны.
- Возможность коллективного редактирования и комментирования даже в автономном режиме.
Тарифы Gamma AI
На бесплатном тарифе дается 400 кредитов и 8 генерируемых блоков с возможностью редактирования получившейся страницы в течение месяца. Полученный сайт маркируется обязательным логотипом сервиса.
Помимо бесплатного варианта использования есть тарифы Plus и Pro с ежемесячной оплатой в 10$ и 20$ соответственно. При оформлении ежегодного тарифа действует скидка в 20% и 25%.
На платных тарифах Gamma AI снимаются ограничения в кредитах, увеличивается количество блоков на каждый проект, открывается функционал статистики и исчезают временные рамки на редактирование сайта
Dora AI
Dora AI — это платформа, которая помогает с помощью ИИ создавать самые разные веб-страницы с уникальным дизайном: лендинги, интернет-магазины, блоги, визитки, портфолио и т. п. Встроенная в сервис нейросеть также позволяет создавать 3D модели и анимацию для сайтов.
Dora AI запущена сравнительно недавно: весь функционал находится в бета-тестировании, но уже сейчас можно создавать хорошие, запоминающиеся сайты.
Как работать с Dora AI
Для регистрации в сервисе понадобится почта или Google-аккаунт. Перед входом на страницу редактора Dora AI «просит» ответить на несколько несложных вопросов на английском: какие ИИ-инструменты известны новому пользователю, для чего ему нужен сайт, откуда он узнал о платформе.
Перед стартом работы Dora AI предлагает познакомиться с основными инструментами, посмотрев ролик на английском языке. Этот этап можно пропустить — сервис доступен, прост в интерфейсе, так что изучить его самостоятельно труда не составит.
Представленные на дашборде основные инструменты платформы интуитивно понятны даже не владеющему английским человеку. Начать работу можно либо сразу с помощью ИИ, либо через импорт документа или проекта из Figma.
Запрос промпта можно составить на русском — сервис мультиязычен. При этом достаточно краткого описания, например, «лендинг для продажи юридических услуг». Еще Dora AI сразу предлагает ввести промпт для определения дизайн-стиля будущей страницы. Максимальный объем под каждый промпт — не более 300 символов.
На генерацию четырех предварительных вариантов уходит 15 секунд и расходуется 20 кредитов из положенных 120 на бесплатном тарифе, для окончательного формирования страницы понадобится еще 20 кредитов. ИИ не просто «придумывает» структуру, но и предлагает предварительный текстовый контент, который можно отредактировать. Также можно выбрать один из предлагаемых шаблонов страницы в разделе «Templates», что сэкономит кредиты.
После формирования предварительной структуры сайта открывается визуальный редактор. В левой части экрана располагается панель слоев Layers, в правой части — прочие настройки, в том числе возможности скроллинга, seo-опции — тайтл и дескрипшн.
Все элементы в каждом блоке сгенерированной страницы редактируются по клику — вручную или через смену параметров во всплывающей с правой стороны панели.
В верхней панели иконки меню с добавлением отдельных элементов: текста, контактных форм, изображений, 3D-моделей. Все элементы можно сформировать под любой формат отображения на различных девайсах — десктопе, макбуке или браузере на телефоне под Android и Apple.
После редактирования готовую веб-страницу можно опубликовать на хостинге сервиса. Для размещения на собственном домене придется оформить платный тариф.
Преимущества Dora AI
У сервиса есть несколько положительных особенностей:
- Скорость создания страницы: процесс генерации по запросу занимает не более 15 секунд.
- 3D-визуализация как отдельных элементов на странице, так и статичных проектов в целом.
- Настройка ярких визуальных эффектов, включающих в себя плавные переходы от одного блока к другому, анимированный визуал и прочие «фичи».
- Простота в управлении: весь интерфейс прост и интуитивно понятен в каждой детали меню.
- Собственная реферальная программа — 200 бесплатных кредитов за 5 приведенных пользователей.
Прайс Dora AI
В бесплатной версии сервиса есть 120 кредитов на старте, которые можно потратить на создание трех разных проектов, но с ограничениями. Например, нельзя редактировать сгенерированный текст, встраивать собственные изображения или формы для сбора связи.
Помимо бесплатного тарифа есть несколько платных — Basic и Pro по цене в 8$ и 20$ долларов соответственно, при покупке годового тарифа дается скидка в 22%. На этих тарифах снимаются ограничения редактуры страниц, увеличивается количество ежемесячных кредитов и открываются прочие возможности.
Есть и еще один тариф — Custom, условия использования и стоимость которого определяется в ходе личной переписки с менеджерами сервиса.
Выводы
При всех своих преимуществах ИИ-конструкторы веб-страниц пока не могут заменить сайтостроение.
Тем не менее, ИИ-сервисы пригодны для создания несложных лендингов уже сейчас, даже на бесплатных. Коллекции шаблонов всегда можно скорректировать под индивидуальную задачу, а сгенерированная с помощью ИИ структура и контент позволяют запустить страницу в течение часа.
