С чего все началось
Этот проект начинался как обычная разработка сайта-каталога автомобилей из Азии, но довольно быстро стал гораздо интереснее. Мне пришлось собирать информацию буквально по крупицам из Telegram, придумывать оформление карточек, дорабатывать стандартные блоки Tilda с помощью кода и постепенно автоматизировать наполнение.
Ко мне обратились клиенты, которые занимаются поставками автомобилей из Китая, Японии, Южной Кореи и Таиланда в Россию.
На тот момент они активно развивали Telegram-канал. Там регулярно появлялись фотографии машин, короткие обзоры, видео с отгрузок, технические характеристики и информация о доставке.
Telegram хорошо подходит для публикации новостей и общения с аудиторией. Но когда предложений становится много, ориентироваться в них уже не так удобно.
Потенциальному покупателю приходится пролистывать историю сообщений, искать нужную модель, сопоставлять фотографии и характеристики.
Поэтому клиенты решили создать собственный сайт с полноценным каталогом автомобилей.
На нем посетитель должен был иметь возможность выбрать марку, изучить предложения, посмотреть характеристики и отправить заявку. В дальнейшем сайт планировалось использовать для контекстной рекламы и поискового продвижения.
Для разработки выбрали Tilda. Это позволяло достаточно быстро запустить проект без больших затрат и сохранить возможность самостоятельного управления содержимым.
Структуру я взяла из предыдущих автомобильных проектов
До этого я уже разрабатывала сеть сайтов по продаже грузовой техники. За время работы над ними сформировалась удачная структура каталога, которую можно было использовать и для других автомобильных направлений.
Я решила взять ее за основу.
Получилась многостраничная архитектура с главной страницей, разделами каталога, фильтрацией по брендам и полноценными внутренними страницами автомобилей.
Мне нравится, когда структура сайта продумана с учетом дальнейшего развития.
Сегодня в каталоге одно количество предложений, завтра — другое. Появляются новые марки, модели, направления поставок. При грамотной архитектуре все это можно добавлять постепенно, не перестраивая сайт каждый раз заново.
Кроме того, отдельные страницы автомобилей позволяют развивать поисковое продвижение по маркам и моделям, а также использовать их в рекламных кампаниях.
Telegram оказался отдельным приключением
Когда дело дошло до наполнения каталога, выяснилось, что исходные материалы совсем не похожи на привычную таблицу товаров с названиями, характеристиками и фотографиями.
Все находилось в Telegram.
Причем информация об одном автомобиле могла быть разбросана по нескольким сообщениям, опубликованным с интервалом в дни или даже недели.
Например, сначала появлялся короткий пост с характеристиками машины. Через несколько дней — фотографии. Потом видео. А еще спустя какое-то время — снимки автомобиля с места отгрузки.
Между этими публикациями могли находиться десятки сообщений о других автомобилях.
В итоге мне приходилось внимательно просматривать историю канала, искать связанные сообщения, сопоставлять фотографии и видео, разбираться, какие материалы относятся к конкретной машине.
Иногда для подготовки одной карточки нужно было просмотреть публикации за несколько недель.
Это оказалась одна из самых трудоемких частей проекта.
Почему пришлось дополнительно работать с контентом
У большинства Telegram-постов была еще одна особенность — очень краткое содержание.
Несколько характеристик, пара предложений и фотографии.
Для Telegram этого вполне достаточно. Но на сайте хотелось дать посетителю больше информации.
Поэтому я решила дополнить карточки самостоятельно.
Готовила более подробные описания автомобилей, добавляла технические сведения, рассказывала об особенностях моделей, включала интересные факты и немного истории.
Так вместо коротких публикаций появлялись полноценные страницы, на которых можно подробнее познакомиться с автомобилем.
Для меня это важный момент: даже самый красивый каталог теряет смысл, если посетитель практически ничего не может узнать о товаре.
Сначала все вручную, потом — автоматизация
На первом этапе наполнение выглядело примерно так: сохранить материалы из Telegram, разобраться, к какому автомобилю они относятся, подобрать фотографии, подготовить описание, разместить все на сайте и проверить результат.
Затем повторить весь процесс для следующей машины.
Довольно быстро стало понятно, что часть этой работы можно автоматизировать.
Постепенно я начала внедрять решения для выгрузки материалов из Telegram и их последующего переноса на сайт.
Со временем автоматизация стала охватывать все больше операций.
Но полностью от ручной работы я не отказалась.
Во-первых, исходные материалы не всегда достаточно структурированы. Во-вторых, даже после автоматической обработки контент часто требует уточнений и корректировок.
И есть еще один момент: я довольно требовательно отношусь к качеству готовых страниц.
Если изображение выглядит неудачно, описание требует доработки или какой-то элемент интерфейса меня не устраивает, я предпочитаю исправить его вручную.
Поэтому автоматизация в этом проекте помогает мне избавляться от повторяющихся операций, а окончательная проверка и доведение результата до нужного уровня остаются за мной.
Моя любимая часть проекта — оформление автомобилей
Для сайта потребовалось довольно много графики.
Я создавала изображения для первого экрана главной страницы, баннеров и внутренних разделов.
Но особенно мне понравилась идея, которую я реализовала на страницах отдельных автомобилей.
Обычно первый экран карточки машины выглядит достаточно стандартно: название модели, фотографии, характеристики и кнопка заявки.
Мне захотелось сделать его более выразительным.
Так появилась идея использовать в качестве фона крупное изображение автомобиля в вечернем освещении.
Для каждой модели я отдельно генерировала такую картинку.
Вечерний свет красиво подчеркивает силуэт машины, линии кузова, фары и другие детали. А поверх фотографии хорошо смотрится крупный заголовок с названием модели.
В результате у каждой страницы появилась собственная атмосфера.
При этом все карточки оформлены по единому принципу: одинаковая композиция первого экрана, расположение заголовков и общая стилистика изображений.
Мне нравится, что такой подход позволяет сделать даже большой каталог визуально интересным, сохранив целостность дизайна.
Как я дорабатывала стандартные блоки Tilda
Разработка сайта не ограничивалась настройкой стандартных блоков.
С самого начала я активно использовала CSS и JavaScript для изменения внешнего вида и поведения элементов каталога.
Дорабатывала товарные карточки, оформление превью автомобилей, фильтрацию по брендам и отдельные элементы интерфейса.
Мне было важно получить именно тот внешний вид, который я задумала, но при этом сохранить удобство управления сайтом.
Это одна из причин, по которым мне интересно работать с Tilda.
Готовые блоки позволяют быстро собрать основу проекта. А собственные стили и скрипты дают возможность изменять интерфейс, расширять стандартный функционал и создавать индивидуальные решения.
В результате можно реализовать довольно сложный сайт, не отказываясь от преимуществ конструктора.
В проекте «Из Кореи» сочетание стандартных возможностей Tilda, собственного кода и автоматизации позволило добиться именно такого результата.
Заявки должны доходить до клиентов быстро и надежно
Еще одна часть разработки — организация приема обращений.
Я предусмотрела несколько точек входа: формы расположены на главной странице, в превью автомобилей и непосредственно в карточках.
Посетитель может отправить заявку сразу после того, как заинтересовался конкретной машиной.
Для передачи обращений я использую проверенную схему с четырьмя каналами.
Заявки сохраняются во встроенной CRM Tilda и дополнительно поступают в Google Таблицы.
Уведомления приходят на электронную почту и через Telegram-бота.
Мне нравится эта схема своей практичностью.
Клиенты могут оперативно узнать о новом обращении в привычном мессенджере, а если потребуется найти старую заявку — открыть CRM или таблицу.
При этом информация хранится в двух независимых системах, что обеспечивает дополнительную сохранность истории обращений.
Что получилось
В результате появился многостраничный сайт «Из Кореи» с каталогом автомобилей из Азии, фильтрацией по брендам, полноценными карточками моделей и системой получения заявок.
Но лично мне этот проект интересен еще и тем, как он развивался.
Сначала была проверенная структура каталога. Затем — кропотливая работа с Telegram-публикациями. Потом появились индивидуальные изображения, модификации стандартных блоков и постепенно — автоматизация наполнения.
Каждый новый этап добавлял сайту функциональность и делал работу с ним удобнее.
В этом проекте мне удалось объединить несколько направлений, которые особенно интересны в разработке: архитектуру многостраничного сайта, программирование, дизайн, создание контента и автоматизацию.
Именно за такие возможности я люблю Tilda. Когда хорошо знаешь платформу и умеешь работать с собственным кодом, можно реализовывать сложные проекты с индивидуальным интерфейсом и продуманной структурой.
А еще мне нравится, когда разработка не заканчивается публикацией сайта. В проекте остается пространство для улучшений, новых функций и дальнейшего развития.
Посмотреть сайт «Из Кореи»: izkorei.alliance-car.ru.
Каталог на Tilda под задачи вашего проекта
Если вам нужен сайт-каталог со своей структурой, доработанными блоками и автоматизацией наполнения, я могу разработать его на Tilda и сопровождать по мере развития проекта.