Regard — это интернет-магазин компьютерной техники и комплектующих. Команда проекта обратилась к нам для усиления существующего IT- департамента по направлениям Frontend и QA.

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

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

Новый дизайн, актуальный и интуитивно понятный, понравился многим старым пользователям и привлек новых.

Реализация редизайна
и оптимизация для комфортного использования

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

Создание мобильной версии и адаптация web- и tab-версий нового сайта

Быстрая загрузка на мобильных устройствах

Конфигуратор — сложный для разработчиков и очень важный для клиента модуль. Он отличается огромным количеством логики и сложным визуальным представлением.

Мы начали работы с визуала. Верстка слотов не доставила особых трудностей, однако над схемой системного блока пришлось подумать. В итоге мы провернули пару трюков с HTML и CSS, которые позволили по-хитрому контролировать поведение слоев и подсветки элементов блока.

Отдельного внимания заслуживает окно выбора товара в слот. Самой тяжелой здесь оказалась реализация фильтра «Совместимо», поскольку для этого требовалось четко определить, какие изменения фильтров покажут несовместимые товары, а какие — только уточнят поиск.

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

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

Каталог конфигураций: обновление интерфейса и оптимизация

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

Для новичков в железе появилась возможность создать заявку на сборку с требованиями. Остальные пользователи могут предложить свои варианты конфигурации в комментариях.

Взаимодействие пользователей

Для работы над проектом была собрана большая продуктовая команда, которую мы дополнили и усилили экспертизой по frontend-разработке и QA.

Frontend

React
Next.js
Redux
Express
Socket.io
Stylus

Selenide
Allure
Ручное тестирование

Команда и технологии

Мы провели комплекс работ по реализации редизайна и оптимизации работы сайта интернет-магазина Regard:

на основе дизайна от AIC реализовали вёрстку и провели тестирование
реализовали систему взаимодействия пользователей
реализовали удобный и функциональный ЛК
совместно с клиентом реализовали мобильную версию сайта, оптимизировали web- и tab-версии

Результат

Команда Regard с первых встреч показала большую увлечённость проектом, а также любовь и заботу о своих пользователях. Это клиент, который прислушивается к мнению каждого участника команды. Работать с таким партнером комфортно и интересно, ведь когда ты чувствуешь его «заряженность» на результат, это даёт огромные возможности для реализации своих идей и применения лучших практик отрасли!

менеджер проекта

Юлия

Оставить заявку

Хотите такой же проект?

Регард