Stories for Yandex.Maps
What is Yandex.Maps?
Yandex.Maps is a Russian web mapping service developed by Yandex. The service provides detailed maps of the whole world. It includes searching for locations, information about traffic jams, routing and street panoramas. The service was launched in 2004 and is the most popular cartographic service in Russia. It has about 11.5 million users in Russia per month, and over 20 million worldwide.
Discovery is the part of Yandex.Maps app which recommends users interesting places, sights or cultural events in any city in Russia. In other words it is the internal media feed about a city published by different bloggers or editors from Yandex.
My assignment
Complete redesign Discovery for the app in order to increase the number of users.
Solution
Step 1. Information gathering and problem formulation
First of all I had to formulate the problem, understand tech limitations, and describe goals. I analysed the current version of the interface: described the process of user interaction with app, found out all points of entry to Discovery. Then I made a ux research: asked a few people to perform several tasks, commenting their actions. I interviewed 6 respondents and it was enough to identify recurring problems. Script for this ux research was quite simple: I asked people to open Yandex.Maps app and find a cinema where they could watch movies in the original language. I carefully recorded all their actions. All respondents preferred to use the search box instead of the Discovery. I asked people about anther way to find a cinema but they had no idea how to do this. Then I purposefully requested them to open the Discovery and voice their thoughts and opinions. Respondents started asking me various questions like these: where did this content come from? who wrote it? why I see this content? Three respondents had never seen the Discovery in the app before and no one had ever used it to find a place on the map. I asked users to describe the purpose of the Discovery. All respondents were wrong: “Discovery is advertising blocks”, “These materials from the Discovery were based on my search history”, etc.
To confirm my hypothesis, I decided to look for previous research or analytics. I found two case studies. From the ux research conducted in Moscow in 2017 I learned that only 0.7% of all users opened at least 1 material in Discovery. Only 2% of respondents mentioned above clicked on the “Get directions”. A study of mobile users in Sochi in 2018 stated that only 44 % turned to the Discovery and 20 % opened the 1 article in the Discovery, and only 6% used the place on the map (get directions, share, call or save to bookmarks).
At this step, I formulated several hypotheses which describe the problems in Discovery:
- Majority of users are not aware of Discovery;
- There are some troubles with navigation blocks in the app: some blocks in Discovery replicate items in main menu;
- People do not understand why they get this media content, they want to personalise Discovery for their needs and requirements;
- It’s hard to view list of places on a map.
Therefore, my task will have several targets: to make Discovery more noticeable, to facilitate navigation in this part of the app, to make it possible to personalise the content from Discovery and to change the view of the pins list on the map.
Step 2. Competitor analysis
As competitors I considered several geographic information and recommendation services, such as: Google Maps, Google Trips, Google Art & Culture, 2GIS, Foursquare, Yelp, Maps me, Airbnb, Billboard and others. I tried to find the most convenient interaction patterns in these applications that could help me in finding the best solution for a new interface of Discovery.
Step 3. Prototyping
After a few paper prototypes I came up with the idea to design Discovery analogous to stories in Instagram or Facebook.
Facebook Stories are short user-generated photo or video collections that can be uploaded to the user’s Facebook. Facebook Stories were created on March 28, 2017. They are considered to be a second news feed for the social media website. It is focused around Facebook’s in-app camera which allows users to use fun filters and Snapchat-like lenses to their content as well as add visual geolocation tags to their photos and videos. The content is able to be posted publicly on the Facebook app for only 24 hours or can be sent as a direct message to a Facebook friend.
Now such format of content consumption is one of the most popular, it can be found not only in social networks, but also in banking applications and even in Yandex.Taxi app. It seems that the idea of embedding an analogue of Stories instead of the current interface, and show one material as one story, can help me solve my task. I drafted some screens on paper and showed them to my colleagues. Having received a positive response and a few valuable comments, I started creating a clickable prototype.
Step 4. Solution
In my implementation, all articles in Discovery look like cards. All cards are located in one place, after the block with categories in the main menu. The cards are combined into one common media feed, which can be filtered by tags, authors or categories. Users can click on a card and see the story with one set of places. They can swipe up and see all places on the map. In the map view users can through all sets of places by swiping left or right. The main screen of the story has a share button and context menu where users can learn more about its author or hide the story from the feed. Screens with a place have more options: using the context menu, users can get directions to this location, make a call, save to bookmarks or open the web site.
Also, this media feed from Discovery appears in the search results. When user searches something, the app can define the appropriate category for his query and offer appropriate cards from Discovery.
Prototype for users who open the main menu: https://yadi.sk/i/dNorO40SaFd2bA
Prototype for users who use the search box: https://yadi.sk/i/FKpCwAbzLz7I4w
Step 5. Testing
The script for this test remained the same: respondents had to find the nearest cinema where they could watch movies in a foreign language. All respondents completed the task. People preferred to use the search again, ignoring the media feed from Discovery. But cards from Discovery in the search results attracted more attention. Cards in prototype were not associated with advertising anymore. Several respondents noticed that the interface of Discovery looked like stories in Facebook or Instagram. During the test, I asked users what they expected to see after switching to Discovery and how convenient it is to consume media content in such way. The format of stories was familiar, clear and did not cause difficulties. I also asked users to describe the purpose of all buttons. All respondents gave me correct definitions.
Conclusion
The format of stories fully justified itself and helped me achieve my goals: Discovery became more visible, it was not associated with advertising anymore, people could use filters to personalise the media feed. In other words such format allowed users to consume content in more familiar and convenient way.
