Вселенная Foxy: сайт-игра для школы цифрового рисунка

Foxy — школа цифрового рисунка для детей в Казани, Санкт-Петербурге и онлайн.

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

Школа искала творческую команду, которая сможет совместить в одном сайте потребности обеих ЦА, передать креативность школы в визуале и сделать удобную навигацию многочисленных разделов. Foxy нашли AVA Digital — и с первой встречи у нас возникла синергия.

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

Школа обучает креативным диджитал-профессиям, поэтому дизайн содержит максимум цифровой иллюстрации. Так родилась идея создать «Вселенную школы Foxy»: мира, где маскоты помогают детям учиться. 

Работа шла в несколько этапов:

1. Продумали структуру и сделали навигацию понятной для посетителей.

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

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

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

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

Особое внимание уделили мобильной версии: по статистике, сайт Foxy чаще всего открывают с телефона.

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

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

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

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

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

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

Новый сайт Foxy представляет школу яркой, современной и творческой. Главной фишкой проекта стали живые маскоты и интерактивные анимации: они вовлекают и создают дружелюбную атмосферу.

Структура понятна и детям, и родителям, а сайт легко масштабируется под будущие изменения. Новый дизайн демонстрирует креативность и профессионализм школы в цифровом рисунке.

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