За 2 недели запустили конструктор часов Чайкина для выставки в Женеве

Константин Чайкин – звезда часового искусства, при этом он не только основатель признанной международным сообществом мануфактуры, но и член Международной Академии независимых часовщиков (AHCI), заслуженный изобретатель РФ, владеющий 94 патентами в области часовой механики - это самое большое количество изобретений у одного часового мастера в мире.

Он – первый и единственный в России получил награду самого престижного международного конкурса, Женевского Гран-при высокого часового искусства - за часы "Клоун" из серии "ристмонов" (так называемых монстров на запястье, часов с лицом живого существа, начало которым положил "Джокер"), а цена одной модели начинается от 30 000 евро.

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

Ежегодно весной Женева становится центром внимания любителей часов со всего мира, ведь здесь проходит крупнейшая выставка. При подготовке к выставке команда бренда приняла решение обновить сервис, после чего команде Kaizen была поставлена задача на срочный запуск.

Сразу про результаты проекта

– Запустили сервис за 14 дней, успели до начала Женевской выставки

– Сделали удобную мобильную версию

– Увеличили производительность и скорость работы сервиса за счет выбора Next.js

– Сделали PaaS-first сервис и масштабировали его в тех регионах, где проходили выставки

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

Мы начали с Desk Research, пошли смотреть конфигураторы Rolex, мебельные и кухонные конструкторы, чтобы понять, какие решения могут работать лучше всего для упрощения пользовательского опыта. Объединив минимальный бенчмаркинг с базовыми законами UX – эвристиками Нильсена, мы вывели несколько тезисов относительно того, что мы поменяем в UX.

Тезис 1. Меньше кликов

Чтобы выбрать группу деталей, отдельную деталь, добраться до палитры выбора цвета и вернуться в исходное меню, требовалось сделать 4 клика. Мы предложили спрятать всё боковое меню в гармошку, а палитру вынести слева от пунктов, как в Figma, чтобы переключение между деталями часов происходило понятно и быстро.

Тезис 2. Полезные джобы (Job stories)

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

Также обратная связь от пользователей и опыт бренда говорили о том, что кодировка цвета в HEX не используется на производстве и не так широко известна покупателем часов. В этой сфере превалирует палитра Pantone. Поэтому в пользовательские сценарии мы добавили вывод цвета в формате Pantone – он должен автоматически конвертироваться из HEX.

Тезис 3. Удобная мобильная версия

Мобильная версия особенно актуальна для выставок и мероприятий, на которых пользователи только знакомятся с брендом. Мы пересобрали всю мобилку, но можно отметить основные изменения:

1) Делаем акцент на часах – увеличиваем их изображение

2) Избавляемся от кликов при изменении ракурса, меняем большинство кликов на свайпы

3) Фиксируем картинку часов на всех экранах - вы видите их всегда: выбираете ли вы деталь, меняете цвет или оставляете заявку

Традиционно для разработки веб-сервисов мы выбираем Next.js. Это относительно молодая, но убийственная технология. Более подробный обзор технологии вы можете посмотреть в моем телеграмм канале

– Загрузка приложений происходит значительно быстрее, чем аналогов, разработанных на чистом React. Это достигается благодаря встроенному рендерингу на сторону сервера.

– Имеются собственные плагины для работы именно с Next.js. Их наличие позволяет адаптировать рабочую среду полностью под ваши запросы.

– Может поддерживаться разработчиками на React, а их на рынке очень много.

С учетом географии выставок, на которых сервис будет использоваться, мы сделали PaaS-first сервис и масштабировали его в тех регионах, где проходили мероприятия. Первая была в Дубае – мы, кроме обычной точки присутствия в Европе, развернули и в Дубае несколько инстансов приложения. По мере снижения нагрузки мы автоматически отключали дополнительные зоны.

Разработать сервис мы успели всего за 1,5 недели при плотном взаимодействии менеджмента, разработчиков и команды заказчика. В условиях сжатых сроков мы взяли обязательство отчитываться о статусе перед заказчиком каждый вечер в формате коротких Loom и сверкой с планом задач.

В назначенную дату мы выпустили полностью работающий продукт, включая все необходимое:

– Плавная и быстрая работа интерфейса, большой массив контента прогружается за 2 секунды

– Прокачанная палитра для изменения цвета с конвертацией в Pantone и функцией "используемые цвета"

– Функция "random палитра цветов", в рамках которой 0% дизайнов часов выглядит плохо

– Функция сброса всех настроек до дефолтных

– Функция экспорта картинки в хорошем качестве как с ПК, так и с телефона (рендер 20+ слоев PNG в одну картинку)

– 2 языковые версии (RU и ENG)