Как сократить время разработки до двух дней — опыт участия в хакатоне RailsRumble

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


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



В мире Rails-разработчиков самым известным хакатоном считается RailsRumble, который вот уже шесть лет собирает разработчиков со всего мира и мотивирует их писать код. По правилам конкурса участники должны за 48 часов создать полностью готовое веб-приложение с оригинальной и новаторской идеей. В этом году участвовало 500 команд и более 1500 человек. Cреди них — наша команда.


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


Устроили мозговой штурм, среди вариантов несколько раз упоминались спортивные приложения. Это соответствовало нашим критериям — быть интересным не только нам, быть полезным не только для хакатона. Так появился сервис для футбольных болельщиков Sport for Social Fans. Идея простая: на одной странице автоматически собираются и обновляются все новости твоего клуба/игрока в социальных сетях. Данные подтягиваются из официальных аккаунтов и по хештегам пользователей Facebook, Twitter и Instagram.


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


Мы подготовили прототип на uxpin (сервис для коллективного создания прототипов). Он был достаточно простой — только самые основные элементы, провязки между страницами, никаких деталей и контента. На этом этапе у нас совсем не было разногласий: нам казалось, что все всё поняли, и всё работает. Все остальные сюрпризы ждали нас после начала марафона.



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


Перед началом хакатона мы отдельно проговаривали распределение ролей. Конечно, это не бином Ньютона — дизайнер занимался дизайном, а программисты кодом. Но все очень зависят друг от друга, и мы заранее постарались выстроить последовательность действий так, чтобы никого не поставить в тупик «не могу продолжать, пока Вася не закончит». У нас было большое преимущество — все ребята работают удаленно в разных частях света. За счет разницы во времени всегда есть кто-то, кто может работать, пока остальные спят. При этом никаких проблем с коммуникацией — команда сыгранная. Для связи — Basecamp для глобальных обсуждений и «многабукв», Skype для непрекращающихся разговоров.



Судили нас заслуженные народные кодеры, менеджеры, руководители стартапов и просто гики. В результате они должны были отобрать лучшие (по их мнению) десять проектов-победителей. Теоретически, это должны были быть инновационные (ну хоть чуть-чуть) приложения, которые меняют жизнь к лучшему и просветляют карму. В действительности, понять логику отбора трудно. Сейчас сложилось субъективное ощущение, что выиграли проекты более яркие визуально, при этом не обязательно технически совершенные. Например, в этом году в десятку вошла игра Llama or Alpaca – очень приятное фановое приложение с нулевым коэффициентом полезного действия.


Теперь подробнее про ошибки и как на них научиться. До начала отрисовки макета мы были полностью уверены, что на уровне планирования сделали всё, что могли. Но никогда нельзя верить этому ощущению. Да, 100% будущих ошибок нельзя заметить на уровне макета, и все же мы могли сделать их меньше, если бы приложили к макету живые данные. Или написали пользовательские сценарии, чтобы понять конкретнее, что пользователь будет хотеть от сервиса. Конечно, в сроки разработки всё равно стоит закладывать время, которое уйдет на новые уточнения и дополнения. В идеальных неземных условиях они должны быть незначительными. В реальной жизни вам, скорее всего, захочется переделать всё. Если у вас есть только 48 часов, приоритезируйте  желания и отказывайте себе во всем, кроме самого главного. Всю красоту можно будет добавить в следующих итерациях.


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


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


{ "author_name": "Konstantin Panphilov", "author_type": "editor", "tags": [], "comments": 0, "likes": 15, "favorites": 1, "is_advertisement": false, "subsite_label": "flood", "id": 2262, "is_wide": true }
00
дни
00
часы
00
мин
00
сек
(function(){ var banner = document.querySelector('.teaserSberbank'); var isAdsDisabled = document.querySelector('noad'); if (!isAdsDisabled){ var countdownTimer = null; var timerItem = document.querySelectorAll('[data-sber-timer]'); var seconds = parseInt('15388' + '59599') - now(); function now(){ return Math.round(new Date().getTime()/1000.0); } function timer() { var days = Math.floor(seconds / 24 / 60 / 60); var hoursLeft = Math.floor((seconds) - (days * 86400)); var hours = Math.floor(hoursLeft / 3600); var minutesLeft = Math.floor((hoursLeft) - (hours * 3600)); var minutes = Math.floor(minutesLeft / 60); var remainingSeconds = seconds % 60; if (days < 10) days = '0' + days; if (hours < 10) hours = '0' + hours; if (minutes < 10) minutes = '0' + minutes; if (remainingSeconds < 10) remainingSeconds = '0' + remainingSeconds; if (seconds <= 0) { clearInterval(countdownTimer); } else { timerItem[0].textContent = days; timerItem[1].textContent = hours; timerItem[2].textContent = minutes; timerItem[3].textContent = remainingSeconds; seconds -= 1; } } timer(); countdownTimer = setInterval(timer, 1000); } else { banner.style.display = 'none'; } })();

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Приложение-плацебо скачали
больше миллиона раз
Подписаться на push-уведомления