Дизайн корпоративного сайта для cloudtech-компании с 30+ посадочными страницами

Главное о кейсе

EdgeЦентр — это разработчик IT-решения для сложных вычислений, быстрой доставки и надёжной защиты контента. Среди продуктов — CDN, облачные сервисы, стриминговая платформа и DNS-хостинг. Компания сотрудничает с крупными заказчиками, например ВТБ, Мегафон, METRO, Lamoda или Тинькофф.

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

В начале 2023 года компания пришла к нам — чтобы полностью переупаковаться и запустить новый продукт с прицелом под маркетинг и лидогенерацию. Задача была — сделать классический корпоративный сайт с посадочными под продукты и решения.

Результаты:

— Отрисовали больше 100 уникальных иконок, которые клиент использует ещё и на офлайн-событиях. Теперь они часть корпоративной идентичности Edge.
— Сделали две версии всех продуктов — для IT-специалистов и для менеджеров. На первой больше технических деталей, характеристик и информации про настройки. На второй — сценарии использования, примеры и польза для бизнеса.
— Подготовили 6 страниц решений, 10 продуктов и 17 подпродуктов. Всё на универсальных шаблонах, чтобы заказчик мог сам добавлять новые лендинги.
— Получили позитивную обратную связь от клиента.

EdgeCenter is a developer of IT solutions for complex computing, fast delivery, and reliable content protection. Among the products are CDN, cloud services, streaming platform, and DNS hosting. The company collaborates with major clients, such as VTB, MegaFon, METRO, Lamoda, and Tinkoff.

The previous EdgeCenter website has long been outdated. The interface was difficult to perceive due to weak accents. Everything blended into one canvas. Moreover, there was a lot of unnecessary design, for example shadows, ribbons, and inconspicuous background images. There were UX problems that made it difficult to work with the website.

In early 2023, the company turned to us to completely rebrand and launch a new product with a focus on marketing and lead generation. The task was to create a classic corporate website with landing pages for products and solutions.

Results:

— We have created over 100 unique icons, which the client also uses at offline events. Now they are part of the Edge corporate identity.
— We have developed two versions of all products — for IT specialists and for managers. The first one contains more technical details, characteristics and information about settings. The second one contains usage scenarios, examples and benefits for the business.
— We have prepared 6 solution pages, 10 products and 17 sub-products. All of them have been made on universal templates so that the client will be able to add new landing pages by themselves.
— We have received positive feedback from the client.

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

У нового сайта EdgeЦентр современный, яркий и понятный дизайн. Это помогло компании отстроиться от конкурентов и сделать бренд более узнаваемым. Плюс мы выстроили понятную систему — она позволит заказчику масштабироваться и запускать новые продукты. А скоро ещё будет аналитика — и, возможно, у нас появится дополнительная работа. Будем держать в курсе.

The new EdgeCenter website has a modern, bright, and understandable design. It helped the company to stand out from competitors and make the brand more recognizable. Moreover, we have built a clear system. It will allow the client to scale and launch new products. Soon, there will be analytics.

Бизнес-задача и ее решение

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

We conducted analysis, designed the website, structured the content, and wrote the texts, and then defended the concept, drew all the layouts, and prepared them for development. And here's what we ended up with.

Крафт (мастерство), реализация, технические детали

Дизайн с продуманным UX и акцентом на 3D
Мы сделали его чище, понятнее и современнее. А чтобы визуализировать продукты — отрисовали 56 тридешек, 11 схем продуктов и больше 100 иконок. Ноль стока — всё с учётом фирменного стиля заказчика.

Очень и очень много посадочных
6 страниц решений. 10 — продуктов. И ещё 17 — подпродукты, в которые можно перейти из разделов продуктов. Все они собраны из подготовленных нами шаблонных блоков. Это было важно, чтобы быстрее отрисовать макеты и упростить разработку будущих страниц.

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

Уникальные страницы с ценами
Чтобы узнать, сколько стоит продукт в нужной конфигурации, — в разделе с ценами можно щёлкнуть на название. Дальше пользователь увидит кастомизированный контент. Если у продукта несколько тарифов — можно будет выбрать между ними. Если один — почитать, из чего он складывается.

Design with thoughtful UX and a focus on 3D
We made it cleaner, clearer, and more modern. And to visualize the products, we created 56 3D models, 11 product diagrams, and over 100 icons. There's no stock content. Everything was made in line with the client's brand style.

A lot of landing pages
There are 6 solution pages, 10 product pages, and another 17 sub-products, which can be accessed from the product sections. All of them are built from the template blocks we prepared. It was important to quickly create layouts and simplify the development of future pages.

Clear texts and segmentation for different target audiences
We reworked the page structure and built a storytelling without repetitions. Now the products have two versions — for IT specialists and for managers. The first one has more technical details, specifications, and setup information. The second one includes usage scenarios, examples, and benefits for the business. To switch between them, there are buttons at the bottom of the screen.

Unique pricing pages
To find out the cost of a product in the required configuration, in the pricing section, users can click on the product name. Then users will see customized content. If the product has several tariffs, you can choose between them. If there is only one, you can read about its components.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

У EdgeЦентра есть программа для видеоконференцсвязи и плеер, которые можно интегрировать в инфраструктуру клиента. Раньше у них был устаревший и неудобный интерфейс.

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

EdgeCenter has a video conferencing program and a player that can be integrated into the client's infrastructure. They used to have an outdated and inconvenient interface.

We aligned the products with the overall corporate style, established design principles, and reviewed UX. For example, we made the player more user-friendly by adding a familiar settings dropdown or preview frames on the timeline. And for the call program, we grouped the buttons and fit all the fields for entering the conference on a single screen. Both can be branded for any customer.

Скриншоты