Large diagrams hard to navigate on mobile

[keyserj]

Describe your issue

It's very easy for a diagram to get too big to fit on a mobile screen (example), which makes it hard to understand the high-level of the diagram.

Solution you'd like

ideas:

• interactive minimap (see flow example)?
• increase zoom maximum for mobile?

Questions to answer

No response

Alternatives you've considered

No response

Additional context

No response

Technical ideas

No response

Technical questions

No response

[prototyperspective]

Also see #478 – I think it needs a simplified view as well as reducing the amount of things shown when opening a map and both could also be used for the mobile view. On Kialo there's just two columns for every view (drag to view just one column) and it works really well on mobile. One could for example show a panel of tiles one can swipe through one at a time or display them vertically and when dragging them to a side show the tiles beneath or above the. Something of that kind.

[keyserj]

@prototyperspective I added an idea here #539 (comment) , does that sound similar to what you're envisioning with the panel of tiles the user can swipe through?

[prototyperspective]

No, not really – it would really be only one or two tiles max or a one column (maybe but probably not two) of tiles one can swipe/scroll to various sides. I know it's difficult to have a problem map in mind-map style turn to something else, even conceptually, but if that's not done for the mobile view and probably some view mode next to the map mode I think only very few people will ever use the app. I will later add some thoughts and ideas or proposals to the linked discussion, maybe also including some draft to visualize what I mean.

In this case, I think the currently viewed item is "temporarily reduces detouring" so I think this item would be at the top with some info or buttons related to the node at full width of the screen, below it vertically (due to how the screen is like) there could be a column of the items directly linked to it again at full width (underneath some separation line). Each of these items, in this case all components, can be tapped to view the map with that item at the top (currently "temporarily reduces detouring"). The less text and buttons and the simpler the better. Items in the column that have something beneath them have a partly visible card on their right, when swiping them right, one would view that card such as "stop light at intersection" (unclear: either as a new item in the main view or just in place of the component card in that column as some kind of preview?). If they have also cards other than "temporarily reduces detouring" above them there is a part of these card(s) on the left of them and one could view them by swiping the card left (if there's multiple one needs to swipe at the right part of the card). If one has "stop light at intersection" in the main view (at the top), then one could also swipe the left or right to see parallel solutions such as "speed bump between intersection and hill" again with parts of cards on its sides that indicate the presence of parallel solutions. One could also swipe the card up to see the card above it in the main view such as "low traffic interruption while implementing" if one didn't open a new main tile.

Let me know if something of that is unclear. This is just a rough sketch of what I meant there. I'll see if I can create an image out of it later. Note that it's already rare to see people use apps that are nearly text-only so if one intends to make this app successful it would be good to design it in a way that people will actually use. Twitter for example also only shows one tile at full width where users can scroll down and they even do that on desktop. I don't think the 'full map on one page view' would become the most-used even on desktop, especially once maps become much larger than now early on and even now it's difficult to understand all those criss-cross connections and different node types.

However, I have trouble understanding this particular example "low traffic interruption while implementing" – implementing what? And why is a criterion for the problem "cars going too fast in my neighborhood" – I think it would be a criterion for the solutions, isn't it? Moreover, wouldn't it be better to have a subproblem "too expensive" for solution ideas that are too expensive instead of blocking out possibly good ideas via some criterion? That's also because people may think of ways to reduce the costs and one could have the map show only e.g. well-rated nodes/solutions or to sort them according to their rating.

[keyserj]

No, not really – it would really be [...]

For clarity: I replied to this comment over in the Simplified View discussion #541 (reply in thread)