О проекте
Благотворительный фонд поддержки социальных инициатив «Огонь Жизни» обратился к нам, чтобы создать сайт, где люди могут объединяться ради больших социальных изменений.
На старте у фонда был брендбук и желание превратить его концепцию в понятный, эмоционально вовлекающий цифровой продукт.
Задачи
- Передать ценности проекта и создать узнаваемый образ. Нужно было, чтобы сайт транслировал тепло, заботу, свет и поддержку, но при этом выглядел современно и вызывал доверие
- Построить удобный путь пользователя. Платформа рассчитана на широкий круг посетителей — от представителей НКО и бизнеса до волонтёров и потенциальных партнёров. Важно было сделать понятную структуру и не перегружать информацией
- Визуально выделиться среди других благотворительных платформ. Заказчик просил, чтобы дизайн ассоциировался с огнём, светом и природой, подача была мягкой и дружелюбной
Как мы работали
1. Исследовали аудиторию и собирали референсы
Изучали сайты из благотворительных, модных и lifestyle сфер, где визуализация эмоциональных состояний и ощущений выходит на первый план. Мы искали визуальные образы, которые ассоциируются с «огнём жизни» — тепло, искры, свет сквозь листву.
2. Разрабатывали прототипы
После того как мы собрали визуальные референсы и вместе с заказчиком определили, какие элементы лучше всего передают нужное настроение, приступили к формированию структуры — выстроили логику навигации и последовательность блоков сайта.
Структура и прототип главной страницы
3. При выборе цветовой гаммы и типографики отталкивались от брендбука
В качестве основы использовали яркую цветовую палитру фонда: огненно‑оранжевые и солнечные градиенты, дополненные природными зелёными оттенками. Типографика — легкая и современная, с хорошей читаемостью.
4. Сфокусировались на минимализме и эмоциях
Вместо длинных текстов использовали инфографику и цифры. Например, блок результатов показывает, сколько социальных мероприятий было проведено и сколько доноров привлечено за месяц. Так посетители сразу видят реальный вклад фонда. А для вовлечения добавили плавные градиенты и мягкие анимации при скролле.
5. Сделали сайт адаптивным
Для мобильной версии упростили анимации и компактно разместили основные разделы. Позаботились о доступности: контрастные тексты, крупные кнопки, удобный поиск.
С какими вызовами столкнулись
Главный вызов — найти баланс между эмоциональным дизайном и функциональностью. Важно было не увлекаться декоративными эффектами информация о фонде и партнёрах должна быть доступной в один‑два клика. Клиент просил усилить ассоциации с природой и светом, поэтому мы добавили больше тёплых градиентов и мягких свечений, усилили визуальные якоря на главной странице.
Результат
На сайте легко ориентироваться, пользователи быстро находят нужную информацию. Визуальные метафоры огня, света и природы задают нужное настроение и отражают ценности «Огонь жизни». Благодаря такому подходу сайт помогает фонду делиться своими проектами и успехами, привлекая новых партнёров.
