2020-2025
Разработка карточек продуктов Amway
Web

О задаче

Компания Amway — международный лидер в производстве товаров для красоты, здоровья и домашнего хозяйства — столкнулся с проблемой неэффективного представления своей продукции в онлайн-каталоге. Более 500 карточек продуктов (Product Detail Pages) требовали унификации, оптимизации под мобильные устройства и соответствия современным стандартам дизайна и верстки.
Проблематика:

  • Ограничения текущего конструктора PDP: Стандартный WYSIWYG-редактор SAP Hybris не позволял реализовать сложные требования к дизайну и функционалу.
  • Отсутствие единого подхода: Разрозненность стилей и контента из старой версии сайта усложняла восприятие информации.
  • Мобильная непригодность: Карточки продуктов не были адаптированы для просмотра на мобильных устройствах, что снижало удобство использования.
Шаблоны для вкладок PDP
Библиотека элементов
Требования и рекомендации

Решение

Фаза анализа
  • Проведен сбор требований и пожеланий клиента по всем категориям продукции.
  • Проанализированы каталоги конкурентов и сайты Amway в Европе и Азии для выявления лучших практик.
  • Подготовлен Customer Journey Map (CJM) и прототипы для понимания взаимодействия пользователей с карточками продуктов.
Фаза проектирования
  • Разработан подробный гайд для создания PDP
  • Шаблоны PDP: Унифицированные шаблоны для всех категорий продукции.
  • Контентные блоки: Описание правил оформления вкладок (описание, состав, применение и т.д.).
  • Библиотека UI-компонентов: Элементы дизайна для контентных блоков.
  • Требования к медиа: Рекомендации по главным изображениям, GIF, видео и их отображению.
  • Локализация: Правила адаптации контента для разных регионов.
  • Инструкции по Hybris: Подробное руководство по работе с продуктовым кокпитом.
Фаза разработки
  • Реализован Mobile First-подход для обеспечения удобства использования на смартфонах и планшетах.
  • Разработаны и внедрены более 800 карточек продуктов для различных брендов и локализаций.
  • Использованы современные технологии:
  • Front-end: HTML, CSS, JavaScript для создания адаптивной верстки.
  • Back-end: Интеграция с SAP Hybris через REST API.
  • Версионирование: Git для управления кодовой базой.
  • Дизайн: Figma для создания макетов и компонентов.
Фаза тестирования
  • Проведено комплексное тестирование (функциональное, нагрузочное, кроссбраузерное).
  • Проверена совместимость с мобильными устройствами и браузерами.
  • Внедрена система обратной связи для сбора отзывов пользователей.

Управление

  • Методология: Hybrid (Waterfall + Kanban) с еженедельными демо для клиента.
  • Инструменты: Jira (трекинг задач с командой клиента), Яндекс Трекер (трекинг задач с внутренней командой), Git (ветка для каждой PDP), Trello для дизайн-ревью.
Команда проекта
  • Account Director: Координация коммуникаций с клиентом.
  • Project Manager: Управление процессами и планирование ресурсов.
  • Technical Director: Архитектурные решения и технический надзор.
  • Art-Director: Креативное руководство.
  • UX/UI Designer: Прототипирование и дизайн.
  • Front-end Developer: Реализация клиентской части.
  • Content Manager: Подготовка и заполнение контента.
  • QA Engineer: Тестирование и контроль качества.

Результаты

  • Единый стиль и подход: Все карточки продуктов теперь соответствуют единому гайду, что улучшило восприятие информации.
  • Мобильная оптимизация: Карточки полностью адаптированы для просмотра на мобильных устройствах.
  • Повышение конверсии: Удобный доступ к информации увеличил вовлеченность пользователей.
  • Масштабируемость: Гайд и шаблоны позволяют быстро добавлять новые продукты без потери качества.
  • Обширная поддержка: Команда обеспечила постоянную поддержку и актуализацию контента.
Ключевые метрики успеха:
  • +40% рост времени взаимодействия с карточками продуктов.
  • 90% положительных отзывов от пользователей о новом формате PDP.
  • Снижение времени загрузки страниц на 30% благодаря оптимизации.
Контакты
+7 927 728-08-27
personalartru@gmail.com
This site was made on Tilda — a website builder that helps to create a website without any code
Create a website