Благотворительный фонд Тимченко отмечает 15 лет работы. К юбилею мы создали digital-платформу, которая объединила все ключевые события года.
Цель: Сайт должен быть центральным хабом для общения с аудиторией, рассказывая о достижениях, новостях фонда в современном digital-формате.
Главный вызов: Реализация полного цикла работ — от идеи до запуска — всего за один календарный месяц.
Основной сайт Фонда
Задача
Разработать сайт, который представит все юбилейные инициативы фонда и вовлечет аудиторию и
станет хабом для всех юбилейных мероприятий: презентации конкурса «Время действовать», премии «Человек дела» и премьеры документального фильма «Люди дела»;
позволит фонду рассказать о своем 15-летнем пути и ключевых результатах в формате интервью;
вовлечет пользователей с помощью интерактивной викторины «Загадки из глубинки»;
будет полностью соответствовать готовому юбилейному фирменному стилю;
будет адаптирован под все устройства (ПК, планшеты, смартфоны).
Использование юбилейного фирменного стиля
Нам предоставили готовый брендбук с юбилейной айдентикой. Наша задача — грамотно перенести его в цифровое пространство.
Мы тщательно адаптировали предоставленные гайдлайны:
Цветовая палитра: Активно использовали яркие юбилейные цвета: зеленый, бежевый, голубой и глубокий синий, создав энергичное и праздничное настроение.
Типографика: Сочетание шрифта Coolvetica для заголовков, акцентов с современным рубленым шрифтом TTCommons для текста, сохранило уникальность стиля и обеспечило удобочитаемость.
Графика: Интегрировали фирменные иллюстрации, паттерн «лоскутное одеяло», оживили статичные элементы с помощью микровзаимодействий и анимаций.
Юбилейный фирменный стиль
Разработка структуры сайта
Структура сайта была выстроена вокруг главных юбилейных активностей. Мы начинали с сильного оффера и вели пользователя по четкому сценарию.
Главный экран: Яркий заголовок с ключевым посылом «15 лет — c людьми, о людях, для людей», паттерн «лоскутное одеяло» с галерей, трейлером и фирменными иллюстрациями.
Юбилейные цифры: Блок с ключевыми показателями работы фонда за 15 лет («5367 поддержанных проектов», «23 проведенных конкурса», «10 млрд рублей расходов за 15 лет» ).
Интервью: Раздел с персональными историями и интервью команды фонда, раскрывающий его изнутри.
Вдохновляющие примеры: Кейсы с историями героев фонда из разных регионов России.
Викторина «Загадки из глубинки»: Центральный интерактивный элемент для вовлечения пользователей.
В основе визуальной концепции — мудборд, собранный из референсов. Мы анализировали современные корпоративные сайты, интерактивные образовательные платформы и медиа-проекты с нелинейной подачей контента.
Корпоративные сайты: Смотрели на современные решения с смелыми акцентами и анимацией.
Интерактивные проекты: Искали вдохновение в сайтах с игровыми механиками и викторинами.
Образовательные платформы: Изучали подход к подаче сложной информации в простой и увлекательной форме.
Медиа: Смотрели, как крупные издания работают с длинными текстами и интервью, разбивая их на удобные блоки.
Прототип
После утверждения структуры мы создали детальный интерактивный прототип. На этом этапе мы:
Четко определили расположение всех ключевых блоков: навигации, статистики, карты с историями, блоков конкурса и премии.
Продумали логику викторины: Определили количество шагов (17 вопросов), механику выбора ответа и отображения правильного варианта с пояснением.
Расставили все акценты и приоритеты по контенту.
Продумали логику адаптации каждого блока под мобильные устройства.
Утвердили с клиентом сценарий взаимодействия пользователя с сайтом до начала дизайна, что сэкономило массу времени.
Прототип юбилейного лендинга
Дизайн-макет
В дизайне мы сделали ставку на динамику, эмоции и удобство, уделив особое внимание контенту.
Анимации: Уделили особое внимание анимации, чтобы оживить интерфейс и сделать его плавным. Продумали анимационные переходы между блоками, появление элементов при скролле.
Визуальная иерархия: Использовали контрастные цвета и размеры шрифтов, чтобы направить внимание пользователя на главные юбилейные анонсы.
Работа с контентом:
Интервью оформили в виде карточек с цитатами и портретами, добавив удобную навигацию «Следующее интервью».
Блоки конкурса, премии и фильма визуально унифицировали, создав четкий и узнаваемый паттерн для подачи важной информации.
Адаптивность: Сразу разрабатывали три версии макета (десктоп, планшет, телефон), чтобы на каждом устройстве сайт смотрелся органично.
Верстка сайта
Верстку выполнили с фокусом на производительность, доступность и визуальную составляющую.
Сложные интерактивные элементы: Разработали и внедрили механику викторины и анимированной карты с нуля.
Полная адаптивность: Сайт корректно работает на всех разрешениях экрана и в современных браузерах.
Кастомная графика: Создали набор кастомных иллюстраций и анимированных элементов специально для викторины.
Базовая SEO-оптимизация: Настроили все мета-теги, заголовки, alt-атрибуты и структуру данных для лучшей индексации.
Добавление на сайт викторины
Викторина «Загадки из глубинки» стала ключевым интерактивным элементом сайта.
Разработка с нуля: Реализовали механику из 17 вопросов.
Обратная связь: Настроили мгновенное пояснение к ответам, превращая викторину в образовательный инструмент.
Индикация прогресса: Пользователь всегда видит, на каком он шаге, что мотивирует дойти до конца.
Плавная анимация: Все переходы между вопросами анимированы, создавая ощущение игры.
Дизайн: Отрисовали уникальные иллюстрации в юбилейном фирменном стиле.
Итоговые результаты
Мы успешно реализовали проект в сжатые сроки — всего за 1 месяц.
Единая платформа: Создали многофункциональный хаб для всех юбилейных инициатив фонда.
Яркий дизайн и интерактив: Внедрили интерактивную механику викторины.
Полная адаптивность: Сайт безупречно работает на всех устройствах.
Запуск в срок: Проект был сдан точно в оговоренную дату.
Яркий и современный сайт стал достойным цифровым памятником 15-летней работе фонда, позволил красиво рассказать о его достижениях и вовлечь аудиторию в празднование юбилея через игровой формат. Сайт будет наполняться новостями в течение всего 2025 года.
Хотите такой же эффектный проект для вашей компании? Напишите нам, и мы обсудим, как можно реализовать ваши идеи!