Реализация сайта онлайн-фотошколы Picacademy

Запрограммировалиин сайт интерактивных видеоуроков тестов и домашних заданий по фотографии.

Сроки и цены

Срок до запуска 6 месяцев

Технологии

Бэкенд Ruby on Rails, activeadmin

Команда

CEO Рома Лапин Разработчики Пётр Сергеев Кирилл Рагозин

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

Picademy.ru — это интерактивные видеоуроки, тесты и домашние задания вместе с личным преподавателем. Именно вокруг такого видения строился весь функционал проекта.

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

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

Организация работы

До старта проекта на руках у нас было общее ТЗ и уже готовые psd шаблоны. Работу с заказчиками мы организовывали на базе проекта в basecamp, куда были подключены все участники проекта со всех сторон: наши разработчики и привлеченный верстальщик, дизайнер и непосредственно основатели проекта, Валера и Эркин.

Начали работу с того, что преобразовали ТЗ в блоки задач, с которыми уже можно было адекватно работать с точки зрения обсуждений, планирования, уточнений и приоритизации. Эти задачи мы обычно раскидываем на разные todo-листы, чтобы произвести оценки. Общение сразу шло в basecamp и через периодические skype-созвоны. В результате мы получили roadmap разработки проекта на ближайшие два месяца, согласовали сроки и цены, приступили к работе. Верстка была запущена в производство одновременно с программированием и по мере готовности поступала к разработчикам.

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

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

Проблемы и решения

Несмотря на удачный исход (проект запущен, клиент до сих пор сотрудничает с нами по поддержке и развитию проекта), в ходе работы мы совершили ряд ошибок, которые хочется еще раз проанализировать, вот самые крупные из них.

  • разное понимание того, какой функционал должен был быть выполнен в рамках согласованных работ

В то время, как мы при работе опирались на сформированный список задач, постановка которых и содержимое было намного более детально, чем изначальный ТЗ, клиенту мы плохо донесли мысль об отказе от ТЗ, как инструмента согласования и принятия работ. В результате неоднократными были подобные ситуации: основатели проекта говорят нам, что «мы подразумевали такой-то функционал, ведь не могли же мы знать и учесть все заранее», а мы отвечали, что «именно поэтому мы прорабатывали задачи этапов, общались, уточняли, задавали вопросы». Т.е. мы думали, что зафиксировали объем работ, но на самом деле либо плохо доносили это до заказчика, либо эта мысль забывалась с течением времени.

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

  • разное отношение к изменениям в уже готовом функционале

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

  • наличие готовых материалов к моменту запуска

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

Технические детали

Проект написан на Ruby on Rails 4 с использованием целого набора gem'ов. Вот некоторые из них:

  • devise - авторизация и всяческая работа с пользователями
  • activeadmin - админка
  • carrierwave - загрузка файлов
  • delayed_job - фоновые таски
  • gibbon - работа с API Mailchimp
  • exif - чтение EXIF фотографий

Еще одна особенность проекта — использование стороннего сервиса для создания видео-лекций. Klynt — сервис для создания интерактивных видео с последующей возможностью встроить их в сайт. Изначально мы использовали их JS Api для отображения видео на странице. Но у нас была маленькая проблема — видео приходилось масштабировать, потому как в исходном состоянии оно не вписывалось в верстку страницы. Масштабирование мы сделали с помощью transform-scale. Но тут же возникло огромное количество багов, которые мы исправляли в JS библиотеках Klynt руками. Здесь же возникла проблема с тем, что мы во всех видео подгружали эти библиотеки, а Klynt постоянно обновлялся. И в итоге все ломалось. Итоговое решение оказалось довольно простым — использовать iframe. Масштабирование div вокруг этого iframe никаких проблем почти не вызывает. Так же хочется упомянуть, что для отдачи видео файлов используется модуль nginx mp4.

Текущая работа

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

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

И вот такой отзыв оставил нам Эркин Бекмирзаев, один из основателей проекта:

Мы долго искали разработчиков для нашего проекта, прошли через несколько стадий. Первая — самая печальная, когда мы заключили договор с небольшой студией, еще не имея опыта в ведении подобных проектов. Естественно, ничего путного из этого не вышло, и сделанный сайт мы попросту выкинули в помойку. Потом мы долгое время искали техлида, собеседовали людей, но, как всегда бывает, выплыли к совершенно другому берегу — начали работать с Evercode. В общем и целом, работать с ребятами было приятно, они очень часто шли нам навстречу, старались быть рядом. Главный итог — сайт мы запустили, проект задышал, пользователи есть. Хотелось бы отметить возможность по-человечески решать проблемы, а не в формате совсем уж высушенных деловых отношений. Радует, что парни всегда в скайпе и на телефоне, так что многие вещи решаются достаточно оперативно. Естественно, были кризисные моменты, когда обе стороны упирались. Были моменты некоторого недопонимания, несостыковки в планах. Но если учесть формат работы (полностью виртуальный), было бы странно, если бы их не было. В итоге ребята всегда были готовы к диалогу, и мы всякий раз приходили к компромиссу, за что им спасибо. Могу спокойно посоветовать их любым другим страждущим :)

Эркин Бекмирзаев picademy.ru

Evercode Lab

Close