В современном мире технологии развиваются с невероятной скоростью, и нейросети стали неотъемлемой частью многих индустрий. В этой статье я расскажу о личном опыте, как можно применить нейросети для создания сайта на платформе Тильда. Tilda – это интуитивно понятный конструктор сайтов, позволяющий пользователям без специальных навыков в веб-разработке создавать качественные и красивые веб-страницы. Использование нейросетей в сочетании с Tilda позволяет автоматизировать процесс создания сайта и сделать его более умным и оптимальным. В этой статье мы погрузимся в мир нейросетей и узнаем, как сделать сайт с помощью нейросети и покажу промтпы midjourney для дизайна сайта.
На сайте futuretools.ru вы можете найти ИИ инструменты для создания сайтов. Выглядит это футуристично, по одной подсказке вы получается и интерфейс и тексты, сгенерированные нейросетями. Но с этим решением есть две проблемы. Первая, локальная, невозможно оплатить тарифы картами банков РФ. Вторая – CMS, которая должна быть, продуманной и удобной для любого начинающего предпринимателя. Tilda отвечает двум этим требованиям, но сама по себе контент не генерирует, возможно, пока.
Для разработки сайта нам нужен контент, то есть тексты, картинки, иконки. В этой работе клиент предоставил только логотип, название, список услуг, адрес и контакты. То есть не было фотографий, на которые можно ориентироваться для дизайна будущего сайта, не было и тестов, чтобы сделать структуру лендинга.
Рассмотрим все этапы разработки сайта нейросетями. Основные шаги создания сайта будут стандартными для Тильды или любой другой платформы, нейросетями мы создаем отдельные недостающие элементы. Наш стек для этой задачи: ChatGPT и Midjourney.
Подготовка
Для начала нужно предоставить ChatGPT информацию о компании и предоставить ему задачу. В моем случае звучала она так: Я хочу, чтобы вы выступили в роли веб-разработчика, на основе текста о компании написали название и описание для раздела со списком услуг.
Прикидываем структуру лендинга.
Основываясь на своих знаниях и анализе ChatGPT выдает достаточно подробную структуру, которую мы можем использовать полностью или частично.
Изучив конкурентов и основываясь на пожеланиях заказчика составляем прототип по подготовленной структуре.
Ищем концепцию дизайна
Midjourney не создаст готовые для продакшена лендинг, но отлично справляется с креативными решениями. Нам предлагают темный сайт с желтым акцентным цветом и интересными элементами декорирования. В данном случае мы выбрали более простой путь, но с помощью Photoshop можно вырезать элементы и сверстать как было задумано.
Подбираем фото для первого экрана
Как я уже упоминал, Midjourney может в креатив. И банальным выбором фотографии было бы машина после аварии. Но нейросеть предлагает один из вариантов с рассыпающимися пикселями от машины, что показывает как и восстановление, так и повреждение, в впечатляющей аналогии. Трудно представить, сколько времени могло бы потребоваться для поиска такой идеи, и для ее воплощения в графическом редакторе.
Останавливаемся на 4 варианте и апскейлим картинку. ИИ для увеличения картинки – Upscale.media.
Фото для списка услуг
Процесс, который больше всего меня впечатлил. У нас получилось 8 фотореалистичных картинок, все в единой палитре, и это без специального подбора моделей, одежды, и автомобилей. Конечно, такая задача может быть решена с помощью стоков, но нейросеть может предложить более креативное решение, сохранит цветовую палитру в любых элементах и стоит дешевле стоков.
Рисуем иконки нейросетью
Чтобы не было проблем с авторскими правами даже на незначительные элементы сайта, пробуем нарисовать и иконки с помощью нейросети. Здесь я совмещаю ChatGPT и Midjourney. Во-первых, прошу написать текст «о нас» и выделать 3 ключевые особенности.
На основе предложенных пунктов прошу визуализировать для них иконки
Во-вторых, переношу описание иконки в Midjourney и получаю подходящий вариант, который могу перевести в вектор с помощью плагина в Figma.
Пишем отзывы довольных клиентов
Проблема начинающего бизнеса в небольшом количестве отзывов от клиентов. Но даже тут ChatGPT отлично справляется с задачей, пишет не слишком хвалебные отзывы, придумываем имена и визуализирует «клиентов», которых отлично «фотографирует» Midjourney
Контент для сайта в GPT и Midjourney
Пишем недостающие тексты и рисуем декоративные элементы. По тому же принципу заполняем недостающий контент текстом и визуалом
В целом, процесс сборки сайта в данном случае ничем не отличается от скролинга стоков для заполнения недостающего контента. Но, как мне кажется, это занимает значительно меньше времени, выглядит единообразно и креативно. Даже для 404 страницы ChatGPT придумал интересный заголовок, учитывающий тематику сайта.
Готовый сайт вы можете посмотреть по этой ссылке: brothersgarage.tilda.ws
А другие мои работы размещены в портфолио: experts.tilda.cc/vladkas
Возможно, это не то, что вы искали, изучая сервисы, которые делают ИИ дизайн в два клика. Но это реальный опыт создания сайта с помощью нейросетей. Ключевое, с помощью, и это отличные помощники, которые определенно стоят своих денег.
Еще не регистрировали аккаунт в Tilda? Получите бесплатный месяц этой ссылке!
