Как мы без правок за 3 дня собрали сайт онлайн-школы, который понравился и подросткам, и Яндексу

1. Вводная задача от заказчика, проблематика, цели

Клиент пришёл без ТЗ по сайту, но с чёткими сроками на выполнение задачи

Академия «Земляне» – образовательный проект для подростков, который объединяет подготовку к ЕГЭ и ОГЭ, базовые курсы и интенсивы. Основатели – команда психологов, педагогов и менторов. Вместе они решили собрать пространство, где подросткам будет комфортно учиться и расти.

Главная идея проекта – учить по‑человечески: строить доверие, говорить на одном языке с подростками и поддерживать в эмоциях, которые сопровождают подготовку к экзаменам.

«Возникла задача адекватного отображения новых продуктов в онлайне. Решили, что отдельный сайт станет наиболее подходящим вариантом, т.к. в рамках организации все новые инициативы были выделены в отдельное направление – некий суббренд», – вспоминает руководитель отдела маркетинга заказчика Егор Чертов.

Заказчик ждал от нас современный сайт, который:

• покажет, что подготовка к экзаменам может быть лёгкой и понятной

• объединит направления: ЕГЭ, ОГЭ, базовые курсы и интенсивы

• сохранит фирменный стиль «Землян», но добавит динамики и визуального интереса

• останется удобным и логичным на всех устройствах.

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

Это могла бы быть стандартная для агентства задача: посадка, несколько блоков, немного текста – и вперёд. Но всё пошло по другому сценарию. У нас не было ни ТЗ, ни структуры, ни примеров.

«Изначально у клиента не было понимания по блокам, но он понимал, как он хочет, ориентируясь на какие-то сайты конкурентов. При этом у него была только документация – сплошные заготовки с УТП, кратко преимущества и более юридические файлы, что из себя представляет Академия», – вспоминает арт-директор Darvin Digital Наталья Головченко.

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

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

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

Техническая часть тоже требовала серьёзного подхода: нужно было предусмотреть регистрацию, модуль с программами, интеграции с CRM, форму обратной связи, блоки доверия (отзывы родителей, команда проекта и т.д.) и автоматическую обработку заявок.

Всё это в условиях сжатых сроков: запуск нужно было сделать в ближайшее время – и сделать хорошо.

2. Описание реализации кейса и творческого пути по поиску оптимального решения

Взялись за проработку сайта: на руках был только стартовый бриф и несколько голосовых от команды клиента

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

• сверху – чёткий ответ, кто такие «Земляне» и зачем они нужны

• ниже – направления обучения

• затем – визуальные сигналы, что здесь по-человечески, а не как по учебнику

• внизу – блок-доверие: наставники, сертификаты, отзывы, контакты.

Каждый блок имеет свой цветовой или визуальный акцент, что делает скролл динамичным и удерживает внимание.

Основные задачи главной в образовательных проектах:

– быстро объяснить, кто вы такие и чем полезны

– показать направления продукта

– подтолкнуть к действию: записаться на занятие, оставить заявку или узнать больше

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

Только после этого всего приступили к реализации проекта на конструкторе Bilda.

• Почему выбрали Bilda?

Клиент хотел запуск быстро, но без потери качества. Поэтому мы отказались от кастомной разработки (слишком долго) и от Tilda (из-за низкой производительности на многостраничных сайтах). Подробнее о возможностях Bilda мы уже писали здесь - https://clck.ru/3Qrjnn. Там в деталях рассказываем, чем платформа лучше WordPress, Tilda, Битрикс, кастомных CMS и Shopify.

• Минимализм с характером: как мы за 3 дня упаковали идею в форму
• У компании был базовый фирменный стиль в других проектах – мы сохранили основные цвета, но добавили яркие акценты и мягкие формы. Использовали асимметрию, скругления, графику и коллажи, которые визуально ближе к подростковой культуре, но не скатываются в инфантильность. Каждый блок имеет свой визуальный акцент – это удерживает внимание при скролле.
• Ключевые разделы сайта – «Подготовка к ЕГЭ/ОГЭ», «Базовый курс» и «Интенсив». Каждая внутренняя страница структурирована так, чтобы пользователь быстро понял, в чём суть программы и чем она отличается от других. Поэтому информацию решили подавать блоками: короткий текст, чёткий акцент, понятная кнопка действия. Визуальные элементы – с динамикой и лёгкой асимметрией за счёт масок, чтобы не было ощущения шаблонности.
• В мобильной адаптации сохранили легкость восприятия:

убрали лишние декоративные элементы, сохранив основные акценты

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

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

3. Результаты сотрудничества

Что у нас получилось? Результат и цена

Сайт для «Землян» мы собрали за три дня. В первый – сверстали главную страницу.

«Мы сделали главную страницу, её сразу согласовали. С первого раза и без каких-либо доработок именно по дизайну», – отмечает арт-директор Darvin Digital Наталья Головченко.

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

Сайт обошёлся клиенту в разумный бюджет – 155 тысяч рублей. И в рамках сроков, и по качеству – это решение, которое дало результат и не потребовало доработок после запуска.

Егор Чертов

руководитель отдела маркетинга, Академия «Земляне»

«Мы уже достаточно давно сотрудничаем с Дарвином в рамках продвижения основных проектов — школы и детского сада. Я уже тогда был доволен результатами как со стороны разработки, так и со стороны performance-маркетинга, так что в принципе на начальном уровне вопрос относительно выбора исполнителя не стоял. Как я считаю, отчасти именно из-за этого в рамках реализации нового проекта мы смогли избежать многих типичных для подобного процесса трудностей и неплохо сократили сроки запуска проекта — руководство и команда со стороны Дарвина уже были знакомы с нашими запросами, знали продукт, чувствовали в целом наш вайб (как бы смешно это ни звучало, но я считаю, что это очень важно в подобных взаимодействиях). Резюмируя, можно сказать, что пусть наш опыт хоть и достаточно специфичен (это не первый совместный проект, благодаря этому срезались многие углы), но исключительно положителен. Продолжаем работать вместе, чем я очень доволен».