Brainius — реализация и развитие сайта онлайн-школы

Brainius — онлайн-школа, которая объединяет подготовку к экзаменам, профориентацию и дополнительные образовательные направления. Студия подключилась к проекту на этапе реализации готовой дизайн-концепции. Мы отвечали за вёрстку на Tilda, адаптацию, анимации и интерактивные элементы.

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

Клиент: Brainius
Платформа: Tilda
Работы студии: вёрстка, адаптация, анимации, интерактивные компоненты, настройка форм, сопровождение и развитие
Дизайн, структура и контент: предоставлены клиентом
Срок первого этапа: один месяц
Статус: продолжаем сопровождение

Реализовать редизайн действующего сайта онлайн-школы и обеспечить корректную работу интерфейса на разных устройствах.

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

В дальнейшем объём работ расширился: потребовались обновления существующих разделов и отдельные страницы для подготовки к ЕГЭ и ОГЭ по предметам.

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

Особого внимания потребовали блоки с насыщенным содержанием и интерактивными состояниями. Для них мы проработали адаптивную компоновку, настроили анимации и проверили взаимодействие элементов в собранных страницах.

За месяц завершили первоначальную реализацию редизайна и подготовили сайт к следующему этапу развития.

Карточки программ — один из основных интерфейсных компонентов проекта. Они объединяют форматы подготовки, условия обучения и стоимость, помогая посетителю сопоставить варианты перед обращением.

Мы реализовали карточки и переключение тарифов по предоставленным макетам. При адаптации учитывали разный объём содержания: параметры программ должны последовательно читаться и сохранять связь с соответствующей ценой и действием.

Вёрстка этого раздела потребовала согласованной работы компоновки и интерактивных состояний — как на широком экране, так и в мобильной версии.

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

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

Анимации настраивали с учётом адаптивных состояний, чтобы они корректно работали в общей композиции страницы.

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

Следующим этапом стало расширение сайта страницами ЕГЭ и ОГЭ, включая подготовку по отдельным предметам. Новые страницы собрали по предоставленным структуре и макетам, сохранив общую визуальную систему проекта.

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

Мы настроили отправку заявок на email и в Telegram, а также переходы к входу и регистрации на готовой учебной платформе.

Студия реализовала редизайн Brainius на Tilda за месяц и продолжила развитие сайта после запуска. В рамках следующих этапов обновили блоки и добавили страницы направлений ЕГЭ, ОГЭ и отдельных предметов.

По обратной связи клиента, сайт получает заявки, а сотрудничество продолжается в формате сопровождения.