Главная

Разработка дизайна сайта
для футбольной школы

Разработка дизайна сайта для
футбольной школы

Наш клиент

Футбольная школа для детей от 4 до 10 лет. Здесь юные спортсмены улучшают свою физическую подготовку, учатся работать в команде и профессионально играть в футбол.

свисток

Начало проекта

книга

Предыстория

Футбольная школа «Кальчо» много лет привлекала новых учеников через рекомендации родителей. Но проекту нужен был рост. Тут и появилась задачка со звездочкой — создать новый канал привлечения клиентов, чтобы больше людей узнали о школе.

На нас было ответственное задание – разработать сайт.  И первый вопрос, на который нам нужно было найти ответ — какой стек выбрать. WordPress? Laravel? 
флаг

Старт

Звучит неплохо, но не для этого проекта! Мы всегда выбираем то, что лучше подходит для конкретной задачи бизнеса. Это первый сайт школы, и его цель — протестировать гипотезу. Поэтому нужно было сделать всё быстро, недорого, но качественно. Выбор пал на Tilda. В будущем, на основе лендинга можно будет разработать полноценный многостраничный сайт, который позволит школе развиваться дальше.

Знакомство с талисманом

Далее нам предстояло знакомство с важным членом команды. С тем, кто отражает душу и философию проекта. Талисманом команды — птицей Феникс. Он говорит о преодолении, о силе, о том, как важно подниматься, когда кажется, что всё потеряно. Клиент хотел, чтобы этот образ жил на сайте и не просто украшал страницы, а вдохновлял, объединял и делал школу узнаваемой. Мы решили, что Феникс должен быть повсюду — от деталей в дизайне до общей атмосферы.

Спойлер

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

талисман
футбольная командафутбольная команда
кисть

Цветовая палитра

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

Аудитория и Контент

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

  • Информация о тренерском составе
  • Методики и программы обучения
  • Расписание тренировок
Эти блоки стали основой, чтобы родителям было легко и удобно выбрать тренировки для своих детей.
свисток
поиск

Создание UX-Текстов

Далее мы взялись за тексты. Как мы уже упоминали, лендинг — это способ создать сайт быстро и без лишних затрат. Поэтому некоторые этапы, например, прототипы, пропускаются. Но показать клиенту, как примерно будет выглядеть сайт, всё равно нужно. Поэтому мы подготовили UX-тексты — не сплошное полотно букв, цифр и символов, а структурированную информацию с выделенными под заголовками, списками и блоками.

поиск

Простой язык

Мы учли, что чаще всего родители не сильно владеют футбольным сленгом. Поэтому все тексты писали понятным языком, умные слова по типу “офсайд” и “поперечный пас” оставили на следующий раз.
И знаете, что? Первая наша маленькая победа на проекте не заставила себя ждать: тексты и структуру согласовали с первого раза! Видимо, мы точно попали в сердце и клиента, и его целевой аудитории.

Главный блок

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

  • Возрастные группы (4–10 лет), подход к обучению, уникальные фишки — всё под рукой, а ещё чётко и по делу.
  • Ограничение по возрасту мы специально выделили для привлечения внимания нужной аудитории.
  • Чтобы считывать информацию было легко, фон сделали с градиентом — он убирает визуальный шум от фото и помогает сосредоточиться на сути.
ноутбук
форма

Заманчивое предложение

Цель сайта — привести новых юных звезд футбола, и мы не могли не выделить главное предложение: бесплатная пробная неделя! Красная кнопка записи сразу притягивает взгляд за счет яркости, а рядом Феникс бодро призывает: «Давай с нами! Первая неделя бесплатно». Ещё и стрелочка подмигивает — ну как устоять?

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

презентация

Живая презентация

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

Дизайн, вдохновленный футболом

Ключевые особенности школы мы оформили в формате футбольного поля, чтобы поддержать спортивную тематику. Ну а как же без Феникса? Он снова в центре внимания, вдохновляет и задаёт настроение всему разделу.

футбольное поле

Дневник Успеха

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

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

А еще, заметили? В этом разделе фон меняется с черного на красный, создавая яркий контраст. Такой прием привлекает внимание и делает информацию более заметной. Если бы все блоки выглядели одинаково, пользователь, скорее всего, просто проскролил бы страницу, не вникая в детали.

Разделение блоков
ноутбук
методика

Увлекательное обучение

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

Знакомство с тренером

А после мы решили устроить знакомство родителей с тренером. Уже на этапе выбора школы важно создать первое впечатление о специалисте, и мы сделали всё, чтобы оно было позитивным. Добавили достижения тренера, немного рассказали о его подходе к обучению, а для большей наглядности — цитату, которая отражает подход к работе. Но сухих слов нам показалось мало, поэтому мы подкрепили все сказанное фотографиями тренера в работе с детьми. Снимки добавляют тепла, прозрачности и помогают родителям убедиться: их ребёнок будет в надёжных руках.

тренер

Занятия по группам

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

группа

Расписание

Добавили и расписание занятий — одно из важных факторов при выборе кружка для ребенка. Важно, чтобы оно было удобным не только для детей, но и для их родителей. Мы задизайнили модуль в виде недельного календаря, где сразу видны все занятия: дни, время и продолжительность. Такой формат помогает быстро понять, вписывается ли кружок в график семьи и подходит ли он для вашего ребенка.

Стоимость

А после рассказа о школе перешли к цифрам. Предложили клиенту три варианта стоимости занятий. Для каждого тарифа описали выгоду — сколько стоит одно занятие, и подробно объяснили, чем они отличаются.

занятие
сообщение

Блок отзывов

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

вопрос

FAQ

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

мяч

Функциональный сайт

Мы сделали сайт не только удобным, но и функциональным. Настроили автоматическую отправку данных из формы записи прямо в CRM-систему Tilda, чтобы клиент мог легко управлять заявками и не упускать клиентов.

Всегда на связи

Добавили постоянную плашку с контактами — номер телефона и Телеграм. Это простая и всегда доступная альтернатива чат-боту, которая помогает родителям связаться со школой в любое время.

форма обратной связи

Яркий профиль школы

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

Каждая деталь здесь на своём месте и складывается в общую картинку. Дизайн сайта выделяет «Кальчо» среди других школ, структура сайта помогает быстро найти нужную информацию, а тексты — простые и понятные. Даже если вы о футболе знаете только слово «мяч», всё равно разберётесь.
телефонтелефон

Елена

ACCOUNT MANAGER

Девушка
Вверх