О проекте SEA FRIENDS — большой волонтёрский портал, который помогает спасать Черноморское побережье после разлива мазута и других ЧС. Это не просто лендинг, а живая экосистема из 25 страниц и 1000+ ссылок, где любой человек за пару кликов понимает: как именно он может помочь — руками на берегу, удалённо или финансово.
Моя роль
проработала информационную архитектуру и пользовательские сценарии для разных типов волонтёров;
продумала структуру портала (раздел «Волонтёрам», библиотека, база знаний, расселение и обеспечение);
создала UX-каркасы ключевых страниц и вариантов навигации;
разработала UI-дизайн: визуальный стиль, сетки, карточки задач, состояние кнопок и аккордеонов;
подготовила дизайн к масштабированию: единые шаблоны для типовых страниц и материалов библиотеки.
Процесс работы Определили главную задачу
Сделать волонтёрство «быстрым и понятным»: человек заходит на сайт и сразу видит, что именно он может сделать и куда нажать, чтобы присоединиться.
Сценарии пользователей Разложила аудиторию на несколько ключевых ролей:
«Хочу помочь, но не знаю как»
«Уже еду на побережье — нужны задачи и инструкции»
«Могу только удалённо / деньгами»
«Организатор и координатор смен»
Под каждый сценарий выстроены отдельные пути: от главной страницы до конкретной задачи, инструкции и контактов координатора.
Структура портала
раздел «Волонтёрам» с понятной навигацией по направлениям: спасение птиц, уборка мазута, спасение животных, digital-волонтёрство, другие задачи;
библиотека и база знаний: методички, инструкции, материалы по экологии и работе на ЧС;
блок расселения и обеспечения: жильё, питание, льготы, ответы на бытовые вопросы;
отдельные страницы с историей катастрофы, статистикой и текущей ситуацией.
Прототипы и тест логики Сначала собрала все материалы НКО, расписала дерево страниц и внутренние переходы, затем собрала кликабельные прототипы и проверила, можно ли:
с главной за 2−3 клика выбрать формат помощи;
за несколько экранов получить исчерпывающие инструкции и контакты;
не «потеряться» в десятках материалов библиотеки.
Дизайн и продуктовые решения
Эмоциональный визуал Большие фотографии моря, птиц и волонтёров на берегу создают ощущение присутствия и показывают масштаб проблемы. На их фоне хорошо читаются крупные заголовки и понятные призывы к действию.
Чёткие входы в волонтёрство
На первом экране — крупный заголовок «Спасаем Черноморское побережье» и две главные кнопки:
«Стать волонтёром» и «С чего начать».
Далее — блок с карточками форм помощи: спасение птиц, очистка берега от мазута, материальная помощь, DIGITAL-волонтёрство, прочие задачи. Каждая карточка — отдельный маршрут с объяснением задач и требованиями.
Сильный блок статистики
Раздел «Статистика на сегодня» показывает реальные цифры: сколько тонн загрязнённого песка вывезено, сколько птиц спасено, сколько волонтёров участвуют. Это усиливает доверие и мотивирует присоединиться.
Подробные описания задач
Карточки «Сбор мазута», «Мойка птиц», «Ловля птиц», «Поиск птиц» оформлены как мини-лендинги с задачами, требованиями, описанием работы и кнопкой «Стать волонтёром».
Так человек сразу понимает, что именно его ждёт.
Удобная библиотека знаний
Для большого массива материалов созданы единые шаблоны: заголовки, подзаголовки, блоки с иллюстрациями, заметками и ссылками. Это помогает быстро ориентироваться даже в длинных текстах.
Контрастный, но спокойный стиль
Основу составляет тёмный фон с морской фактурой и яркий синий акцент — цвет действия и надежды. Большая типографика и крупные кнопки делают сайт удобным для людей разного возраста и опыта.
Результат Выстроена логичная и масштабируемая структура портала на 25+ страниц, которая выдерживает 1000+ внутренних и внешних ссылок и остаётся понятной.
Любой пользователь заходит на сайт и за несколько кликов находит свой формат помощи — от полевых смен до удалённого участия.
Волонтёры и организаторы получили единую точку входа: задачи, инструкции, расселение, статистика и обучающие материалы собраны в одном месте.
Проект остаётся полностью волонтёрским, но по ощущению и качеству дизайна — на уровне коммерческого продукта.
Итог SEA FRIENDS — для меня особенный, очень тёплый и масштабный проект. Здесь дизайн работает не только на удобство, но и напрямую помогает спасать море, птиц, животных и людей, которые каждый день выходят на берег.
