Yoke Vans
E-commerce платформа для продажи стеллажей для фургонов в Великобритании
О проекте
Созданный с глубоким пониманием потребностей клиентов, Yoke Vans претерпел бесчисленное количество итераций, чтобы обеспечить бесперебойную работу от сборки до установки и повседневного использования.
Целевая аудитория
Целевая аудитория
Целевой аудиторией компании являются владельцы фургонов, которые хотят организовать пространство в своем фургоне. Так как компания пока что не занимается международными доставками, заказать наполнение для своего фургона могут только жители Великобритании.
Задачи проекта
1. Создание E-commerce веб-сайта, представляющий компанию, полный список ее товаров и их вариаций;
2. Реализация возможности оформления заказов
3. Создание личного кабинета
Информация о проекте
Команда
1 PM, 1 Design, 3 Frontend, 2 Backend, 1 QA
Основной стек
WordPress + WooCommerce
Время разработки
800 часов
Поддержка
Поддержка по сей день
Билдер товара Yoke Vans
Билдер товаров
Достаточно интересной получилась реализация билдера товара с возможностью выбора различных вариаций (от компонентов до материалов)
Фильтры Yoke Vans
Система фильтров и категорий
Особого внимания заслуживает сложная реализация категорий, атрибутов и фильтров с поэтапным выборов вариаций для пользователя
Выбор способа доставки Yoke Vans
Выбор способа доставки
Также была реализована вариативная система выбора способа доставки для различных товаров
Этапы разработки
Дизайн
Дизайн на этом проекте был предоставлен заказчиком, но какие-то компоненты дорабатывались нами. Работали на платформе Figma.
Верстка
Верстка была реализована на сборщике модулей Webpack на основных языках верстки HTML, CSS, JS с использованием различных JS-библиотек.
Для верстки применили методологию БЭМ, благодаря чему вебсайт получился грамотным по HTML-структуре.
Также благодаря оптимизации и минимизации кода на этапе верстки сайт достиг максимальных значений скорости.
Бэкенд
На этапе бэкенда была осуществлена натяжка сайта на CMS WordPress с использованием разных плагинов для реализации различных решений:
— WooCommerce как основное решение для реализации товаров, корзины, чекаута, купонов и оформленных заказов;
— YITH WooCommerce Wishlist для страницы избранных товаров;
— Klarna и Stripe для реализации платежных шлюзов;
— Contact Form 7 для контактных форм;
— Wordfence Security для безопасности и защиты от взломов — Advanced Custom Fields для кастомных полей и редактирования контента.
Но большинство решений было реализовано с помощью чистого PHP кода.
Тестирование
QA команда провела множество тестов, чтобы убедиться в корректном отображении верстки сайта и функциональных решений (добавление товаров, оформление заказа, контроль обновлений в личном кабинете).
После UI/UX тестирования также были обновлены некоторые элементы сайта для создания наилучшего пользовательского опыта.
Результаты
1. Полная реализация проекта под ключ;
2. Обновленный дизайн старого сайта;
3. Реализована возможность оформления заказа;
4. Создан личных кабинет;
5. Сайт позволил многократно увеличить продажи бизнеса.