Калькулятор триатлета: от идеи к сервису

Вдохновение

Как то раз, не очень погожим утром я ехал в маршрутке и читал ленту новостей в какой-то из социальных сетей. Надо сказать, что на 95% она состоит из репостов мотивирующих высказываний  «великих людей»и фотографий фитоняшек в различных видах упражнений со штангой или айфоном. Не то, чтобы я любитель такого контента — просто его генерируют в огромном количестве группы спортивной тематики Калининграда, на кои я постарался подписался на заре развития проекта AmberSport.ru. В общем в тот день, среди 5% полезной информации с легкой руки Александра Гуляева мне на глаза попался сервис Дениса Богданова с говорящим названием «Калькулятор темпа бега». 

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

Идея

Нисколько не умаляю труд коллег по цеху, но идея сделать такой же калькулятор для бегунов показалась мне скучноватой. Проведя минимальное интервью, среди «однополчан» в офисе, оказалось, что многие триатлеты тоже составляют темповые таблицы и делают они это в MS Excel. XXI век, нанотехнологии, VR в массах и тут на тебе — Excel! Ну, тут конечная форма идеи лежала на поверхности.

Старый добрый Google подсказал, что сервисы есть, но наглядными и «прикольными» их не назовешь, а ближайший интерактивный вариант для триатлетов выглядит как-то вот так:

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

Прототипирование и концепт-дизайн

За реализацию данного проекта взялся мой коллега-падаван Олег Беляй и вскоре появился прототип интерфейса.

Прототип всех устроил, и историю проекта продолжил концепт дизайн. Первое техническое задание включало в себя готовую цветовую палитры бренда Трилайф и заготовки из UI-kit-а. Это логично, так как сервис разрабатывался именно для наших друзей из проекта trilife.ru.

Второе техническое задание на дизайн укладывалось в одно предложение, которое последнее время очень часто упоминают заказчики — «cделать как у Apple»:

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

Сервис

Спустя много-много часов разработки на JavaScript, тестирования, снова разработки и снова тестирования получился сервис, который на общем фоне в этом сегменте действительно можно назвать «прикольным» и понятным. Попробовать и потестировать beta-версию уже можно на Трилайфе. 

При тестировании вдруг оказалось, что научись я плавать по два километра на открытой воде с темпом 4:00 на 100 метров, моей рандоннерской и почти нулевой беговой подготовки мне хватит, чтобы пройти полужелезную дистанцию и уложиться в лимит времени. Меня лично это смотивировало снова сесть на велосипед и, возможно, в скором будущем я начну искать тренера по плаванию, который сможет поставить мне технику. Вот так! Может и вас он на что-то мотивирует!