Сочный сайт аналитического центра НАФИ
Не всем аналитическим центрам суждено быть унылыми и вгоняющими в тоску километрами текста. Сегодня мы расскажем про яркий жёлтый сайт НАФИ, который хочется смотреть, читать и исследовать.
НАФИ — аналитический центр, который занимается социологическими и маркетинговыми исследованиями. Он анализирует терабайты данных, получает цифры и объясняет заказчикам, что они значат. Помогает понять, в какую сторону жить и куда двигаться, чтобы быть успешными ещё много-много лет. Услуга пользуется спросом у крупных компаний, которым важно планировать развитие на годы вперед.
В общем, работа у НАФИ серьезная. Кто-то даже скажет, занудная. И будет ожидать от него скучного, что аж зубы сводит, сайта в голубых тонах с простынями текста. Но свой сайт НАФИ делал у нас — так что не надейтесь. Получилось ярко, интересно, местами даже няшно.
В общем, работа у НАФИ серьезная. Кто-то даже скажет, занудная. И будет ожидать от него скучного, что аж зубы сводит, сайта в голубых тонах с простынями текста. Но свой сайт НАФИ делал у нас — так что не надейтесь. Получилось ярко, интересно, местами даже няшно.
Задачи
- Сделать крепкий современный сайт, который соответствует серьёзной компании.
- Привлечь новых клиентов, увеличить количество контактов, полученных через сайт.
- Структурировать информацию об исследованиях, чтобы пользователи легко воспринимали её.
Аналитика
На этапе аналитики мы поняли, как важно показать, что НАФИ — эксперты, а их исследования глубокие, важные и полезные. Обычно в таких случаях компании демонстрируют примеры работ. Но для аналитического центра это не вариант — всё-таки он работает с конфиденциальными данными. Поэтому, как бы нам ни хотелось показать крутую аналитику, которую НАФИ сделали, например, для ВТБ, это было невозможно.
Проблема решается проведением исследований без заказчика. Аналитический центр сам придумывает темы и изучает их. Эти исследования — пример для потенциальных заказчиков. На старом сайте НАФИ они пылились в PDF-файлах, не привлекая внимания людей и поисковиков. Мы же решили завести им свой красивый и уютный раздел «Спецпроекты».
Прототип сайта в этот раз делал не аналитик, а дизайнер, который тоже может в UI. Поэтому многие идеи и фишки сайта появились уже на этом этапе. Например, промоблок с графиками и плавающая боковая менюшка в разделе "Решения".
Проблема решается проведением исследований без заказчика. Аналитический центр сам придумывает темы и изучает их. Эти исследования — пример для потенциальных заказчиков. На старом сайте НАФИ они пылились в PDF-файлах, не привлекая внимания людей и поисковиков. Мы же решили завести им свой красивый и уютный раздел «Спецпроекты».
Прототип сайта в этот раз делал не аналитик, а дизайнер, который тоже может в UI. Поэтому многие идеи и фишки сайта появились уже на этом этапе. Например, промоблок с графиками и плавающая боковая менюшка в разделе "Решения".
В прототипе нужно было уместить очень большое количество информации и четко показать, чем НАФИ занимается. Был опасный момент с очень длинным вспомогательным меню по отраслям в шапке. Боялись, что оно может перегрузить шапку. В результате переименований и перетасовки пунктов удалось найти оптимальное решение.
Юлия
Дизайнер
Дизайн
Заказчик принёс сочный фирменный стиль: серьезный серый, акцентный жёлтый. С цветами играться не пришлось :)
Зато мы очень кропотливо прорабатывали промоблок на главной.
Зато мы очень кропотливо прорабатывали промоблок на главной.
Пришлось поломать голову над размещением графиков в шапке сайта. Там должны быть и цифры, и сегменты, и расшифровка. И чтобы это все ещё читалось :)
У нас был вариант с большой полноэкранной шапкой — туда помещалось много информации, но на первом экране нужно было показать сразу и часть исследовательских решений. Поэтому после нескольких итераций мы таки пришли к оптимальному варианту — сделали шаблон, под который дизайнер НАФИ может сам готовить подходящие материалы для каждого слайда.
У нас был вариант с большой полноэкранной шапкой — туда помещалось много информации, но на первом экране нужно было показать сразу и часть исследовательских решений. Поэтому после нескольких итераций мы таки пришли к оптимальному варианту — сделали шаблон, под который дизайнер НАФИ может сам готовить подходящие материалы для каждого слайда.
Юлия
Дизайнер
Получившийся в итоге промоблок — не только картинка и заголовок, но и график, и информация к нему. Есть варианты: вместо графика может быть ключевая цифра, анонс мероприятия или комментарий эксперта. Все элементы промоблока заказчик может сам редактировать через админку.
Дотошно подошли к разработке раздела "Клиенты и отзывы".
Важно было показать много-много логотипов и отзывов на узнаваемых бланках. Заказчик хотел, чтобы пользователь сразу видел их все, прям как будто они висят в рамочках на стене. Поэтому мы сделали прокручивающуюся галерею с отзывами. Если какой-то привлёк внимание — пользователь может кликнуть на него и прочитать.
Татьяна
Руководитель проекта
На сайтах аналитических центров бывает скучно из-за бесконечных простыней текстов. Поэтому нам важно было придумать, как аккуратно, не делая пользователю больно и не погружая его в глубокие воды уныния, оформить исследования и отчёты на сайте НАФИ.
На обсуждении мудборда стало понятно, что ребята хотят современный представительный сайт с адекватной навигацией, при этом без «длинной колбасы» на главной. Сайты известных в этой отрасли компаний обычно страдают перегрузом информации. На них обычному человеку легко запутаться.
Я успела поработать журналистом и помню ужас, который испытала, когда на одном из сайтов по исследованию общественного мнения мне нужно было найти информацию по одному из недавно проведенных опросов. А ведь я тогда была уже опытным интернет-пользователем.
Я успела поработать журналистом и помню ужас, который испытала, когда на одном из сайтов по исследованию общественного мнения мне нужно было найти информацию по одному из недавно проведенных опросов. А ведь я тогда была уже опытным интернет-пользователем.
Юлия
Дизайнер
Часть исследований решили публиковать в PDF, сопровождая кратким описанием. А чтобы пользователю захотелось их скачать — добавили яркий блок с обложкой документа, который придёт на почту оставившему контакты пользователю. Мелочь, а приятно.
А спецпроекты, которые выполняют важную функцию — дают понять уровень экспертности аналитиков НАФИ — решили показывать более подробно: с картинками, отзывами клиентов и ключевыми ссылками. Тут уже постарались разработчики, но об этом чуть позже.
А пока посмотрите, что умеет НАФИ-шный слон!
А пока посмотрите, что умеет НАФИ-шный слон!
Разработка
У материалов в разделе "Спецпроекты" немного общих элементов: картинка в шапке, заголовок и три ключевые цифры исследования. А все остальные блоки заказчик может добавлять, убавлять и компоновать как пожелает — получился целый конструктор страниц.
В админке можно указать произвольное количество блоков текста в рамках одного проекта. И для каждого задается заголовок и набор сносок, если нужно.
Сергей
Разработчик
В разделе "Спецпроекты" может быть 3 ключевых цифры, чтобы сразу дать пользователю то, зачем он пришел — конкретные цифры. А дальше — делай что хочешь. Ссылки, тексты, заголовки — все спокойно редактируется. Мы проработали, чтобы в каждом исследовании была примерно одинаковая структура: методы, результаты и т.д. Но и её можно менять и редактировать.
Татьяна
Руководитель проекта
Ещё мы довольны самим заказчиком — приятно работать с людьми, которые с энтузиазмом погружаются в проект и делают всё, чтобы он получился клёвым.
Готовый проект