Карта Метро Москвы и всего мира для Android

    ГЛАВА 1. Амбиции


    Конец февраля 2018



    Мы, как адепты идеологии свободного ПО и свободного рынка считаем, что монополия — это плохо.

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

    Команда: в разное время от 2х до 4х человек.

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

    ГЛАВА 2. Маршрут во мраке


    Март – июнь 2018.

    Нужна карта. Берем SVG, пихаем в SVGView, все отлично. Лагает ужасно, но мы радостные. Как рисовать отдельные маршруты? Никто не знает.

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

    К тому же нам было нужно, чтобы приложение работало как можно быстрее. Использование WebView сразу отпадает, нужна GL-поверхность. Решили попробовать с SurfaceView (opengl поверхность, которую можно использовать как канвас) – всё не то. Она может производить изменения внутри себя, мигая черным цветом, так как она просто плохо реализована и не может выдержать нагрузку больше отрисовки кубика 20х20. Она может увеличиваться, пропадая через раз. Нам нужно было другое решение, но такое, которое было бы не так далеко от SurfaceView, так как по интерфейсу нам она полностью подходила.

    image
    Вкратце про баги драйверов на Android

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

    У нас до сих пор оставались ошибки синхронизации потоков и настройки вьюшек в виде нечитаемых ошибок сегментации, но это было уже лучше, чем черное мигающее пятно. Соответственно, любое использование View не так, как оно должно быть, заставляет переопределять практически все методы самой View. Особенно это было проблематично с TextureView потому что этот компонент состоит из 2 частей: View и Surface. Друг без друга не могут, но в то же время могут просто не прислать событие о смерти Surface внутрь View, из-за чего приходится делать ручные проверки практически после каждого действия.

    Проблемы начались когда нам пришлось увеличить вьюшку. Канвас рисует все попиксельно, поэтому если мы указываем размер 400х400, то элементы от 0 до 400 будет видно, а за пределами — нет. 400 — очень мало, реально нам нужна карта около 5000х5600 пикселей на хороших устройствах. Но как вместить 5000х5600 на экране 1920х1080 (16:9)?

    Мы создаем канвас-карту с размером и масштабом, которые будут увеличиваться с разрешением экрана, и уменьшаться с уменьшением разрешения экрана. Таким образом мы решили проблему очень больших и криво отрисованных карт на устройствах с большим экраном и слишком мелких карт на маленьких экранах.

    Когда мы начали тестить карту, оказалось, что на телефонах с одинаковым разрешением карта отображается по-разному. Ну как по-разному: на одном отображается, на втором белое/черное пятно. Логи ведут на баг-трекер Qualcomm на баг с чипами Adreno 330/300 со статусом ‘wontfix’. Замечательно.

    Единственный способ победить этот баг — на телефонах с определенным видеочипом занижать размер карты, чтобы не было белого квадрата вместо карты. Но как мы узнаем модель видеочипа? Мы должны создать GLSurfaceView размером 1х1 пиксель при старте приложения, получить с нее информацию о видеочипе и только потом рисовать карту.

    “- Но это же костыль.” Да, это костыль. Это костыль галактического масштаба, но это лучше, чем вырезать большое количество устройств и надеяться, что Qualcomm пофиксит баг своих драйверов и разошлет обнову всем ОЕМ, чтобы мы могли пользоваться картой на телефонах с этими кривыми драйверами. Спасибо нашим пользователям, мы смогли найти решение, которое работает на всех устройствах.

    image
    Мы строили, строили и наконец построили!

    Также очень интересной задачей было наслоение элементов. Из-за того, что красная ветка должна рисоваться поверх зеленой, зеленая поверх синей, желтая поверх красной и тд, мы ввели номера слоев, и наше (с первого взгляда простое) приложение стало похоже на Adobe Photoshop :)

    Определились с тем как рисовать маршруты. Теперь нужно было решить, как находить оптимальные среди них. Для поиска всех путей между вершинами используем алгоритм Флойда-Уоршалла, для поиска самого короткого пути используется алгоритм Дейкстры, для альтернативных путей алгоритм Йена. Кому интересны подробности, задавайте вопросы в комментариях.

    ГЛАВА 3. Маршрут в лучах солнца


    Июнь – Декабрь 2018

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

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

    image

    Всего мы добавили 10 городов: Санкт Петербург, Барселона, Прага, Баку, Казань, Киев, Минск, Нижний Новгород, Самара, Новосибирск. В разработке карты метро Парижа и Нью-Йорка, в планах — весь мир.

    В июле был развёрнут бекенд для обновления информации о станциях и быстрого апдейта карт.

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

    Январь – Март 2019

    Проведя порядка 10 экспериментов со страницей приложение в google play и потратив 18 (!) тысяч рублей на маркетинг, мы вывели приложения в топ 3 google play по запросам «метро» и «метро москвы».

    В марте была опубликована iOS версия приложения, которая также успешно заняла место в топ 5 app store по запросу “метро москвы”.

    Скачать Android: Метро Москвы – схемы станций, маршруты, выходы
    Скачать iOS: Метро Москвы + схемы станций
    Involta
    62,46
    Это про бизнес в IT
    Поделиться публикацией

    Комментарии 63

      +6
      Статья начинается с этого «Огромному количеству людей требуется удобная и быстрая навигация в метро. Странно, что нет ни одного достойного конкурента приложения Яндекс.Метро. Мы решили создать его сами, занимаясь этим в свободное время как хобби.»

      После прочтения остался вопрос: в чем же Ваше приложение удобнее и быстрее Я.Метро? Текст какой-то очень сумбурный и непонятно о чем именно должен повествовать, просто какие-то обрывки.
        +4
        Ни разу не доводилось пользоваться картами метро, но как минимум один плюс могу назвать не глядя — это не яндекс.
          +1

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

            0
            Здравствуйте! Такая функция у нас тоже есть.
            Вы уже попробовали воспользоваться нашим приложением? Поделитесь впечатлениями?
              0
              Так нет же. Не Дефолт Сити.

              PS: Визуально лучше, чем тоненькие линии у Яндекса. Но зачем при клике спрашивать, Отсюда или сюда? В идеале нужно предполагать, а если что — допускать уточнение по долгому нажатию.
                0
                Да и мы не из Мск :) Фичу обсудим, протестируем!
              +1

              Мне очень нравилась pMetro, ещё задолго до засилья смартфонов (с самого начала нулевых) — если бы она не была завязана на Windows, её бы потянул любой смартфон, а концепция обновления/добавления схем до сих пор меня приводит в восторг, равно как и 3D-модели станций с краткой справочной информацией. Жаль, автор отказался от идеи портирования на мобильные платформы. Не последней деталью, радующей меня является её размер ("установщик программы cо всеми схемами (16.0 Мб)" — цитата с сайта).

              0
              Что плохого в том, что приложение от «Яндекса» (любой другой конторы), если оно хорошее?
                0

                Монополией. Тем, что если кому-то нужны схемы метро — будут пользоваться Яндекс.Метро за неимением альтернатив. А это значит огромная пользовательская база.
                В пределах компании Яндекс это может привести к не очень ожидаемым последствиям.
                Пример для ознакомления:
                https://habr.com/ru/post/249747/

                  0
                  Как на iOS, так для Андроида, есть качественная альтернатива Яндекс Метро. На iOS приложение называется Метро Москвы. Так что о какой монополии идет речь — неясно.
                    0
                    Альтернативы с таким же успехом могут сливать такую же (или иную) информацию. Для меня, как для пользователя, приложение Яндекса удобное и искать альтернативы смысла нет (ну собирают что-то там, пофиг), тут в статье ни о каких преимуществах речи тоже не идет.
                      0
                      Схемы станций — преимущество очень важное.
                        0
                        Судя по скринам эти схемы — перегружены визуально и читаются очень плохо. Необходимости в схемах станций (а как следствие выделять их наличие как преимущество, тем более очень важное) не вижу. Как и окружение, которое успел опросить — из моей выборки 8 человек не поняло зачем это надо, когда на картах 2gis и так показаны номера выходов, а на самих станциях ориентироваться проще непосредственно по указателям на станциях.

                        Я не пытаюсь сказать, что приложение плохое или ненужное, я просто не понимаю, почему в статье не описано никаких преимуществ или технических моментов интересных.
                          0
                          Фича, скорее всего и правда не массовая, но я вот тот пользователь, которому нужны схемы станций. Предпочитаю не тупить под указателями, а еще в поезде понять, в какую сторону идти к выходу/переходу. Пятнадцать лет назад пользовался pMetro, потом «pMetro для Андроид», потом «Метро и МЦК...» теперь вот это.
                          Вы еще писали про покупки в приложении. Вот меня они сами по себе не смущают, а что смущает — это покупка темной темы по подписке.
                      0
                      Все так, скандалы с использованием данных в руках крупных агрегаторов (яндекс, гугл, фб) каждый месяц звучат в инфопространстве.
                  0
                  Из того, что отмечает команда:
                  — лучше работает на медленных устройствах
                  — красивее и удобнее сама карта, это карта Лебедева, привычная (идентична тому, что используется в вагонах)
                  — возможность иметь одно приложение для всех городов (реализовано частично)
                  — UI\UX лучше. Сложно описать в чем конкретно, но по оценке пользователей можно понять, за кого голосует большинство ;)
                    0
                    По UI вопросов нет — карта Лебедева рулит. А вот UX… было бы гораздо удобнее выбирать станцию простым касанием, а схему станции — открывать долгим. В идеале — чтобы такое поведение настраивалось, поскольку иначе новые пользователи даже не узнают про схемы станций.
                  +1
                  "Метро Москвы"

                  Метро нескольких городов и стран

                  Логично.

                    +3
                    Максимум функционала сделано для метро Москвы (схемы, вагоны), а кроме того есть более 10 других городов разных стран.
                    Кроме того, такое название выбрано в угоду ASO :) Следующим этапом мы расскажем о том, как название и «иконка» могут поднять кол-во органических инсталлов в разы.
                    0
                    1. Кто-нибудь знает, что за эпический мифический сюжет на КДПВ и какое он имеет отношение к теме?
                    2. Не знаю, как на Андроиде, а для iOS, кроме Яндекса, есть «Метро Москвы». О какой монополии речь-то?
                      0

                      Тут и написано про "Метро Москвы" же. :)

                        0
                        Нет. Тут написано про «Метро Москвы + схемы станций»
                          0

                          А вы про "ГУП Московский Метрополитен"?


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

                            0
                            К сожалению, таковы реалии ASO. Брендовые или доносящие суть названия не поднимаются высоко в выдаче магазинов
                        0
                        1. Давид и Голиаф. Отношение понятно: маленький да удаленький заваливает гиганта.
                          0
                          100к+ установок и платный контент против 10кк+ установок без платного контента. Точно заваливает? Разве что в воображении создателей)
                            0
                            Мы ещё только раскручиваем пращу :)

                            Не очень понятна Ваша мысль про платный и бесплатный контент.
                              0
                              Очень просто: на страничке в гуглплее у ЯМетро нет in-app'ов, у вас — есть. Зачем они нужны в карте метро — мне непонятно и выяснять через установку желания тоже нет.
                                +1
                                Для того чтобы у пользователя была возможность поддержать разработчиков.
                                  0
                                  Пользователь (Я) видит в магазине наличие покупок в простом приложении со схемами метро и скорее всего думает, что схемы эти или количество построений маршрута — за деньги. Устанавливать не захочет.
                                    +1
                                    Давид Неизвестный: я крут! Я вам легко завалю Галиафа, но есть небольшой вопрос за деньги…
                                    жюри: следующий!

                                    Это я к тому, что на начальных этапах, если это не вопрос выживания команды, лучше бы убрать эту фичу куда-нибудь в About приложения. Просто чтобы в сторе не показывалась плашка [in-app purchase], которая действительно создает впечатление, что сейчас меня будут разводить на бабло: вот тебе 2й лучший маршрут, а 1й только за деньги.

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

                                      0
                                      К сожалению, плашка показывается в любом случае, куда бы мы не запрятали эту фичу :) Но спасибо за фидбек!
                                        0

                                        Можно было бы на первое время в About оставить ссылку на донейт. А inn-app purchases убрать. Со временем (если оно действительно надо), добавить, оно запросит дополнительные разрешения при обновлении, там объяснить зачем и почему уже существующим пользователям. Кто-то уйдёт, разумеется, но для раскрутки это будет проще.

                                          0
                                          Да, опыт приложения «Метро и МЦК» показывает, что ненавязчивым донейтом вообще не пользуются. 0.001% юзеров.

                                          Мы не считаем что in-app это плохо. Плохо это когда реклама неотключаемая и неконтролируемая. Если я как пользователь хочу чтобы приложение развивалось, то я понимаю, что разработчику нужны средства на это. У Яндекса написано «contains ads». Так что тут одно из двух :)

                                          Сейчас у нас уже около 100К DAU, и оно постоянно растет.
                                0
                                Давид меньше, все как на картине :)
                                А вот про платный контент — все немного не так. У нас есть возможность поддержать разработчиков, это платная функция, но при этом бесплатная версия никак(!) и ничем не ограничена. И, конечно, у нас в приложении нет рекламы. А у Яндекса есть ;)
                                  0
                                  В приложении «Метро Москвы» (Мосметро) нет никакой рекламы. И там также использована официальная схема метро.
                                    0
                                    Это приложение под андроид имеет оценку 4.2 и не очень удобно, у Яндекса 4.5, у нас 4.7
                                    А о плюсах (по нашему мнению) я рассказал чуть выше.
                                      0
                                      На iOS ситуация следующая:

                                      «Метро Москвы» — 4.8 (48 000 оценок)
                                      «Яндекс Метро» — 4.5 (16 000 оценок)
                                      Ваше — 4.6 (91 оценка)

                                      Я просто к тому, что в первом же предложении публикации заявляется о «монополии» Яндекс-метро, а это сразу же не соответствует действительности. Исходя из количества оценок, тут скорее монополия Мосметро, но вы это приложение почему-то стараетесь не замечать.
                                        0
                                        Я понял в чем дело. Изначально мы смотрели на Андроид, делали под Андроид, и статью писали про Андроид :) Конечно, под iOS у мосметро получилось сделать хорошее приложение.
                                        Но у них нет схем станций!
                                        0
                                        У вас и установок как бы в 100 раз меньше, при такой разнице говорить о превосходстве в 0.2 балла оценки, которую и ставят-то далеко не все… ну самообман что ли.
                                          –1
                                          Кроме того, мы пользуемся приложением сами и видимо плюсы и преимущества. Предлагаю установить и сравнить ;)
                                            +1
                                            Вы же понимаете, насколько нелепо это звучит?
                              +2
                              Эм, а что такого сложного изображено на этой карте, что появилась нужда в SurfaceView/TextureView? И зачем сразу рендерить карту в 5000х5600?
                              Судя по скринам — десяток линий, кружков и подписей можно чуть ли не в реалтайме рисовать/скейлить/перемещать на обычном канвасе.
                              И да — можно рисовать и за границей канваса. Просто layout, в котором лежит вьюха, делает clip по размерам вьюхи, что можно отключать через clipChildren=«false»
                                0

                                «8 минуты пешком»

                                  0
                                  Есть такая ошибка в iOS версии. Обязательно исправим в следующем обновлении. Спасибо!
                                  0

                                  О, решили сделать следующий шаг от приложения со схемами станций? То-то я смотрю, схемы знакомые. :)


                                  UPD: А, хотя похоже приложение со схемами просто выкуплено у автора.

                                    0
                                    Мы теперь вместе работаем :)
                                    0
                                    Offers in-app purchases

                                    Что вы предложите мне покупать и по какой цене?

                                      0
                                      Предложим поддерживать разработчиков :) Донат фактически.
                                      0
                                      Приложение годное, но хотелось бы возможность перейти к схемам станций прямо из построения маршрута. Вот строю я маршрут от Жулебино до Выставочной, например. Мне хотелось бы по тапу на «3 минуты пешком» увидеть схему, как мне между этими станциями придется идти. Тогда вообще огонь будет.
                                      Еще хочется видеть информацию о пандусах для чемоданов/самокатов на лестницах.
                                        0
                                        А как вы собирали информацию о времени езды между станциями? Интересно, как много это заняло времени для стольких городов?
                                          0
                                          Начальные сведения собирали по крупицам из открытых источников. А дальше колоссальный вклад внесли наши пользователи. В каждом маршруте внизу есть кнопка «сообщить об ошибке» — простой механизм обратной связи через почту. Люди пишут о неточностях, мы проверяем и вносим изменения.
                                          +1
                                          В отзывах (эппстор) пишут, что не работает без интернета, это правда?
                                            +1
                                            Нет, это неправда. Иначе приложение не имело бы никакого смысла. Весь основной функционал, включая просмотр схем станций, доступен без интернета!
                                            0
                                            Единственный способ победить этот баг — на телефонах с определенным видеочипом занижать размер карты, чтобы не было белого квадрата вместо карты. Но как мы узнаем модель видеочипа? Мы должны создать GLSurfaceView размером 1х1 пиксель при старте приложения, получить с нее информацию о видеочипе и только потом рисовать карту.

                                            Ограничение размера одной текстуры в памяти GPU — это не баг, а стандартное ограничение GL(ES): www.khronos.org/registry/OpenGL-Refpages/es2.0/xhtml/glGet.xml (ищите GL_MAX_TEXTURE_SIZE).

                                            А вот ответ Romain Guy на StackOverflow об ограничении конкретно в Android.
                                            Заявлен минимум в 2048x2048. Ну, и можно получить ограничения с помощью Canvas.getMaximumBitmapWidth() и Canvas.getMaximumBitmapHeight()

                                            Вообще статья наполнена какими-то голословными ничем не обоснованными (да и просто ошибочными) утверждениями об Android. Например, утверждение по поводу того, что SurfaceView
                                            не может выдержать нагрузку больше отрисовки кубика 20х20
                                            — ложь. TextureView не может быть эффективнее SurfaceView хотя бы согласно официальной документации.
                                              0
                                              От «Горьковской» до «Владимирской» не показывает очевидный маршрут: до «Достоевской» через «Сенную» и переход. Яндекс показывает. И еще визуально черный цвет на станциях пересадок выглядит чужеродным, черный — он же для шрифта надписей. Про обязательный выбор «Отсюда», даже если ты рядом со станцией, я уже писал (выше), надоедает. И нет указания наилучшего вагона. Но в целом свежо.
                                                0
                                                Зачем в настройках «Язык», если переключение на русский ничего не меняет и все равно все написи на английском? Как выбрать другой город — перерыл все, но единожды выбрав Москву не могу переключиться на другой… Ну и «подписка», ПОДПИСКА на карты метро — это безумие какое-то. Сделайте платный про-аккаунт за 1-2 бакса, если кому-то так темная тема нужна — купят. Но подписка… ох.
                                                  0
                                                  А вот station layout поверх карт OSM — это шикарно! за это лайк. Еще бы масштаб там менять можно было — был бы большой ЛАЙК.
                                                  +1
                                                  Выглядит отлично, если не пойдете по пути корпораций добра в сторону хочу-все-знать-куда-когда-зачем-ты-ездишь, то вообще будет замечательно. К сожалению такой путь рано или поздно выбирает большинство команд-разработчиков =(

                                                  Из конструктивных предложений: очень понравилась возможность поделиться маршрутом отправив его в телеграм или куда-нибудь еще. Полезно, когда нужно снавигировать человека у которого нет приложения. Но реализация довольно неудобная — просто список станций очень сложно использовать даже человеку хорошо знающему все станции и пересадки.
                                                  У вас:
                                                  Менделеевская > Цветной Бульвар > Чеховская > Боровицкая > Арбатская > Смоленская > Киевская > Парк Победы > Славянский Бульвар (24 min)

                                                  Хотелось бы:
                                                  1. Менделеевская > Боровицкая
                                                  2. переход на Арбатско-покровскую ветку (синяя), ст. Арбатская
                                                  3. Арбатская > Славянский Бульвар
                                                  время в пути: 24 минуты
                                                    0
                                                    Пожелания примем, а я прокомментирую про «корпорации добра» — чем больше людей будут донатить и по копеечке покупать подписку, тем меньше вероятность что придется включать хотя-бы рекламу. Но, откровенно говоря, донатят мало. Стримерам донатят больше)
                                                    0

                                                    Хотел бы высказать своё видение некоторых аспектов работы с подобными программами:


                                                    1. Желательно иметь настройку, позволяющую занести "любимые" станции (дом/учёба/работа/...) для быстрого выбора в "откуда" и "куда"
                                                    2. Желательно уметь определять ближайшую станцию, и для простоты, сгруппировать её с "любимыми"
                                                    3. Ввод станций по названию/фрагменту названия (ну, не знаю я, даже примерно, где искать станцию "Центросоюзный бульвар", а ехать надо)...
                                                      +1
                                                      Спасибо за статью, очень интересно! Ваше приложение оч быстро запускается, в отличии от МосМетро, и на мой взгляд чуточку быстрее яндекса, это несомненно плюс. Так же хотел бы вам предложить идею: если на станции куда мне надо ехать есть пересадочные станции, то мне бы хотелось не строить маршрут до каждой станции отдельно, а выбрать все вместе (вроде Курская/Курская/Чкаловская) и чтоб отобразился оптимальный маршрут до этого узла. Спасибо
                                                        0
                                                        Тестировал в Киеве.
                                                        — Приложение называется Метро Москвы, хотя там не только Москва — странно, путает.
                                                        — Нет времени работы станций — в Яндекс.Метро есть, Гугл-карты — учитывают это время при расчете маршрута.
                                                        — Не предлагает удобный вагон — Яндекс предлагает.
                                                        — Неверно показывает время движения между станциями — Яндекс.Метро тоже не верно, но ближе к реальности.
                                                        — Не учитывает расписание поездов — Яндекс тоже не учитывает. Это была бы классная фича, сейчас считает, что круглосуточно одно и то же расписание. Гугл-карты — учитывают.
                                                        — Не хватает схемы станций, пересадок и выходов — в Яндексе тоже нет.
                                                        Смысла для киевлян на данном этапе мало — т.к. всего 3 ветки, то схему и так более-менее все знают, а остальная информация отсутствует или ошибочна.

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

                                                        Самое читаемое