Войти

Или войди с помощью

DEV от МГУ Как за три дня сделать карту, которая поможет поймать всех покемонов в России

DEV от МГУ
Иван Петров avatar |
Как за три дня сделать карту, которая поможет поймать всех покемонов в России

Когда на создание сервиса остается очень мало времени.

Pokemon Go чем-то напоминает всечеловеческое помешательство. Об игре пишут, о ней снимают репортажи, влоги, создают сообщества, делятся секретами. Наконец, просто играют и ищут редких Покемонов…

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

Пораскинув мозгами, четверто ребят, объединившись в одну команду, решили создать социальную российскую карту покемонов.

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

О проекте

AP2cxREfYIM

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

Метки, рейтинг которых ниже определенного уровня, регулярно очищаются. У каждого зарегистрированного участника Pokemon Go Map, в свою очередь, есть внутренний рейтинг, который повышается при выставлении меток, а также при подтверждении выставленных им меток другими пользователями.

На текущий момент, самые активные пользователи карты находятся в Москве, Санкт Петербурге, Краснодаре, Екатеринбурге и Омске, однако мы надеемся, что это не все города, жители которых обладают умением устанавливать игры через APK и готовы гулять днями напролёт, лишь бы поймать очередного Ратата.

Основным отличием сервиса от западных и российских аналогов является то, что Pokemon Go Map не является «читом», в котором представлена заранее собранная информация об игре. Наоборот, проект направлен на поддержание игрового механизма Pokemon Go.

Основные фичи кратко:

  • Выставление собственных меток с указанием авторства
  • Актуализация меток на основе репутации
  • Геймификация (опыт за активность на карте, уровни пользователей)
  • Кластеризация меток (в обновлении 2.0)
  • Фильтрация меток (в обновлении 2.0)

Отдельно хочется отметить, что портал PokemonGoMap не нарушает условия пользовательского соглашения Niantic, так как использует только информацию, предоставленную пользователями, и продолжит существовать даже после устранения проблем с открытым API PokemonGo.

Немного о самом процессе разработки

Антон Бондаренко — выпускник МГУ, генеральный директор MalinaLab. В критических ситуациях Backend разработчик.

Леша Марченко – выпускник МГУ, исполнительный директор. В критических ситуациях Backend разработчик.

Даня Горбачев — студент МГУ, креативный центр MalinaLab. Гениальный дизайнер и Frontend разработчик.

Коля Маторин – студент МГУ, душа коллектива. Высококлассный Frontend разработчик.

PokemonGoMapIn_4

18:00–21:00 План
CoffeeCupCount: 0

Как и в случае с любым другим проектом нашей компании, я и Лёша начали с составления технического задания. Первоначально планировалось запустить портал, в котором бы содержалась вся актуальная информация об игре, однако затем мы отошли от этой идеи в пользу интерактивной карты. Мы посчитали, что было бы круто сделать надстройку над уже существующей игрой, дать игрокам возможность проявлять себя не только внутри Pokemon Go, но и в сопровождающем проекте.

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

21:00 — 0:00 Дизайн
CoffeeCupCount: 4

Как только ТЗ было готово, Даня приступил к дизайну. Было решено не перегружать проект, дабы не отвлекать игроков от основной функциональности — карты.

PokemonGoMapIn_2

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

00:00 — 11:00 Верстка, Backend
CoffeeCupCount: 12

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

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

Поначалу с бэкендом все было просто – Python + Django и авторизация через Вконтакте. Однако, уже через три дня, когда PokemonGo Map стал крупнейшим русскоязычным ресурсом данной тематики, мы поняли, что не обойтись без оптимизации на обоих сторонах: как на фронтенде, так и на бэкенде.

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

Мы также решили сделать запросы к базе более простыми и менее объемными. Тут нам на помощь пришла серверная grid-кластеризация. Осталась только одна маленькая проблема – 15 000 маркеров, разбросанных по всему СНГ, которые нужно было объединить в кластеры, причем за приемлемое время.

Мы начали с прямого поиска, но результат был удручающим. Бинарный поиск дал лучшие показатели, однако они нас все еще не устраивали. Спустя пару чашек кофе решение было найдено – интерполяционный поиск по массиву отрезков. Применение данного метода при тестировании позволило нам распределить 1400 меток по 1 000 000 квадратов всего за 76 секунд (с учетом создания объектов в базе).

PokemonGoMapIn_1

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

11:00 — 13:00 Перерыв на здоровый сон
CoffeeCupCount: 24

13:00 — 21:00 Связывание
CoffeeCupCount: 32

Связать Бэк с Фронтом – дело, как правило, несложное. И этот проект не исключение. По разработанным в процессе написания бэкэнда API мы вскоре получили работающую альфа-версию PokemonGoMap. Может показаться, что получив рабочую альфу, мы могли бы закончить на этом, но не тут то было. Нам предстоял самый важный этап.

21:00 — 9:00 Тестирование
CoffeeCupCount: за гранью добра и здравого смысла

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

В заключение

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


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

22
Логотип iPhones.ru
iPhones.ru
Когда на создание сервиса остается очень мало времени. Pokemon Go чем-то напоминает всечеловеческое помешательство. Об игре пишут, о ней снимают репортажи, влоги, создают сообщества, делятся секретами. Наконец, просто играют и ищут редких Покемонов… Да, с поиском японских зверушек не все так просто: найти действительно редкого покемона — значит хорошо походить ножками. Пораскинув мозгами, четверто ребят,...

22 комментариев

Котик
Котик
Котик
Котик
Котик
Котик
Котик
Котик
Котик
Котик
Котик
Котик
Котик из TikTok
Котик из TikTok
Котик из TikTok
Котик из TikTok
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Момент из фильма
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Мем стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Офис стикер
Видео мем
Видео мем
Видео мем
Видео мем
Видео мем
Видео мем

Какие правила в комментариях
  1. leodbro avatar
    leodbro 25 июля 2016
    5

    Хватит, пжлст!

    Войди на сайт, чтобы ответить
    Ответить
  2. rusTORK avatar
    rusTORK 25 июля 2016
    1

    Уважаемые разработчики, а если ли возможность оставить небольшой комментарий к размещаемой метке? Я например могу метку поставить на режимном объекте. Видно её будет, а пройти без пропуска никто не сможет. Надо бы это учесть (свободный ли вход на территорию или есть КПП).

    rusTORK avatar
    rusTORK25 июля 2016
    1

    @rusTORK, Кроме этого, нет возможности переместить или отредактировать свою метку (в случае если она размещена не на том доме\месте).

    Нет возможности просмотреть свои метки.

    MalinaLab avatar
    MalinaLab25 июля 2016
    1

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

    Войди на сайт, чтобы ответить
    Ответить

Нашли орфографическую ошибку в новости?

Выделите ее мышью и нажмите Ctrl+Enter.