О проекте
«Элми Эдуа»— центр досуга для детей и взрослых в г. Саратов. Здесь жители и гости города могут посещать мастер-классы, творческие студии и организовывать мероприятия.
Центр также направлен на создание онлайн-платформы, где родители смогут найти актуальную информацию по вопросам воспитания детей. Информация на сайте разделена на 7 возрастных категорий: 0-1,5 года, 1,5-3 года, 3-5 лет, 5-7 лет, 7-10 лет, 10-12 лет и 12-15 лет.
Родителям доступны чек-листы, статьи от возрастных и детских психологов, советы педиатров и логопедов, а также мультфильмы для каждой возрастной категории.
Дети смогут проходить тесты, викторины, раскрашивать героев вселенной «Элми Эдуа» и скачивать шаблоны для бумажных игрушек.
Дети смогут проходить тесты, викторины, раскрашивать героев вселенной «Элми Эдуа» и скачивать шаблоны для бумажных игрушек.
Задачи
1.Разработать многостраничный сайт, следуя брендингу компании. Важно грамотно распределить объем информации, сделав навигацию простой и удобной как для переходов внутри возрастных категорий, так и между ними.
2.Создать и анимировать вселенную «Элми Эдуа» для главного экрана сайта, а также сгенерировать изображения и обложки для всех страниц и карточек.
3.Наполнить сайт интерактивным контентом для детей: тестами, викторинами и раскрасками. Внедрить возможность раскрашивания героев вселенной и создание рисунков на белом холсте.
4.Добавить страницу «Афиша», предназначенную для анонсов онлайн-лекций, семинаров, подкастов и образовательных программ.
Подготовительные работы
Первым этапом в разработке сайта была идея. Идея о том, как родителям и детям было бы лучше взаимодействовать с нашим будущим сайтом, как визуально, так и информационно. У клиента были методические материалы о возрастных группах, что разным деткам и родителям важно узнавать на каждом этапе взросления. Также клиент принёс нам огромный список из около 100 сервисов похожих направленностей. Мы проанализировали все эти документы и выявили свой список разделов и активностей, которыми хотели наполнить портал. Позже, под все наши задумки и разделы копирайтеры и методологи писали обучающие статьи и рисовали раскраски.
Сайт включает 6 основных разделов:
Внутри всех разделов находится ещё суммарно 71 страница.
Сайт включает 6 основных разделов:
- главная,
- для родителей,
- для детей,
- об Элми Эдуа,
- афиша и материалы,
- а также 3 сервисные страницы: политику конфиденциальности, страницу благодарности и страницу ошибки 404.
Внутри всех разделов находится ещё суммарно 71 страница.
Из-за большого объема информации было важно представить её в разных форматах: текстовых, аудио, интерактивных. Контент ориентирован как на родителей, так и на детей, поэтому на сайте размещены текстовые блоки, статьи, чек-листы, советы врачей, мультфильмы, аудиосказки, списки литературы, профориентационные тесты и шаблоны для бумажных игрушек.
Работа над сайтом началась с разработки более 20 прототипов. Были детально проработаны структура сайта и расположение контента, чтобы обеспечить простоту навигации, несмотря на значительное количество страниц.
Важным документом при разработке крупных сервисов и программ служит техническое задание. Наше тех.задание включало в себя 49 страниц, в котором описаны структура сайта, контент, механики работы тестов, викторин, раскрасок, аудиосказок и мультфильмов. Документ содержит описание навигации сайта, расположения блоков на страницах и переходов между разделами.
Техническое задание это документ, который подписывается как нами - агентством, так и клиентом. Это помогает установить границы проекта, а так же подробно рассказать клиенту о всех этапах разработки сайта.
Дизайн-концепции
В ходе первой встречи заказчик представил референсы и свои идеи относительно дизайна сайта. Концепция должна соответствовать брендингу вселенной «Элми Эдуа» и быть выполнена в розово-фиолетовой гамме с фирменными шрифтами и уникальным визуальным контентом.
Самым важным шагом было определиться с первым экраном сайта, он должен был быть похож на экран игры и передавать всю суть вселенной «Элми Эдуа» - быть ярким, сказочным и волшебным, показывать какой-то новый и скрытый мир. На самой странице только анимация и небольшая навигация.
Самым важным шагом было определиться с первым экраном сайта, он должен был быть похож на экран игры и передавать всю суть вселенной «Элми Эдуа» - быть ярким, сказочным и волшебным, показывать какой-то новый и скрытый мир. На самой странице только анимация и небольшая навигация.
Мы вдохновились современными MMO RPG и иллюстрациями game-дизайнеров, чтобы передать атмосферу. Увидели закономерности, нашли "свои фишки" и отправились в нейросети, чтобы воплотить идеи в жизнь. На основе сгенерированных сцен и прототипов мы собрали 4 варианта главной страницы.
Клиенту больше всего понравился вариант 4 - с ним и продолжили работать. Позже для всех страниц мы сгенерируем обложки, основываясь на нашем главном экране, чтобы гамма, настроение и элементы мира переходили из картинки в картинку и собирались в единую вселенную.
На слайдах изображены страница «Для родителей», «Для детей», «Об Элми Эдуа», «Афиша», «Материалы».
Верстка
После утверждения дизайна всех страниц началась верстка сайта. Для страниц с изменяемым контентом использовались шаблонные блоки, а для уникальных — кастомные решения. На уникальные страницы добавлены текстовый контент, изображения, созданные с помощью нейросети Midjourney, и мультфильмы.
Ключевая особенность сайта — главная героиня, которая меняется и растет по мере изучения контента. Эта девочка была разработана на основе детских фотографий основательницы «Элми Эдуа», олицетворяя детское любопытство и озорство, с которым создавался весь проект.
Эту же девочку мы использовали как в обложках на страницах каждого возраста, так и в мультиках, которые были отрисованы аниматором по нашим изображениям. Идея ожила в рамках сайта и даже за его пределами.
Также было загружено более 30 чек-листов и 90 статей, каждая с уникальной обложкой.
Остальные 75 страниц были сверстаны на шаблонных блоках с добавлением иллюстраций и иконок. Все статьи, чек-листы и советы были распределены по возрастным категориям. Проект «Элми Эдуа World »был переведен на английский язык, и сайт теперь работает на двух языках.
Остальные 75 страниц были сверстаны на шаблонных блоках с добавлением иллюстраций и иконок. Все статьи, чек-листы и советы были распределены по возрастным категориям. Проект «Элми Эдуа World »был переведен на английский язык, и сайт теперь работает на двух языках.
Фишки проекта
Для создания атмосферы сайта был разработан анимационный главный экран. Изображение вселенной «Элми Эдуа», созданное с помощью Midjourney, анимировано в Adobe After Effects: добавлены летающие бабочки, мерцающие звезды и другие эффекты.
Одной из интерактивных функций для детей является раскраска. Она позволяет раскрашивать картинки в фирменном стиле компании или создавать собственные рисунки на чистом холсте. Также раскраску можно скачать в формате PDF и распечатать.
Для родителей детей от 1,5 до 3 лет на сайте доступны аудио- и текстовые версии сказок: «Репка», «Колобок», «Теремок» и другие.
Дети и родители могут пройти викторины: музыкальные, по животным, растениям, сказкам и мультфильмам, а также психологические тесты.
Сайт на 90% состоит из изображений, созданных нейросетями, включая обложки страниц и карточек статей, визуальный контент внутри статей и персонажей, которые меняются с возрастом пользователей.
Итоги работы
В рамках проекта был создан интерактивный онлайн-ресурс для детей и родителей. Сайт стал международным и содержит уникальные изображения и анимацию на главной странице, что позволяет пользователям познакомиться со вселенной «Элми Эдуа».
В конце работы мы, как для всех наших клиентов, подготовили единый документ-справочник по новому сайту. Это документ, который содержит
- информацию о подключённых к сайту сервисах (Что такое домен и когда за него платить? Когда оплачивать тильду?),
- инструкции, которые мы пишем к каждому сайту персонально,
- а также оставляем контакты нашей технической поддержки на случай вопросов или неполадок.