Map of Moscow and the whole world for Android

CHAPTER 1. Ambitions

The end of February 2018



We, as adherents of the free software and free market ideology, believe that monopoly is bad.
')
A huge number of people need convenient and fast navigation in the subway. It is strange that there is not a single worthy competitor of the Yandex.Metro application. We decided to create it ourselves, doing it in our free time as a hobby.

Team: at different times from 2 to 4 people.

The narration covers only the Android application, due to the fact that it was launched first and all the basic mechanisms were run on it. Of course, the iOS version is currently available.

CHAPTER 2. The route in the darkness

March - June 2018.

Need a map. We take SVG, we push in SVGView , everything is fine. Lying terribly, but we are joyful. How to draw separate routes? Nobody knows.

In the SVG format, there is no information about layering, an element belonging to any line, or other information that is critically necessary for constructing a route. So we came to the use of a database to store all the elements for drawing.

In addition, we needed the application to run as quickly as possible. Using WebView immediately disappears, you need a GL-surface. We decided to try with SurfaceView (opengl surface that can be used as a canvas) - it's not that. It can make changes inside itself, blinking black, as it is simply poorly implemented and can not withstand the load more than drawing a 20x20 cube. It can increase, disappearing through time. We needed a different solution, but one that would not be so far from SurfaceView, since it was fully compatible with the interface.


Briefly about driver bugs on Android

We tried the implementation on TextureView . And, oh gods, most of the problems are gone. Despite the fact that TextureView is a SurfaceView on steroids, it is normally implemented without magic bugs and epileptic seizures of the video adapter.

We still had errors of synchronization of streams and settings of views in the form of unreadable segmentation errors, but it was already better than a black blinking spot. Accordingly, any use of the View is not the way it should be, forcing to override almost all the methods of the View itself. This was especially problematic with TextureView because this component consists of 2 parts: View and Surface. They can't do without each other, but at the same time they can simply not send the event of the death of a Surface to the Inside View, which is why they have to do manual checks after almost every action.

The problems started when we had to increase the view. Canvas draws everything pixel-by-pixel, so if we specify a size of 400x400, then elements from 0 to 400 will be visible, but not outside. 400 is very small, we really need a map of about 5000x5600 pixels on good devices. But how to fit 5000x5600 on the screen 1920x1080 (16: 9)?

We create a canvas map with size and scale that will increase with screen resolution, and decrease with decreasing screen resolution. Thus, we solved the problem of very large and crookedly drawn maps on devices with a large screen and too small maps on small screens.

When we started testing the card, it turned out that on phones with the same resolution, the map is displayed differently. Well, in different ways: on one it is displayed, on the second a white / black spot. Logs lead to a Qualcomm bug tracker to a bug with Adreno 330/300 chips with the 'wontfix' status. Wonderful.

The only way to defeat this bug is to underestimate the size of the card on phones with a certain video chip so that there is no white square instead of a card. But how do we know the video chip model? We have to create a 1x1px GLSurfaceView at the start of the application, get information about the video chip from it and only then draw a map.

“- But it's a crutch.” Yes, it's a crutch. This is a galactic crutch, but it's better than cutting out a large number of devices and hoping that Qualcomm will fix the bug of its drivers and send updates to all OEMs so that we can use the card on phones with these curves drivers. Thanks to our users, we were able to find a solution that works on all devices.


We built, built and finally built!

Also a very interesting task was the layering of elements. Due to the fact that the red branch should be drawn over the green, green over the blue, yellow over the red, etc., we entered the layer numbers, and our (simple at first glance) application became similar to Adobe Photoshop :)

We decided on how to draw routes. Now it was necessary to decide how to find the best among them. To search for all paths between vertices, we use the Floyd-Worshall algorithm, to find the shortest path, use the Dijkstra algorithm, for alternative paths, the Yen algorithm. Who are interested in the details, ask questions in the comments.

CHAPTER 3. The route in the sun

June - December 2018

At this stage, we already knew what to do. Improve the product. We drew new maps, added new languages, eliminated bugs, accelerated work, screwed up features, collected user feedback and did not spend a dime on promotion of the application.

On June 15, we rolled out our application to the release, complementing it with the St. Petersburg metro map. On this map we decided to designate reservoirs and bridges. Somewhat later, Yandex showed a redesign with a similar layout of maps. Not bad, we thought.



In total, we added 10 cities: St. Petersburg, Barcelona, ​​Prague, Baku, Kazan, Kiev, Minsk, Nizhny Novgorod, Samara, Novosibirsk. In the development of the metro map of Paris and New York, the plans - the whole world.

In July, the backend was deployed to update information about the stations and quickly update maps.

In September, we already had a strong product that could be carried to the masses. At the same time, we met Nikolay, the developer of the application “Metro and MSC - station layouts”. In his application, he collected the scheme of stations that allow you to quickly navigate and find the desired output. Very cool, but this application did not allow to build a route and had an outdated design. That is why for a wider audience it turned out to be weaker than Yandex. Metro.
We agreed to implement the station schemes in our application, and the company’s management supported and funded the idea. It became a feature killer. Our users were delighted.

January - March 2019

Having spent about 10 experiments with the application page in google play and having spent 18 (!) Thousand rubles on marketing, we have put the applications in the top 3 google play at the requests of the “metro” and “metro moscow”.

In March, the iOS version of the application was published, which also successfully ranked in the top 5 app store at the request of the Moscow Metro.

Download Android: Moscow Metro - station layouts, routes, exits
Download iOS: Moscow Metro + station layouts