Hi! Me and @catalms are working on this!

We already tried some different versions: On Android we used a Snackbar that shows the user how to add a middle stop after the route is built, and it only appears until the user presses 'don't show again', and on IOS we used a pop up hint only on the first session of the user

However we were wondering a few things:

1. Which version do you prefer?

2. Should we provide all the translations, or only the ones in which we are fluent?

3. We understand it may seem more intuitive, but from our personal experience using the app, it was a bit difficult to build routes with intermediate stops at first.

Because of this we would like to suggest an alternative way to build a route in which the user can add an intermediate stop or final destination, after adding the starting point and not only add an intermediate stop after the route is built. We would still keep the toast/hint if the route is built with no intermediate stop.

Does this sound like a good alternative? We would like to work on it :)

Thank you for your time

@RDOP0808 @catalms thanks for your time on this issue!

1. The issue with toasts/popup hints at the bottom is that they cover important info about the route for the user. Maybe we need to think about a different way to show hints, or to move toasts into a different place, e.g. above the bottom panels?

Users need to see these hints only once or twice, there's no need to repeat them or use "Do not show again" buttons. Nobody wants to see again already known information )

2. Don't worry about translations, it's easy to add all languages by checking docs/TRANSLATIONS.md and using tools/python/translate.py script. We'll help if necessary.

3. Can you please clarify/elaborate on your idea about a better UX to add stops? For sure the current UX when "Route From" is selected first is not great.

Note that on iOS there's already a "Manage route" button to re-arrange stops. "Add stop" or + button can be added there too for better discoverability. This functionality is missing on Android and should be implemented too. Let me know if you're interested in it, there are some ideas on how to improve the "Manage route" part, and it would be great to hear your ideas too.

CC @oleg-PK

Because of this we would like to suggest an alternative way to build a route in which the user can add an intermediate stop or final destination, after adding the starting point and not only add an intermediate stop after the route is built.

Sounds promising!
When I know that I will use intermediate stops, it's annoying that the map zooms out and centers on the built route after selecting a destination, making me zoom back in and find again the spot for the next intermediate stop(s).

There is definitely room for improvement of the current UX for adding and managing stops.

One approach is, during route planning, display all locations which are part of the route, and have an add button directly in that area. This is quite a common approach that most navigation apps use, so users are familiar with it.

Here's a design of this flow. Feel free to add comments and feedback in Figma.
https://www.figma.com/file/u9l4ytCVy3UFIyniAJLAy5?node-id=109:2348&locale=en&type=design#813305547

1. The issue with toasts/popup hints at the bottom is that they cover important info about the route for the user. Maybe we need to think about a different way to show hints, or to move toasts into a different place, e.g. above the bottom panels?

Users need to see these hints only once or twice, there's no need to repeat them or use "Do not show again" buttons. Nobody wants to see again already known information )

-- We tried the popup ate the top and at the bottom but a bit more high, I think the one on the bottom is better, what do you think? Also the popup is only appearing when the user uses the app for the first-time, but we will try to make it appear only once then :)

2. Don't worry about translations, it's easy to add all languages by checking docs/TRANSLATIONS.md and using tools/python/translate.py script. We'll help if necessary.

Ok Thank you! We wil try, seems very intuitive.

3. Can you please clarify/elaborate on your idea about a better UX to add stops? For sure the current UX when "Route From" is selected first is not great.

We were thinking of doing something like this, if the first-stop or finishing stop is already picked then you can already add a middle stop and not only after the route is build. You can see it better in this video :)

Note that on iOS there's already a "Manage route" button to re-arrange stops. "Add stop" or + button can be added there too for better discoverability. This functionality is missing on Android and should be implemented too.

Great! We are already working on it then :)

The toast above the bottom panel looks better.

On the video, what happens if the "Start" button is pressed when the destination is not yet selected? There's clearly a need to easily add either a stop or to add the next point in the route. We discussed and even tested it in detail when implementing the helicopter routing/ruler here. I like the general idea, the question is how to make it more natural, easier, and more consistent.

We were thinking of doing something like this, if the first-stop or finishing stop is already picked then you can already add a middle stop and not only after the route is build.

I like this a lot! An 'add stop' button makes much more sense than 'save' when in a route planning context, and this will ensure it's visible to everyone planning a route.
If a destination isn't selected, we should just change the stop to the final destination 👍️

@RDOP0808, in the video when creating the first step of a route, the proposed "Add Stop" button performs a "Route to first stop" functionality?

For building a route, there are probably two primary use cases:

Non-POI: for routes which do not have Points-Of-Interest in OSM, using the map to find a location is the primary way to identify places.

POI: when creating a route between points-of-interests which are in OSM, using search is a likely way to build a route.

A significant challenges that has not been addressed yet is that a list of stops for a route are not displayed by default, in iOS it requires an extra step, tapping the "Manage Route" button to see them, and even then you can only change the order, you can't delete or add from there.

To clarify:

1. Users already know their destination and stop when the route is built in most cases. This can be done in different ways: set destination, insert stops, or add first stop, second stop, etc., and add destination.
2. Manage route is useful in these cases:
   a. When something went wrong in (1) above. E.g. you thought that a destination would be added, but a stop was inserted instead.
   b. When convenient changing of the order is required to plan a more optimal route compared to initial results.

So let's not mix these tho cases and focus on them separately. An ideal solution would allow to add the next stop like in the Ruler mode, and to insert stops like its done now (many users are used to it already).
An ideal solution also allows to rearrange stops easily, and insert them into the list easily.

Please check comments here #5381 (comment) if not already.

So let's not mix these tho cases and focus on them separately.

These are already mixed, this is part of the same workflow, user journey.

many users are used to it already

This may not be the best reasoning to keep something, people can get used to things which are not so great.

An ideal solution also allows to rearrange stops easily, and insert them into the list easily.

Completely agreed, it's a good idea to work on that, and it's already part way there with the Manage Trip feature.

On the video, what happens if the "Start" button is pressed when the destination is not yet selected?

The new middle stop becomes the finishing stop when building the route

@RDOP0808, in the video when creating the first step of a route, the proposed "Add Stop" button performs a "Route to first stop" functionality?

Yes, if there is a start point, then the add stop button adds a new first middle stop, and if there is no finishing point, then the last middle stop selected is the finish point

An easy first step to easier discoverability of adding stops is showing the stops of the current route.

In the iOS app, when the route is created there is a 'Manage Route' button. Instead of hiding the stops under a button, in place of the button, display the two points which are already in the route. This will signal that there can be more than just two places for a route.

that looks good, how about having it when you pull up the card, like more poi info on the place page?

Showing a panel with stops does not tell how these stops should be added )

And again, there is another issue: some users expect/need to add a stop as the next destination, some want to insert a stop before the current destination. This part is tricky.

Showing the stops in the route is the first steps, that's the easy part, the second step is adding a button there, as you mentioned.

Inserting a stop in between specific stops is definitely tricky, it doesn't seem like anyone has come up with an elegant UI for this. The best workflow appears to be adding all the desired stops and then arranging them in the needed order.

Showing the stops in the route is the first steps, that's the easy part, the second step is adding a button there, as you mentioned.

Not sure if I understood which button is discussed here.

Adding stops in-between already works great on Android, where stops are automatically sorted by their order. Select any point on the map and press Add Stop. It will be inserted in the optimal place. There is an issue to make this behavior switchable #8135 so users may build "non-optimal" routes if necessary too, like now in iOS by default.

Did you try it already? Don't you think that it's an elegant UI?

This Issue is about making it easier for people to discover how to add stops, as the current UX is not doing that adequately. Even on iOS which has the Manage Route button, it's not clear how to add a stop. Hikers may be more familiar with adding stops from the map, but many average people don't do that, they use search to find places.

Not sure if I understood which button is discussed here.

A new button called "Add Stop" below the list of current stops.

Searching first, then selecting a result, displays "Add Stop" button at the bottom in the Place Page, when a route is built. So many average people will discover it when using search.

Those who tap the map discover it too.

The confused users are those who are looking for a list of added stops (like in Google Maps), and a button there to add a stop. This pattern takes the same or more amount of clicks compared to searching/adding a stop or selecting a map/adding a stop.

So the solution is either to hint at how to add stops or to show a similar like-in-google-maps UI. The latter option has a disadvantage, because users may never learn an alternative, easier way to add stops. And our search is not great ATM.

It would probably be helpful to improve both user journeys.

From map
Today a number of buttons which need to be pressed to complete a workflow, blend in with all the other buttons, and people never notice that a new button appeared on the Place Page, it's really easy to miss that when opening the Place Page for a second POI, the 4 buttons are completely different, and that one of them is "Add Stop". In this context, when the route is already built and second POI is selected, "Route from" and "Route to" are already confusing enough, and without any guidance, people have no idea what to do.

"Route from" and "Route to" in this context are likely almost never used, and if so, probably a very narrow use case. I would be helpful to remove the buttons to avoid confusion.

Also it could help to use color as guides, for example just like the "Start" button is blue, make other buttons also blue to guide a person through the steps, for example "Add Stop" button and "Route to" button can be blue.

From search
Outlined in this design:
https://www.figma.com/file/u9l4ytCVy3UFIyniAJLAy5?node-id=0:1&locale=en&type=design

Always visible Route From and Route To buttons are handy for planning remote trips. They become even more useful when we allow the saving of a planned route.

There are several main cases of using OM:

1. Understand where you are.
2. Go somewhere right now.
3. Plan a trip by saving some bookmarks and planning the route length/time.

@biodranik

1. Understand where you are.

Can you please clarify, how is ‘Route to’ and ‘Route from’ used to understand where you are?

2. Go somewhere right now.

‘Route to’ is to go somewhere, for example from current location to a POI, this is useful.

The context here is what is the ‘Route to’ and ‘Route from’ buttons used for when a route is already created between at least two points and an additional point on the map is selected - the ‘Route from’ button is essentially a ‘Replace starting point’ button, and the ‘Route to’ is a ‘Replace the finish point’ button. The function of these buttons is not at all clear from the button labels, a person has to experiment with what the buttons do to understand this. These buttons are like if a task list created two dedicated buttons just for “Add item to top” and “Add item to bottom” when the is already an "Add item" button; it might be overkill. Also, this functionality can be accomplished by just using the ‘Add stop’ button and resorting the list.

3. Plan a trip by saving some bookmarks and planning the route length/time.

To do this, dedicated buttons to replace first and last points are not necessary.

Related to #6097