Сайт Websoft: как объединились инновации, технологии и комплексное представление лидера HR Tech

Websoft — ведущий Российский разработчик цифровых HR-решений, на рынке с 1999 года. Продукт компании: умная платформа для решения всех задач современного HR: управление талантами, HR-сервисы, коммуникации.

История знакомства с Websoft началась неожиданно.

В 2023 году мы впервые участвовали в Workspace Digital Awards с проектом «Современные технологии». Проект получился классный, но времени тогда катастрофически не хватало: мы загрузили только визуал, без описания, и очевидно, что не выиграли.

Зато выиграли в 2025 году, когда Елена, директор по маркетингу и PR, нашла этот проект на Workspace и написала нам в 8 вечера в Телеграм, что ей очень понравился дизайн сайта, особенно 3D! Так мы и начали сотрудничать)

Запрос был на редизайн сайта, который обновлялся так давно, что уже не отражал компанию. Всё держалось только на тексте, визуала и целостности очень не хватало.

При этом сроки были сжаты: 9 страниц с уникальным дизайном + 8 технических страниц за 1 месяц. Всё, чтобы показать новый сайт и обновленный брендинг на отраслевом мероприятии. Меньше кофе, больше макетов — примерно так выглядел наш план.

Разбили запуск на два этапа: условный MVP к событию и расширение — после. Так мы сохранили качество и уложились в сроки.

▪️ Этап 1.

Собрали ядро сайта:

— «Главная»;

— «Workspace»;

— «e-staff»;

— «Enterprise»;

— «О нас»;

— «Кейсы»;

— «Партнеры»;

— «Контакты»;

— «Websoft HCM».

Базовые технические страницы:

1. «Спасибо за подписку»;

2. «404»;

3. «Заявка отправлена».

И юридические страницы:

1. «Согласие на получение рекламных и информационных коммуникаций»;

2. «Политика конфиденциальности»;

3. «Согласие посетителя сайта на обработку персональных данных»;

4. «Принципы ценообразования»;

4. «Юридическая информация».

Главная задача заказчика — успеть к отраслевому мероприятию, чтобы презентовать новый брендинг с помощью сайта.

▪️Этап 2.

Переработали навигацию и структуру, потому что часть потребностей закрыли ещё на первом этапе. Например, вакансии интегрировали в страницу «О нас» вместо отдельного раздела. С учётом новых вводных разработали оставшиеся 10 страниц и довели сайт до финальной версии.

Для 7 подразделов страницы Websoft HCM разработали отдельные страницы:

—  «Адаптация»;

—  «Обучение»;

—  «Оценка эффективности»;

—  «Управление знаниями»;

—  «Компетенции и развитие»;

—  «Управление карьерой»;

—  «Корпоративный портал».

А также страницы для коммуникации с клиентами через сайт:

—  «Пресс-центр»;

—  «События»;

Для пресс-релиза разработали отдельную шаблонную страницу, чтобы компании было удобно загружать контент на сайт.

Websoft — тот тип заказчика, который четко понимает своё позиционирование, место на рынке и цели продукта. Поэтому бриф прошел легко: заказчик досконально знает свой продукт, а мы умеем вытаскивать из этого смыслы. Новый сайт должен был стать имиджевым — без крика «купи-купи». После погружения в специфику бизнеса основные задачи мы сформулировали так:

— Показать инновационность. Websoft внимательно следит за трендами и постоянно улучшает свой продукт. Сайт должен транслировать ту современность, которой живет компания изнутри.

— Собирать заявки. Не лидогенерация, а направление пользователя в тот момент, когда он задумывается об услуге.

— Стать механизмом коммуникации. У компании насыщенная жизнь: множество мероприятий, релизов, событий. Задача сайта — собрать всё это в одном месте и сделать так, чтобы текущие клиенты возвращались к сайту. Отсюда вытекает и простота редактирования контента как сопутствующая, но очень важная задача.

Важно было показать Websoft как вендора с продуктами в центре внимания. В их сфере цикл сделки может занимать до полутора лет, а выбор подрядчика всегда стратегический. Например, «Спортмастер» работает с Websoft уже 24 года.

Целевая аудитория сайта — представители крупных компаний: HR-специалисты, HR-эксперты, HR в IT, HR и IT-директора. Чаще всего это женщины 27–45 лет с гуманитарным складом ума, для которых важны понятность, доверие и простота взаимодействия.

Мы начали с анализа бизнеса и специфики такой узкой ниши, как HR Tech. Погружение в нишу оказалось как изучение нового языка: нужно понять термины, уловить контекст и выстроить логику. Материалов для погружения хватало:

— 2 брифа: наш и тот, что Websoft делали для брендинга;

— старый сайт, где всё же сохранилось немного актуальной информации;

— внутренние презентации о продуктах компании, на которые мы опирались больше всего;

— рейтинги и премии, в которых участвует Websoft;

— пресс-материалы и публикации, чтобы подобрать TOV сайта.

Чтобы лишний раз не отвлекать команду заказчика, мы собирали максимум информации самостоятельно: мониторили СМИ и медиа-упоминания.

После проекта мы спросили Елену, что для нее было самым ценным в работе с нами. Она ответила: «Глубокое погружение в нашу специфику — вы действительно разобрались в том, что такое HR Tech и в нашей аудитории».

Конкурентов изучали с двух сторон: смотрели тех, за кем следит сам Websoft, и дополняли список своими находками — например, интеграторами HR-платформ.

При анализе мы обращали внимание на то, как компании подают свои услуги, какой используют TOV. Самое интересное: погружаются ли в терминологию, потому что в нише много узких терминов, или оставляют только «фасад», а детали раскрывают на консультациях.

Часть наблюдений:

— большинство сайтов, естественно, многостраничные;

— у многих акцент на динамичную анимацию и «технологичность»;

— часто используются градиенты;

— информация подана довольно структурировано;

— встречаются как слабые проекты с точки зрения визуала и смыслов, так и сильные, продуманные решения.

Мы собрали подборку интересных блоков, обсудили их с заказчиком и отметили касательно внутренней работы продукта «да, это у нас есть» или «нет, этого у нас нет». С таким увесистым багажом пошли на этап прототипирования.

Схематично определили темы блоков, а дальше начались тексты. Здесь нельзя просто проанализировать конкурентов и по подобию написать текст: HR Tech слишком специфичен, продукт уникальный, а значит, формулировки нужно рассматривать под лупой.

Мы подготовили основу и пошли синхронизироваться с Еленой — директором по маркетингу и PR, и Артуром — директором по стратегии. Они включились на максимум: добавляли точные формулировки, а мы разворачивали их в тексты.

На первом этапе сделали прототипы четырёх страниц — проверили направление, убедились, что двигаемся верно, и взялись за остальные пять.

Главное правило прототипирования — не перегружать страницы, но при этом раскрыть тему. У нас получилось 9 прототипов с четкой логикой и структурой, которые уже можно было превращать в дизайн.

Если помните, сайт разрабатывался в 2 этапа: сначала ядро сайта, потом все остальные страницы. На 2 этапе схема разработки была та же: создаём структуру, пишем текст, вносим правки, делаем прототип, идём к дизайну.

Стоит сказать, что изначально у нас было подробное руководство по использованию визуальных образов. Агентство DDVB разработало для Websoft брендинг, и у нас был задан визуальный стиль.

В качестве референсов мы брали решения из продуктового дизайна. С одной стороны, у нас коммерческий сайт, с другой стороны, он должен быть имиджевый, интересный, наполненный анимацией. Информации много, а значит, предстояло грамотно расставить акценты, чтобы пользователи легко считывали контент.

В дизайне выбрали дружелюбные формы и яркие акценты — они хорошо работают для аудитории, где большинство пользователей — женщины.

Баланс между обилием 3D-графики, иконок, анимаций и текстов удалось сохранить. На созвоне с Еленой и Артуром стало понятно: мы попали в точку благодаря тому, что хорошо проанализировали ожидания. Фирменный стиль помог выдержать общую линию и собрать всё в единую систему.

Отдельный акцент сделали на странице Websoft Enterprise. Это премиальный продукт для очень крупного бизнеса, и мы подчеркнули его статус: единственная страница сайта, выполненная в тёмно-синем цвете, чтобы сразу выделяться на фоне остальных.

Логотип показан в инверсии, а 3D-элементы — в синей цветовой гамме, чтобы страница была однородной, при этом считывалась консистентно по отношению ко всему сайту.

Мы согласовали дизайн-концепцию и перешли к следующему этапу: нужно было задизайнить оставшиеся блоки страниц и взяться за дизайн всех внутренних. Рассказ о том, как строилась работа, может звучать как хаос, но на деле всё выглядело как шахматная партия.

Из-за сжатых сроков работа дальше строилась так:

— когда главная и одна внутренняя страница были согласованы, мы начали их верстать;

— параллельно дорисовывали 2 страницы и отрисовывали с нуля ещё 7 страниц;

— пока один довёрстывал сайт, второй начинал его адаптировать.

Спойлер: мы успели сдать все 9 страниц в срок, а спустя пару недель продолжили разрабатывать оставшиеся 10 страниц с новой карты сайта.

Теперь о дизайне.

Если говорить про общую стилистику, мы сделали акцент на 3D-графике. Она транслирует инновационность компании, создаёт эффект вовлечения и усиливает узнаваемость бренда, так как 3D — часть фирменного стиля заказчика.

С одной стороны, 3D — необычно для нашего взгляда, с другой — привычно, потому что мы живем в многомерном мире. Но в рамках дизайна, конечно, они всегда цепляют взгляд.

На сайте преобладает светлый фон, чтобы сделать страницы более «живыми», мы встроили акцентные фиолетовые блоки и подсветили ключевые слова в заголовках. Такое решение позволяет пользователю проще выделить главное и быстрее сложить целостную картину.

Если взглянуть на все страницы, то можно заметить, что сайт динамичный за счёт анимации. Одна из любимых анимаций нашей команды находится в блоке, где описаны преимущества Российской HR-платформы. 7 преимуществ синхронно движутся с 3D-иконками, на каждом новом преимуществе становится главной одна из 7 иконок.

Человек прокручивает страницу, взгляд скользит вправо-влево, возникает эффект вовлечённой игры. Результат — пользователь задерживается на сайте дольше, что улучшает и конверсию, и поведенческие метрики.

С бегущими логотипами партнёров мы пошли нестандартным путем. Слайдер бы «прятал» часть брендов, а нам важно было показать всех. Решение — три ряда бегущих логотипов. Блок не утяжеляет дизайн, при этом демонстрирует масштаб компании и вызывает доверие.

Рассказ «О компании» усилили цифрами. Это привычный инструмент, но мы сделали его живым: цифры расположены на плашках, а ключевая, про количество клиентов, выделена контрастным фиолетовым цветом и обращает на себя внимание. Для динамики добавили видео: с напоминанием, что Websoft — не только цифры, но ещё и люди.

В меню есть выпадающие списки, которые сделаны для удобства, быстрой навигации, ну, и чтобы не загромождать меню. Продукты тоже представлены в таком формате, но есть единственный продукт, который остался виден: enterprise, потому что это один из флагманских продуктов, на который нужно обратить внимание.

С правой стороны меню — кнопка «Обратный звонок», которая следует за пользователем при скролле и сокращает путь до заявки. А функциональный поиск решает задачу для тех, кто приходит за конкретной информацией.

И, наконец, массивный подвал. Мы превратили его в ещё один носитель фирменного стиля: логотип играет роль полноценного графического элемента, который завершает визуальный ритм сайта.

После завершения проекта мы спросили Елену — директора по маркетингу и PR Websoft, о том, что ей понравилось на этапе дизайна. Она прокомментировала нашу работу так: «Профессиональный подход к UX/UI — предложенные решения были не просто красивыми, но и функциональными. А современный дизайн повысил доверие к бренду при освещении в СМИ».

Ключевая цель сайта — представить Websoft как вендора и системно рассказать о продуктах. Поэтому каждая продуктовая страница стала самостоятельной историей.

Уникальные блоки иногда чередуются со сквозными, и при всём многообразии фирменный стиль остаётся единым и узнаваемым, несмотря на то, что это многостраничный сайт. Это дало компании сразу два преимущества: визуальное разнообразие и цельное восприятие бренда.

Websoft HCM — основной продукт. В нем собрано девять продуктов, для каждого из которых мы разработали отдельную страницу. Эта страница является как распределяющей, так и очень важной с точки зрения доверия: пользователь сразу видит преимущества в формате блочной системы и интерфейс продукта, а не просто список функций.

Страница Enterprise выполнена в тёмных цветах. Помним, что это единственная страница, которая отличается по стилю, чтобы обратить внимание на премиальность продукта.

Контент подгружается постепенно и привлекает внимание из-за анимации по скроллу. Есть белые блоки, на которые сразу падает взгляд из-за неожиданности, там прописаны самые важные тезисы. Часть информации скрыта в тултипе (всплывающая подсказка), чтобы не перегрузить сайт.

Есть отдельная страница, посвященная партнёрам. Её цель: показать важность текущих партнёров и привлечь новых, поэтому все спроектировано так, чтобы информация изучалась легко.

Здесь представлена вся партнёрская сеть. При скролле снизу показываются 3 статуса, кликнув на которые, мы легко перейдём на партнёров одного из типов. Навигация и удобство на этой странице — наше всё.

Одна из функций сайта: коммуникационная, через неё Websoft планировал общаться с клиентами и партнёрами. Ранее была проблема: новостей так много, что просто не успевали обо всём рассказать через рассылки.

Появилось 3 направления: кейсы, пресс-центр, события.

Страница кейсов выполнена в формате Tilda-потоков, чтобы сотрудники Websoft могли самостоятельно управлять кейсами и переносить их с внешнего сайта.

Пресс-центр создан в основном на zero-блоках. Есть дата релиза, которая показывает, что сайт живёт, а компания развивается. Обложка, название и лид-абзац призывают нажать на «Подробнее», где открывается внутренняя страница со своей структурой.

События также созданы с помощью zero-блоков. Фотографии событий по форме напоминают логотип Websoft и работают на узнаваемость. События разделили на 3 категории: все, анонсы, завершённые, и добавили табы-переключатели.

Такое решение делает навигацию интуитивной: пользователь сразу видит нужную категорию и не тратит время на поиск. Удобно и быстро — именно то, что нужно занятым HR-специалистам.

О компании — очень важная и необходимая страница, где рассказываем о миссии, 25-летней истории и ключевых лицах Websoft. Здесь же интегрированы вакансии и перелинковка на страницу партнёров.

Страница говорит о главном: Websoft — не интегратор и не агентство, а разработчик собственной платформы. Именно поэтому её интерфейс показывается открыто. Ценности компании подчеркнули через факты, цифры и историю, а наглядно подтвердили их при переходе к кейсам, партнёрам и продуктам.

На каждой странице сайта в меню есть кнопка «Обратный звонок», а в конце практически каждой страницы есть открытая форма для заявки. Таким образом, мы не убеждаем кричаще купить, а говорим: «Обращайтесь, если мы нужны вам».

Суммарно мы разработали 27 страниц. Сайт для Websoft получился именно таким, каким он и задумывался — современным, имиджевым и рабочим инструментом для долгосрочных коммуникаций.

Нам удалось показать инновационность компании через 3D-графику, динамичные анимации и «оживлённые» элементы интерфейса, при этом сохранить легкость восприятия.

Даже при обилии контента сайт остается чистым и интуитивным: акценты расставлены так, чтобы взгляд двигался по заданному маршруту. А для тех, кто точно знает, за какой информацией он пришел, добавили функциональный поиск и сделали удобную навигацию в меню.

Мы представили Websoft как компанию-вендора через продукты. Разработали 11 продуктовых страниц, отточили описание и пронесли фирменный стиль единой линией через весь сайт, адаптировав дизайн под целевую аудиторию бизнеса.

Сайт стал площадкой для живой коммуникации. Мы разделили новостной блок на три направления: кейсы, пресс-центр, события. Контент удобно публиковать, структура и UX работают на поисковую видимость. Всё это делает сайт инструментом, к которому возвращаются клиенты и партнёры.

Пока шла разработка сайта, мы даже успели съездить в гости к Websoft, в их московский офис. Общение на созвонах проходило так легко, что хотелось скорее пообщаться с ребятами вживую, что мы и сделали! Нам провели экскурсию по офису, мы поболтали за чашкой чая и даже провели рабочий созвон: Федор и Татьяна — основатели студии — были в офисе с Еленой и Артуром, а наша команда — в Zoom.

После завершения 1 этапа Елена поделилась своими ощущениями от проекта в целом. Мы не ожидали такой искренней реакции и поэтому было приятно вдвойне.

Спустя несколько месяцев после запуска мы спросили Елену, какой результат принёс компании новый сайт. Вот что изменилось:

▪️Поведение пользователей:

— Одна из задач редизайна заключалась в том, чтобы сайт стал основным инструментом коммуникации. После релиза у нас значительно возросла активность пользователей: клиенты и партнёры стали чаще заходить на сайт и проводить на нём больше времени.

— Улучшилась навигация и пользовательский опыт — получили положительную обратную связь от HR-директоров и руководителей IT о более интуитивном интерфейсе.

— Выросла конверсия в лиды: больше целевых обращений через формы обратной связи.

Партнёры и клиенты особенно отмечали современный дизайн, удобную структуру информации о продуктах и быструю загрузку страниц. Многие говорили, что сайт теперь лучше отражает технологичность и инновационность компании.

▪️Медийность и PR-эффект:

— Сайт стал полноценной «визитной карточкой» для журналистов — современный дизайн повысил доверие к бренду при освещении в СМИ.

— Удобная структура помогает журналистам быстрее находить нужную информацию о компании и продуктах.

— Websoft занял 1-е место в рейтинге по импортозамещению SAP SF в России и 1-е место в исследовании ТеДо — новый сайт стал важным фактором в презентации компании для аналитиков.

▪️Позиционирование:

— Сайт помогает позиционировать Websoft как технологичного лидера рынка HR Tech.

— Лучше демонстрирует масштаб компании: 25+ лет на рынке, резидент «Сколково», лидер по импортозамещению SAP.

— Поддерживает ребрендинг и обновление визуальной айдентики.

Елена резюмировала: «Новый сайт стал важной частью нашей маркетинговой экосистемы и значительно усилил нашу позицию на рынке».

Нам Websoft принес новую награду! Заняли 2-е место в конкурсе Рейтинга Рунета, категория «Информационные технологии».

В результате Websoft получил сайт, который отражает масштаб и экспертность компании, помогает выстраивать доверие с B2B-аудиторией, журналистами, жюри конкурсов и премий, и подчёркивает статус лидера в HR Tech.