Калькулятор доставки готовой еды
Многофункциональный калькулятор доставки готовой еды для диеты по медицинским показаниям
О проекте
Целевая аудитория
Целевая аудитория
- Люди, следящие за своим питанием и здоровьем;
- Спортсмены, нуждающиеся в доставке готовой и здоровой еды;
- Люди с проблемами пищеварительной системы и диабетом;
- Желающие снизить массу тела.
Задачи проекта
1. Обновление дизайна калькулятора доставки еды на сайте.
2. Интеграция нового функционала для калькулятора: создание возможности легко выбирать параметры своего рациона, такие как калорийность, цели рациона, диетические предпочтения и день недели.
3. Улучшение пользовательского опыта: создание более удобного и интуитивного калькулятора доставки готовой еды.
4. Повышение уровня информированности пользователей и повышение конверсии и продаж благодаря интеграции нового функционала калькулятора.
5. Поддержание конкурентоспособности на рынке доставки готовой еды.
Информация о проекте
Команда
1 PM, 1 Tech Lead, 1 Frontend, 1 Backend.
Основной стек
Ruby, React, SCSS
Время разработки
99 часов
Функционал калькулятора «Польза диет»
Функционал калькулятора
В целях исполнения задачи заказчика команда OnePix существенно переработала дизайн и функционал калькулятора. Сам калькулятор визуально состоит из 4-х блоков:
1. Выбор диеты и калорий;
2. Выбор дня недели для просмотра блюд на этот день;
3. Карусель блюд с описанием;
4. Блок заказа с выбором количества дней, общей ценой и ценой за 1 день.
Мобильная версия калькулятора
Мобильная версия калькулятора
Мобильная версия почти не отличается от десктопной. Мы немного уменьшены шрифты и картинки для сохранения общего визуального стиля калькулятора.
Этапы разработки
Дизайн и верстка
Дизайн-макеты были предоставлены заказчиком. Наша задача состояла верстке стиля калькулятора согласно данным макетам. Для этого мы использовали передовые технологии фронтенда: React.js, препроцессор SCSS, бандлер Webpack.
Интеграция функционала
Наши разработчики создали новые функции и алгоритмы для обработки выбора калорийности, целей рациона, диет и дня недели. Также интегрировали систему фильтрации блюд в соответствии с выбранными параметрами.
Тестирование
Команда QA-инженеров провела тщательное тестирование верстки и функционала калькулятора. С помощью Cypress, были написаны тесты для проверки функций выбора блюд для определенной диеты.
Разворачивание проекта
Наши разработчики успешно развернули калькулятор доставки на Docker. Это позволило обеспечить изолированное и стабильное окружение для приложения, упростить управление и обслуживание, а также обеспечить консистентность работы в различных окружениях. Docker-контейнер содержал все необходимые компоненты и зависимости, что ускорило процесс разворачивания и обеспечило надежность работы калькулятора.
Результаты
1. Обновлен дизайн калькулятора, им стало намного удобнее пользоваться, что привело к улучшению пользовательского опыта;
2. Интегрирован новый функционал, благодаря чему пользователи могут с легкостью выбирать параметры своего рациона;
3. Создание калькулятора позволило значительно увеличить конверсию в заявки и обеспечить высокую конкурентоспособность заказчика.
