FitSharing — онлайн-сервис по аренде и продаже тренажеров

Главное о кейсе

БЫЛО
— Сайт посвящен аренде товаров: о том, что тренажеры можно купить, пользователь узнает только в карточке товара
— Заказ оформляется только через заявку на обратный звонок. При этом формы с заявками — это сторонние скрипты, которые тормозят сайт и постоянно всплывают перед пользователями
— На сайте мало информации, нельзя самостоятельно рассчитать стоимость тренажеров
— Сайт не интегрирован с 1С, и клиенту приходится вручную обновлять данные по товарам
— Сайт предназначен только для единоразовой конверсии — у пользователей нет мотивации заходить на него чаще

СТАЛО
— На сайте равномерно распределена информация о покупке и аренде. Пользователь может попасть в раздел «Покупка» через поисковик, каталог, карточку товара
— Тренажеры можно приобрести самостоятельно онлайн, поэтому менеджеры тратят меньше ресурсов на общение с клиентами
— Самая высокая скорость сайта среди конкурентов: его performance-показатель — 100 из 100 баллов по Lighthouse.
— Подробные описания тренажеров. В карточке товара можно рассчитать стоимость доставки. Появился фильтр товаров и онлайн-помощник выбора тренажеров
— Данные из каталога автоматически обновляются из 1С каждые 10 мин
— Сайт несет дополнительную ценность: экспертные статьи, видео-инструкции и тд.
— Глубина просмотра и среднее время на сайте выросли в 1,5 раза, количество отказов снизилось в 1,5 раза

Result
—The page depth and average time on site have increased by 1.5 times, and the bounce rate has decreased by 1.5 times
— Information about purchasing and renting is evenly distributed on the site
— Fitness equipment can be independently purchased online, reducing the resources managers spend on customer communication
— The highest site speed among competitors: its performance score is 100 out of 100, according to Lighthouse
— Detailed descriptions of fitness equipment. The cost of delivery can be calculated on the product card. A product filter and an online fitness equipment selection assistant have been added
— Data from the catalog is automatically updated from 1C every 10 minutes
— The site offers additional value: expert articles, video instructions, etc

Как проект изменил жизнь пользователей

1. Теперь пользователи могут оформлять заказы онлайн без участия менеджера (на старом сайте это можно было сделать только через заказ обратного звонка).

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

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

3. На сайте можно найти много информации про тренажеры: подробные описания, качественные фотографии, инструкции по применению — что упрощает выбор тренажера и дальнейшую работу с ним.
Также, чтобы упростить подбор товаров, на сайте появилась фильтрация товаров и помощник в подборе. Помощник выглядит так: пользователь тапает на текст «Подобрать тренажер для себя», получает список вопросов: рост, вес пользователя, бренд и тип тренажера — и после заполнения ему высвечивается набор товаров, которые подходят под его требования. (В дальнейшем планируем превратить помощника в полноценное тестирование и улучшать индивидуальный подбор тренажеров).

4. Теперь в карточке товара есть калькулятор стоимости доставки. Раньше эту информацию можно было узнать только через менеджера.

5. Наш сайт дает дополнительную пользу клиентам в их спортивных начинаниях. Вместе с командой FitSharing добавили на сайт:
— Видео-инструкции и рекомендации о том, как заниматься с разными тренажерами (например, теперь при аренде беговой дорожки, пользователю становится доступно видео и текст о том, как использовать товар);
— Блог со статьями от тренеров: о тренировках, питании, здоровье организма, тренажерах, витаминах и тд.
— У клиентов FitSharing есть доступ не только к общедоступным статьям, но и к эксклюзивным материалам: они показываются в блоге тем пользователям, у которых есть в профиле заказ на сайте FitSharing;
— Страницу под благотворительную программу «Добрые крышечки» от FitSharing: клиенты передают ненужные крышки курьерам FitSharing, компания их сдает на переработку, а полученные деньги идут в благотворительный фонд «Волонтеры в помощь детям-сиротам».

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

1. Now users can place orders online without the involvement of a manager (on the old site, this could only be done through a callback order request).

At the same time, we took into account the habits of users who prefer to order fitness equipment through a manager. We created a small icon located in the corner of the user's screen that accompanies them throughout the site — tapping it opens a widget where the user can choose any convenient method of communication with the staff: phone call, messenger, email, etc.

2. Users are not confused by the abundance of feedback forms: previously, four large windows for communicating with a manager and participating in promotions popped up in the first few seconds on the site. Now, the forms are unobtrusively distributed across the site, and for communication with the company, you can use our widget in the corner of the screen.

3. The site offers a lot of information about fitness equipment: detailed descriptions, quality photos, usage instructions — which simplifies the choice of equipment and further work with it.

Also, to simplify the selection of products, the site now features product filtering and an assistant for selection. The assistant works like this: the user taps on the text «Select a fitness machine for yourself,» receives a list of questions: height, weight of the user, brand, and type of fitness equipment — and after filling it out, a set of products that meet their requirements is displayed. (In the future, we plan to turn the assistant into a full-fledged test and improve the individual selection of fitness equipment).

4. Now there is a delivery cost calculator in the product card. Previously, this information could only be obtained through a manager.

5. Our site provides additional benefits to clients in their sports endeavors. Together with the FitSharing team, we added to the site:
— Video instructions and recommendations on how to use different fitness machines (for example, now when renting a treadmill, the user gets access to videos and texts on how to use the product);
— A blog with articles from trainers about training, nutrition, body health, fitness equipment, vitamins, etc.
— FitSharing clients have access not only to public articles but also to exclusive materials: they are shown in the blog to those users who have an order in their FitSharing profile;
— A page for the «Kind Caps» charitable program by FitSharing: clients hand over unnecessary caps to FitSharing couriers, the company recycles them, and the funds raised go to the «Volunteers Helping Orphan Children» charity fund.

These blocks make the site not just a channel for selling and buying fitness equipment but also a source of information that users can apply in their sports and daily life. In this way, we become not just one of the online stores but a helper and friend to the users.

Бизнес-задача и ее решение

FitSharing — бренд аренды тренажеров и спортивного инвентаря, у компании самый большой парк тренажеров в Москве и Санкт-Петербурге.

Нам нужно было создать для FitSharing сайт-сервис аренды и продажи тренажеров. На сайте важно было объединить два направления: аренду и продажу, и сократить число форм обратной связи — при этом не лишать пользователей привычного способа покупки.
Также перед нами стояла большая задача сделать не просто сайт, где пользователь может купить или арендовать товары, — а создать сервис, который будет сопровождать клиента по жизни в его спортивных привычках (то есть давать дополнительную пользу).

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

Решение:

1. Отразили и аренду, и покупку тренажеров.
Раньше на сайте был явный акцент на аренде и пользователь узнавал о том, что можно купить товар только в его карточке. Теперь раздел «Покупка» можно найти как через поисковик, так и через каталог сайта, карточки товаров, в блоках на главной странице.

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

2. Добавили возможность оформлять заказы самостоятельно. Благодаря чему сняли часть нагрузки с менеджеров клиента: сейчас им надо только подтверждать заказы и уточнять детали, если у пользователей возникают вопросы.

3. Провели ребрендинг. Старый логотип не вписывался в новый дизайн и выглядел устаревшим. Поэтому мы взяли инициативу в свои руки и предложили освежить айдентику: обновили логотип и дизайн вывески, буклетов, визиток, пакетов, наклеек на тренажеры. В основу визуала сайта легли линии — как идея постоянного движения. Клиент был очень доволен!

4. Сайт поможет компании привлекать новых клиентов и прокачивать лояльность текущих.

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

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

4.3 Вместе с FitSharing добавили на сайт систему лояльности и реферальную программу, которая дает бонусы за приглашенного друга. Кроме этого разработали систему с ачивками за разные действия на сайте. Например, за регистрацию или прочтение статей пользователь получает фиткоины — которые дают ему проценты скидки товара. (*Система не отражается в MVP-версии и появится на сайте чуть позже).

4.4 Добавили дополнительную пользу в виде статей от экспертов и видео-инструкций. Это заставляет пользователя возвращаться на него даже после совершения конверсионного действия. И помогает компании привлекать новых посетителей и сразу повышать доверие к бренду через экспертный контент.

4.5 Сделали сайт стильным и свежим и выстроили удобный пользовательский интерфейс. Это повышает лояльность пользователей и выделяет бренд среди конкурентов.
— Добавили больше визуалов и эффектов там, где можно вызывать положительные эмоции у пользователя (например, фото и видео в блоке «О компании»). А там, где посетителю надо узнать информацию или совершить покупку (например, в корзине или в оформлении заявки) — делали минимум акцентов: только цвета и шрифты. Чередовали такие блоки в пути пользователя, чтобы он оставался заинтересован и не терялся на важных блоках.
— Чтобы выделиться среди коллег по рынку, самостоятельно разработали анимацию линий специально под FitSharing.
— «Скидки и акции» стильно оформили на главной странице как сторисы. Те истории, которые пользователь уже просмотрел, уходят назад — а первыми теперь показываются непросмотренные акции и скидки.
— Проработали страницу с сертификатом, где пользователь может выбрать дизайн и формат сертификата: например, отправить его на почту получателю или забрать в печатном виде (*возможность не отражается в MVP-версии и появится на сайте чуть позже).
— Распределили формы обратной связи по сайту и теперь они не занимают половину экрана и не отвлекают пользователей.

5. Настроили двусторонний обмен сайта c 1C: данные по товарам автоматически выгружаются из 1С каждые 10 минут, а вся информация по заказам сразу попадает в 1С — так что клиент не тратит время на ручную актуализацию информации.

6. Оптимизировали скорость работы сайта FitSharing — performance-показатель достигает 100 из 100 баллов, по результатом тестирования десктопной версии в Lighthouse. Теперь этот сайт — самый быстрый среди топ-10 конкурентов по поисковой выдаче.
Например, если наш сайт в десктопной версии показывает уровень производительности 100 баллов в Lighthouse, то у десятки конкурентов по запросу «аренда беговой дорожки» этот показатель доходит максимум до 88 (оценивали производительность главной страницы).

***
В результате нашей работы:
— глубина просмотра увеличилась в 1,5 раза и сейчас достигает 3,5 по сравнению с 2,5 до редизайна
— среднее время на сайте выросло с 3:3 до 4:6, т.е. также увеличилось в 1,5 раза
— количество отказов также снизилось в 1,5 раза (было 13,2%, стало 9,2%)
(Сравниваем трафик из поисковых систем за неделю до запуска сайта с неделей после запуска).

FitSharing is a brand specializing in the rental and sale of fitness equipment, boasting the largest inventory of fitness machines in Moscow and Saint Petersburg.

We were tasked with creating a rental and sales service website for FitSharing. It was crucial to merge two aspects: rental and sales, and to reduce the number of feedback forms — while still preserving the conventional method of purchase for users.
Additionally, we faced the significant challenge of not just creating a website where users can buy or rent products, but to develop a service that would accompany clients throughout their sports habits (i.e., providing additional benefits).

Furthermore, we set ourselves the goal of designing the service with a fresh «sporty» design while also establishing a user-friendly interface.

Solution:

1. We reflected both the rental and purchase of fitness equipment. Previously, the site had a clear focus on rentals, and users could only learn about purchasing options on the product card. Now, the «Purchase» section can be found through search engines, the site catalog, product cards, and on the main page blocks.

We worked on making the catalog dependent on the type of service and chosen city — displaying relevant information based on location and user intentions.

2. We added the ability for users to independently place orders, thereby reducing the workload on client managers: now they only need to confirm orders and clarify details if users have questions.

3. We underwent a rebranding. The old logo did not fit the new design and looked outdated. Therefore, we took the initiative and proposed refreshing the brand identity: we updated the logo and the design of signs, brochures, business cards, packages, and stickers on the fitness equipment. The website's visual foundation was built on lines — symbolizing the idea of constant movement. The client was very pleased!

4. The site will help the company attract new clients and enhance the loyalty of existing ones.

4.1 Users accustomed to placing orders online independently are now staying on the site.

4.2 The new site will help the company attract an audience that previously might have left due to a lack of necessary information — about delivery, brand, fitness equipment, costs, etc.

4.3 Together with FitSharing, we added a loyalty system and a referral program, which offers bonuses for inviting a friend. Additionally, we developed a system with achievements for various actions on the site. For instance, by registering or reading articles, a user earns fitcoins — which provide them with discount percentages on products. (*This system is not reflected in the MVP version and will appear on the site later).

4.4 We added extra value in the form of expert articles and video instructions. This encourages users to return to the site even after completing a conversion action. It also helps the company attract new visitors and instantly build trust in the brand through expert content.

4.5 We made the site stylish and fresh and built a user-friendly interface. This enhances user loyalty and distinguishes the brand among competitors.
— We added more visuals and effects where positive emotions can be evoked in the user (for example, photos and videos in the «About the Company» block). Where visitors need to obtain information or make a purchase (for example, in the cart or when placing an order) — we made minimal accents: only colors and fonts. We alternated such blocks along the user's path to keep them interested and not lost in important sections.
— To stand out among market peers, we independently developed line animation specifically for FitSharing.
— We stylishly designed «Discounts and Promotions» on the main page as stories. Stories that the user has already viewed move to the back — and the unviewed promotions and discounts are now shown first.
— We worked on the certificate page, where users can choose the design and format of the certificate: for example, send it by mail to the recipient or pick it up in printed form (*this feature is not reflected in the MVP version and will appear on the site later).
— We distributed feedback forms across the site, and now they do not occupy half the screen and do not distract users.

5. We set up a two-way exchange with the 1C system: product data is automatically uploaded from 1C every 10 minutes, and all order information immediately enters 1C — so the client does not waste time on manual data updating.

6. We optimized the speed of the FitSharing website — the performance indicator reaches 100 out of 100 points, according to the testing results of the desktop version in Lighthouse. Now this site is the fastest among the top 10 competitors in search results.
For example, if our site in the desktop version shows a performance level of 100 points in Lighthouse, then among the top ten competitors for the query «treadmill rental,» this indicator reaches a maximum of 88 (we assessed the performance of the main page).

***
As a result of our work:
— The page depth has increased by 1.5 times and now reaches 3.5 compared to 2.5 before the redesign.
— The average time spent on the site has grown from 3 minutes 3 seconds to 4 minutes 6 seconds, which is also a 1.5-fold increase.
— The bounce rate has also decreased by 1.5 times (from 13.2% to 9.2%).
(We are comparing the traffic from search engines for the week before the site launch and the week after the launch).

Крафт (мастерство), реализация, технические детали

1. Добились показателя performance 100 из 100 баллов, по результатам тестирования десктопной версии сайта в Lighthouse.
Достигли этого за счет оптимизации скорости сайта:
— при разработке использовали React и внедрили технологию Server-Side Rendering;
— максимально оптимизировали все запросы к базе данных и реализовали умное кэширование с автоматической ревалидацией кеша с определенным интервалом;
— оптимизировали все анимации и медиафайлы (изображения и видео);
— поработали с порядком загрузки элементов на странице;
— динамически подгружаем на сайте тот контент, который можно загрузить позже (например, пользователь заходит в карточку товара, и стоимость доставки, загружается после отображения страницы);
— подключили Cloudflare: он оптимизирует и проксирует сторонние запросы к серверу через себя — то есть кэширует данные и отдает их серверу из кэша, а не напрямую — благодаря этому снижается нагрузка на сервер и повышается скорость отдачи.

2. Создали проработанный функционал аренды товаров

— Проработали систему расчета стоимости доставки товаров FitSharing.
У FitSharing цена доставки зависит от разных условий: от станции метро, адреса, удаленности от МКАДа, вида тренажера, сроков аренды, наличия аксессуаров, типа услуги (аренды или продажи) и тд. Чтобы стоимость доставки рассчитывалась корректно в калькуляторе и сразу отображалась пользователю в карточке товара, мы продумали все варианты цен и создали визуалы каждого варианта.
Также теперь калькулятор стоимости товаров на сайте «FitSharing» позволяет выбрать стоимость аренды на произвольный период — в то время как у конкурентов возможна стоимость доставки только на конкретный период: месяц, два, три и тд. При этом на разные интервалы меняются и скидки на товары.

— Проработали сложную логику распределения товаров по городам, чтобы пользователь на любом этапе мог поменять локацию и увидеть товары, доступные к аренде и покупке.
У FitSharing покупка товаров доступна по всей РФ, а вот аренда — только пока только в Москве, Санкт-Петербурге и их областях (в определенном радиусе). Поэтому на сайте мы предусмотрели все сценарии, где от локации может меняться то, какие товары и условия видит пользователь. Например, если у посетителя на этапе просмотра каталога была указана Москва — ему показывались товары доступные в Москве. А если на этапе оформления заказа пользователь изменит локацию на Санкт-Петербург, сервис предупредит его, что некоторые товары недоступны к аренде — но их можно купить. Также в корзине эти товары будут помечены как недоступные для аренды.

— В карточке одного и того же товара можно и арендовать, и купить тренажер (есть переключатель аренды и покупки). Таким образом мы сразу показываем пользователю, что у нас не обязательно покупать тренажер, а можно сначала попробовать его, взяв в аренду, а затем уже выкупить со скидкой. При этом у конкурентов, чтобы выбрать другой тип услуги — например, узнать условия по аренде, а не по покупке — надо заходить в другие разделы и в них искать нужную карточку.

— Добавили календарь аренды сапбордов, который отражает особенности ценообразования.
У FitSharing в разные дни недели разная цена на сапы. Чтобы не путать пользователя, мы добавили в карточку товара календарь, в котором визуально отразили эту особенность. Выглядит это так: пользователь нажимает в карточке товара «Выбрать даты» и ему сразу показывается календарь, в котором под каждой датой прописана цена сапа за данный день (в этом календаре пользователь отмечает нужные даты и сразу получает соответствующую цену).

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

3. Проанализировали потребности пользователей, придумали и добавили на сайт раздел с видео-инструкциями под каждый домашний тренажер.
Теперь у FitSharing есть набор записанных тренировок с тренажерами — их пользователь получает бесплатно сразу при покупке тренажера (лежат в личном кабинете). Данные материалы появились во многом благодаря проведенному нами продуктовому исследованию, где мы увидели у пользователей особую потребность в этом.

1. Achieved a performance score of 100 out of 100, according to the desktop version testing of the site in Lighthouse.
This was accomplished through optimizing the website's speed:
— Used React in development and implemented Server-Side Rendering technology.
— Maximally optimized all database queries and implemented smart caching with automatic cache revalidation at specific intervals.
— Optimized all animations and media files (images and videos).
— Worked on the order of element loading on the page.
— Dynamically load content on the site that can be loaded later (for example, when a user enters a product card, the delivery cost — and other information requiring database access — is loaded after the page is displayed).
— Connected Cloudflare: it optimizes and proxies external server requests through itself — meaning it caches data and serves it to the server from the cache, not directly — reducing server load and increasing response speed.

2. Developed a sophisticated rental functionality
— Refined the FitSharing delivery cost calculation system.

At FitSharing, delivery cost depends on various conditions: metro station, address, distance from the Moscow Ring Road, type of fitness equipment, rental duration, availability of accessories, type of service (rental or sale), etc. To ensure accurate delivery cost calculation in the calculator and immediate display to the user in the product card, we thought through all pricing options and created visuals for each.
Also, the «FitSharing» website's cost calculator now allows choosing the rental price for an arbitrary period — whereas competitors only offer delivery costs for specific periods: a month, two, three, etc. Moreover, discounts on products vary for different intervals.

— Worked on a complex logic for distributing products by cities, allowing users to change the location at any stage and see the products available for rental and purchase.

At FitSharing, product purchases are available throughout Russia, but rentals are currently only in Moscow, Saint Petersburg, and their regions (within a certain radius). Therefore, we anticipated all scenarios where the location might change what products and conditions the user sees. For example, if a visitor had Moscow specified while viewing the catalog, they would see products available in Moscow. If the user changes the location to Saint Petersburg during order placement, the service will notify them that some products are not available for rental — but can be purchased. Also, in the cart, these products will be marked as unavailable for rental.

— In the same product card, one can both rent and buy the fitness equipment (there is a switch for rental and purchase). In this way, we immediately show the user that it is not necessary to buy the equipment; it can first be tried by renting, and then purchased with a discount. Meanwhile, with competitors, to choose a different type of service — for instance, to learn about rental conditions, not purchase — one must go to other sections and search for the required card there.

— Added a paddleboard rental calendar reflecting pricing specifics.
At FitSharing, the price for paddleboards varies on different days of the week. To avoid confusing the user, we added a calendar to the product card, visually reflecting this feature. It works like this: the user clicks «Select Dates» in the product card and is immediately shown a calendar where the price for a paddleboard for each day is listed (in this calendar, the user marks the required dates and immediately gets the corresponding price).

— When saving selected rental conditions for a product, a pop-up is shown to the client, where they can customize a set of items that might be useful in addition to their product. For example, if they chose a kayak, the pop-up will include a dry bag, a life jacket, a waterproof phone case, etc. Everything the user selects from this pop-up is immediately reflected in the order total.

3. Analyzed user needs, conceived, and added a section with video instructions for each home fitness machine on the site.
FitSharing now has a set of recorded workouts with fitness machines — users receive them for free immediately upon purchasing a fitness machine (available in the personal account). These materials appeared largely thanks to our product research, where we identified a specific need for this among users.

Скриншоты

Комментарий заказчика

Компания FitSharing выражает благодарность студии Oxem за создание нового сайта FitSharing и обновление брендинга!

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

Очень порадовала гибкость и проактивность команды: она не только подстраивалась под изменяющиеся требования к проекту, но и самостоятельно предлагала наиболее оптимальные решения по функционалу. Если в процессе работы над сайтом у нас возникали вопросы или спорные моменты, мы обязательно собирались на созвон, где всегда погружались в проблему и вместе находили решение.
Также мы были приятно удивлены новому брендингу, предложенному ребятами из Oxem, хотя изначально мы не планировали его менять.

Мы очень довольны обновленным сайтом! Уже получили похвалу от коллег по рынку и даже от конкурентов.