Альфа-Банк / Редизайн сайта Alfa Digital

Alfa Digital — это сообщество внутри Альфа-Банка, объединяющее более 9 500 IT и digital сотрудников. Сайт Alfa Digital создан как основная страница и точка контакта с IT и digital-аудиторией.

‍

Проблемы

‍

  • Сейчас сайт больше похож на хранилище активностей-событий, на которые можно зарегистрироваться, а также список вакансий, на которые аудитория может откликаться.
  • Все разделы сайта однотипные и неудобные пользователю, фильтры не все корректно выставлены.
  • Нет разделов о команде и преимуществах банка.
  • Из-за неорганизованности сайт не эффективен.

‍

Задача: создать дизайн-макеты нового облика сайта Alfa Digital под Тильду, удобные и функционально продуманные, передающие атмосферу и культуру Альфа-банка и Alfa Digital, и подготовить адаптивные версии под мобильное устройство.

‍

Работа осуществлялась в команде из четырех UX/UI-дизайнеров, продакта и проджекта, но последние два члена команды по каким-то причинам пропали за 2 дня до демо, не предоставив ничего из своей проделанной работы, можно сказать, что редизайн сайта мы осуществили за полторы недели вчетвером.

Ссылка на Figma

Клиент

Альфа-Банк

Вид работы

Продуктовый дизайн

Год

2023

Исследования

Прежде чем сформулировать гипотезы для осуществления редизайна сайта Alfa Digital, мы создали ассоциативное поле, исследовали текущие решения по каждой странице сайта, провели анализ конкурентов, собрали референсы по отдельным блокам и разделам (подробнее в Figma). А после формулирования гипотез мы спроектировали User Flow и начали творить, каждый свой раздел.

Главная страница

2 UX/UI-дизайнера из нашей команды занимались главной страницей сайта Alfa Digital.  Они старались максимально точно передать tone of voice и стилистику IT-сообщества Альфа-Банка, погрузить в культуру и команду компании, отразить преимущества банка. А так же они добавили информацию о продуктах Alfa Digital, чтобы отразить технологичность банка, в них зашиты ссылки на обновления данных продуктов, взятые их дайджеста обновлений. По своей структуре данная страница стала своего рода лендингом, презентующим IT-сообщество Альфа-Банка и вкратце рассказывающим про разделы сайта Alfa Digital.

До

После

Страница «о нас»

В соответствии с запросом заказчика, мы добавили на сайт раздел «О нас», более подробно знакомящий с миссией, ценностями и командой Alfa Digital, с системой координат компании, а так же с её офисами. Предполагается, что такая информация заинтересует потенциальных соискателей на должности Alfa Digital. Данный раздел прорабатывал один из UX/UI-дизайнеров команды.

Страница «вакансии»

Данную страницу проектировал тот же UX/UI-дизайнер, что и страницу «О нас». Ранее поиск вакансий осуществлялся преимущественно с помощью большого количества тегов, картинки к вакансиям генерировались рандомно из пула изображений, из описания в вакансиях были только названия должностей, эти решения доставляли неудобство пользователям в поиске вакансий.
‍
Было решено в начале страницы в первую очередь заинтересовать пользователя в работе именно в Alfa Digital, отметить все возможные форматы работы, чтобы расширить ЦА и повысить отклик, а также подсветить различные плюшки работы в банке. Сами карточки вакансий стали спокойнее и информативнее, была проработана фильтрация вакансий. В конце страницы появилась форма отклика, если подходящей вакансии пока нет, чтобы не потерять ни одного ценного специалиста.

До

После

Страница «мероприятия»

Ранее страница представляла собой бесконечный скролл с визуально неконсистентными и часто не ассоциирующимися с брендом карточками мероприятий, без возможности искать и фильтровать события.
‍
Мною было решено добавить поле поиска и фильтры по годам, темам и городам для удобства пользования, а так же фильтр событий для сотрудников Alfa Digital. Карточки мероприятий стали консистентными и ассоциирующимися с брендом. Мною было так же предложено поменять описание и внутреннюю страницу прошедшего мероприятия, так как прошлый текст, зазывающий на событие, перестал быть актуальным, вместо него логичнее разместить результаты мероприятия (доклады, фотографии и проч.), взятые из DevRel-дайджеста. Таким образом, в разделе «дайджесты», на наш взгляд, нет больше необходимости, информацию из них можно найти либо в блоке о продуктах на главной странице (про обновления), либо в разделе «Мероприятия».

До

После

Страница «блог»

Ранее страница представляла собой бесконечный скролл преимущественно карточек-ссылок на статьи на Хабре, хотя иногда появлялись выпуски подкаста Alfa Digital «из бэклога», пользователю было крайне неудобно находить последние среди длинного списка статей.
‍
Мною было решено подкаст Alfa Digital вывести в отдельный блок и предоставить пользователю на выбор ссылки на все ресурсы, где опубликованы серии «из бэклога». Пестрые картинки слишком перетягивали на себя внимание, я постаралась сделать карточки статей максимально спокойными и минималистичными, чтобы пользователь больше концентрировался на теме и описании статьи.

До

После

Адаптив под мобильное устройство

Каждый UX/UI-дизайнер делал адаптив блока / блоков, редизайн которых осуществлял. Например, я была ответственна за редизайн разделов «Мероприятия» и «Блог».

Результат

За 12 календарных дней мы командой из четырёх UX/UI-дизайнеров осуществили редизайн сайта Alfa Digital, убрали однотипное оформление разделов и добавили в каждый из них UI-изюминку, стараясь максимально сохранить стилистику бренда.

‍

Му улучшили UX, теперь на сайте стало проще ориентироваться и совершать целевые действия, пользуясь, при необходимости, удобными фильтрами, которых ранее по большей части не было.

‍

Добавили информацию о компании, её системе координат, о команде и о преимуществах работы в Альфе, чтобы поближе познакомить внешних пользователей (в том числе и соискателей) с сообществом и, возможно, заинтересовать их в дальнейшем сотрудничестве с Alfa Digital.

Просто свяжитесь со мной в Telegram

@ChristinaShatskikh