Предыдущий проектСледующий проект

Лендинги для Kyivstar

https://shop.kyivstar.ua/

Киевстар — крупнейший телекоммуникационный оператор Украины, который предоставляет услуги связи и передачи данных. Компания также расширила направление бизнеса и открыла интернет-магазин на корпоративном сайте, shop.kyivstar.ua, который специализируется на смартфонах, планшетах, телефонах, телевизорах и т.д.

Компания Киевстар имеет высокие требования к качеству, поэтому был проведен тендер на выбор исполнителя, в котором участвовало более 10 компаний-разработчиков. По итогам выполнения тестового задания наша компания была признана лучшим исполнителем, и мы приступили к сотрудничеству.

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

Соблюдение гайдлайнов

Kyivstar — это уже сформированный бренд, у которого есть свой стиль. Поэтому, перед началом работ мы тщательно изучили сайт kyivstar.ua и ознакомились с брендбуком компании.

Для лендингов использовался шрифт Museo Sans. Цвет и размер заголовков с текстом соответствует гайдлайнам.

Структура страниц

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

Изображения для продуктов

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

Иконки

Пакет иконок был предоставлен компанией. Но разнообразный контент не всегда давал возможность выбора подходящей иконки из пака, поэтому часть иконок мы рисовали сами в соответствии с гайдлайнами Киевстар.

Особенности верстки

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

Анимация

При верстке лендингов мы применяли два вида CSS-анимаций: Transitions и Animations. Чтобы создать простые визуальные эффекты и плавные переходы, использовались Transitions. Для более сложных сцен были применены Animations; каждая из таких анимаций была описана с помощью @keyframes. Javascript — только для запуска анимации при скролле страницы, что дало возможность существенно снизить нагрузку на браузер при загрузке страницы.

Эффективность продаж

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

Внедрение лендингов для товаров повысило эффективность продаж и обеспечило рост количества посещений сайта, времени пребывания пользователей на сайте и объем продаж.

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

Команда проекта:

  • Дима Ремигайло
    Дима Ремигайло

    Руководитель проектов

  • Макc
    Макc

    Дизайнер

  • Юля
    Юля

    Дизайнер

  • Саша Пахолюк
    Саша Пахолюк

    Дизайнер

  • Руслан Х.
    Руслан Х.

    Front-end разработчик

  • Андрей Л.
    Андрей Л.

    Front-end разработчик

Другие наши проекты

  • Сервис KeepSnap

    Сервис KeepSnap

    Сервис продажи фотографий для профессиональных фотографов

  • Cервис HuntsPoynt

    Cервис HuntsPoynt

    HuntsPoynt - сервис для поиска работы

  • NIC.UA

    NIC.UA

    Сайт регистратора доменных имен

Оставляйте контакты и узнайте стоимость вашего проекта

Бюджет

  • 10K
  • 20K
  • 50K
  • 100K
  • 150K
  • 200K