Frontosaur помогает ставить задачи разработчикам через браузер

Постановка задачи веб-разработчикам на удалёнке сродни игре в крокодила: объясни, что хочешь, не сказав ни слова. В итоге менеджеру приходится придумывать множество способов объяснить задачу: скриншоты, записи экранов. А важно не только поставить задачу, но и проверить её.

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

Около года назад я работала менеджером интернет-проектов в отраслевом онлайн-СМИ, в котором веб-разработчики были на удалёнке (думаю, многим читающим знакома эта ситуация).

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

Звучит просто, но это приносило массу затруднений как мне, так и разработчикам: в чате было трудно найти давний скриншот, диалоги из комментариев в Trello всё равно перекочёвывали в мессенджеры, а на одном мониторе переключаться между окнами мессенджера, Trello или чата и самим интерфейсом было неудобно. Но хуже всего было увидеть сообщения вроде:

• А это где?

• Не вижу у себя такого.

• Не понимаю, о чём ты.

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

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

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

При этом с дизайнерами мы давно пользовались Invision, Figma, MarvelApp или Zeplin, и это было невероятно удобно: кликнул на экран — оставил комментарий — дизайнер увидел и отметил как выполненный — всё! Никаких скриншотов, чатов и таск-трекеров — только команда и сам интерфейс.

Вопрос «как иначе» не давал мне покоя, и в один день решение пришло. Основательно погуглив, я поняла, что на рынке есть только сервисы, которые в итоге тоже сводились к скриншотам или скринкастам. Некоторые из них существенно упрощали процесс постановки задач в таск-трекерах, например, Marker.io. Но в моём представлении это должно было выглядеть иначе:

В результате, обсудив идею со своим другом — основателем веб-студии, которому была отлично знакома боль общения с удалёнными заказчиками, — мы решили попробовать реализовать расширение, позволяющее оставлять комментарии прямо на странице. Так у нас появился pet-project, который мы делали больше для себя, чтобы стало комфортнее работать.

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

Написание кода заняло примерно неделю во внерабочее время. Так мы решили первую проблему и практически исключили скриншоты из рабочего процесса.

Вскоре выявились и минусы такого решения — сами ссылки на страницы мы всё равно скидывали в чат или Trello, плюс для появления задач URL должен был в точности совпадать с тем, на котором ставились задачи.

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

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

Поэтому мы сделали систему проектов, в каждый из которых можно было добавить нужные веб-страницы. И дать доступ к проекту удалённым разработчикам и, например, дизайнеру.

Постепенно знакомые и друзья из ИТ-сферы, которые узнавали об этой идее, просили дать доступ и им. В конечном счёте мы сделали бесплатное расширение, назвав его Frontosaur — сервис, позволяющий отметить элемент на свёрстанном интерфейсе, написать комментарий — после другие члены команды увидят его у себя в браузере.

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

Что сегодня умеет плагин:

• Отмечать задачи прямо на веб-странице ровно в той точке, которую отметил пользователь. Работает в том числе и с SPA.
• Даёт возможность комментировать поставленные задачи.
• Группировать страницы в проекты и приглашать членов команды в проект.
• Работает в Chrome, Opera и Яндекс Браузере

Прямо сейчас учим плагин интегрироваться в самые популярные таск-менеджеры.

Сайт проекта: frontosaur.com. Будем рады, если пригодится и вам!