Кейс: сайт Удостоверяющего центра Сибири

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

Как проект изменил жизнь пользователей

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

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

Задача и решение

Удостоверяющий центр Сибири — аккредитованная IT-компания, которая с 2004 года занимается разработкой собственного программного обеспечения MaskCrypto, а также оказывает полный спектр услуг по выдаче и техническому обслуживанию электронной подписи и электронного документооборота.

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

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

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

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

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

Все блоки на сайте закругленные — такой прием называют сквирклморфизмом (от англ. «squircles» — квадраты с закругленными углами). Сквирклы создают визуальную гармонию, уравновешивая резкие прямые линии квадратов и мягкость кругов. Это помогает дизайну выглядеть минималистичным и аккуратным, но при этом дружелюбным и современным. Сквирклы смотрятся органично на любых устройствах, от мобильных телефонов до настольных компьютеров.

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

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

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

Центр регулярно публикует новости и статьи о своей деятельности и событиях сферы. Встроенный на сайте редактор понятный и функциональный, поэтому упрощает управление контентом для сотрудников без технических навыков. Текст легко форматировать, добавлять изображения, видео, галереи, цитаты и ссылки. Размер изображений автоматически оптимизируется для быстрой загрузки страниц. Есть возможность добавлять статьи в различные категории и помечать тегами для облегчения навигации и улучшения SEO. Материалами можно поделиться в социальных сетях.

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

Технические детали

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

Ссылка на сайт: https://udcs.ru/