Improve Navigation Layout in Portrait and Landscape #3745

Open
opened 2022-10-28 12:46:14 +00:00 by biodranik · 6 comments
biodranik commented 2022-10-28 12:46:14 +00:00 (Migrated from github.com)

It is about Navigation mode. Motivation:

  1. Increasing/decreasing font size now changes the bottom bar height, which in turn covers the current location blue arrow.
  2. Current arrow position is hard-coded, and is not optimal not only in Portrait but also in Landscape mode.
  3. Top bar in landscape mode takes up too much useful space.

Now thinking about the best solution, there are several ideas:

  1. Do not draw the bottom bar over the map, but draw it under the map. E.g., instead of this:
=========
|       |
|       |
|  map  |
|       |
|       |
|       |
|       |
|-------|
|bar    |
|-------|
=========

draw this:

=========
|       |
|       |
|  map  |
|       |
|       |
|       |
=========
---------
|bar    |
---------

It will not only resolve the offset issue (now it can be safely hard-coded again), but also increases the rendering speed, and saves more battery.

For the landscape, another approach should be used with a custom layout. I see two possible options:

  1. As we discussed previously, something similar to the CarPlay approach, where the top and bottom bars are on the left, while the whole right half of the screen is used for the map, and the blue arrow is centered there.
    PROS: important vertical space is not occupied by bars, friendly layout for everyone who tried CarPlay, AppleMaps, etc.
    CONS: less map is visible on the right side from the current position.
  2. Bottom bar can be removed, and its info/buttons can be drawn on the left and right corners.
    PROS: current position is conveniently centered.
    CONS: less vertical space, ineffective use of the top bar (very long street names are very rare).
It is about Navigation mode. Motivation: 1. Increasing/decreasing font size now changes the bottom bar height, which in turn covers the current location blue arrow. 2. Current arrow position is hard-coded, and is not optimal not only in Portrait but also in Landscape mode. 3. Top bar in landscape mode takes up too much useful space. Now thinking about the best solution, there are several ideas: 1. Do not draw the bottom bar _over_ the map, but draw it _under_ the map. E.g., instead of this: ``` ========= | | | | | map | | | | | | | | | |-------| |bar | |-------| ========= ``` draw this: ``` ========= | | | | | map | | | | | | | ========= --------- |bar | --------- ``` It will not only resolve the offset issue (now it can be safely hard-coded again), but also increases the rendering speed, and saves more battery. For the landscape, another approach should be used with a custom layout. I see two possible options: 1. As we discussed previously, something similar to the CarPlay approach, where the top and bottom bars are on the left, while the whole right half of the screen is used for the map, and the blue arrow is centered there. PROS: important vertical space is not occupied by bars, friendly layout for everyone who tried CarPlay, AppleMaps, etc. CONS: less map is visible on the right side from the current position. 2. Bottom bar can be removed, and its info/buttons can be drawn on the left and right corners. PROS: current position is conveniently centered. CONS: less vertical space, ineffective use of the top bar (very long street names are very rare).
pm4rcin commented 2022-10-28 16:16:26 +00:00 (Migrated from github.com)

Portrait:
Definitely putting the bar under map is a great idea.
Landscape:
Definitely 1. not only because it's friendly layout but another thing is that it makes the bottom bar accessible which we could make bigger and add some useful buttons there. I think we also need to think if remaining distance to destination is so important to be as big as it is now. Maybe it should be smaller like in GMaps but someone (artist, designer if there's any in community) should make some drawings with different positions so it'd be much easier to decide. The bottom panel could also occupy whole (or almost whole) half of the screen when expanded so there could be some more options because now there aren't many while it's a useful and handy menu for some actions. And also the top panel could dynamically resize itself to bigger.
That's how I think.

Portrait: Definitely putting the bar under map is a great idea. Landscape: Definitely 1. not only because it's friendly layout but another thing is that it makes the bottom bar accessible which we could make bigger and add some useful buttons there. I think we also need to think if remaining distance to destination is so important to be as big as it is now. Maybe it should be smaller like in GMaps but someone (artist, designer if there's any in community) should make some drawings with different positions so it'd be much easier to decide. The bottom panel could also occupy whole (or almost whole) half of the screen when expanded so there could be some more options because now there aren't many while it's a useful and handy menu for some actions. And also the top panel could dynamically resize itself to bigger. That's how I think.
Member

@pm4rcin you may be thinking of a different PR than 3130 if you're talking about top panel sizing (3130 is text-to-speech only)

@pm4rcin you may be thinking of a different PR than 3130 if you're talking about top panel sizing (3130 is text-to-speech only)
biodranik commented 2022-10-28 19:55:15 +00:00 (Migrated from github.com)

An ideal nav layout will also have the following:

  • Speed limit sign (top right, like it is done in CarPlay now?)
  • Current speed under the speed limit, like it is done now in OM CarPlay (then it shouldn't be displayed on the bottom bar)
  • Somehow alert driver about a speed camera (and later, in online mode - about road issues, traffic jams, etc.)
  • Route overview button
  • Current search, bookmarks, zoom, and position buttons likely should be redesigned to avoid cluttering. Any ideas?
An ideal nav layout will also have the following: - Speed limit sign (top right, like it is done in CarPlay now?) - Current speed under the speed limit, like it is done now in OM CarPlay (then it shouldn't be displayed on the bottom bar) - Somehow alert driver about a speed camera (and later, in online mode - about road issues, traffic jams, etc.) - Route overview button - Current search, bookmarks, zoom, and position buttons likely should be redesigned to avoid cluttering. Any ideas?
biodranik commented 2022-10-28 19:55:54 +00:00 (Migrated from github.com)

There is also a big collection of related improvements here: #1104

There is also a big collection of related improvements here: #1104
pm4rcin commented 2022-10-29 17:50:41 +00:00 (Migrated from github.com)

Every single feature you've mentioned is trivial (someone needs to write a bit of code for each) EXCEPT traffic jams which requires processing (probably) on server. How much is a question to e.g. Magic Earth or any other company that does this. It's probably the most complex problem for FOSS maps projects because you need money (how much? I'd like to know) and probably collaboration with similar projects (OSMand at the time being).

Every single feature you've mentioned is trivial (someone needs to write a bit of code for each) EXCEPT traffic jams which requires processing (probably) on server. How much is a question to e.g. Magic Earth or any other company that does this. It's probably the most complex problem for FOSS maps projects because you need money (how much? I'd like to know) and probably collaboration with similar projects (OSMand at the time being).
pm4rcin commented 2022-10-29 20:04:14 +00:00 (Migrated from github.com)

@pm4rcin you may be thinking of a different PR than 3130 if you're talking about top panel sizing (3130 is text-to-speech only)

You're probably right. I don't know what I meant because it was a lot of text so maybe I was thinking about something and then deleted. :D

> @pm4rcin you may be thinking of a different PR than 3130 if you're talking about top panel sizing (3130 is text-to-speech only) You're probably right. I don't know what I meant because it was a lot of text so maybe I was thinking about something and then deleted. :D
This repo is archived. You cannot comment on issues.
No labels
Accessibility
Accessibility
Address
Address
Android
Android
Android Auto
Android Auto
Android Automotive (AAOS)
Android Automotive (AAOS)
API
API
AppGallery
AppGallery
AppStore
AppStore
Battery and Performance
Battery and Performance
Blocker
Blocker
Bookmarks and Tracks
Bookmarks and Tracks
Borders
Borders
Bug
Bug
Build
Build
CarPlay
CarPlay
Classificator
Classificator
Community
Community
Core
Core
CrashReports
CrashReports
Cycling
Cycling
Desktop
Desktop
DevEx
DevEx
DevOps
DevOps
dev_sandbox
dev_sandbox
Directions
Directions
Documentation
Documentation
Downloader
Downloader
Drape
Drape
Driving
Driving
Duplicate
Duplicate
Editor
Editor
Elevation
Elevation
Enhancement
Enhancement
Epic
Epic
External Map Datasets
External Map Datasets
F-Droid
F-Droid
Fonts
Fonts
Frequently User Reported
Frequently User Reported
Fund
Fund
Generator
Generator
Good first issue
Good first issue
Google Play
Google Play
GPS
GPS
GSoC
GSoC
iCloud
iCloud
Icons
Icons
iOS
iOS
Legal
Legal
Linux Desktop
Linux Desktop
Linux packaging
Linux packaging
Linux Phone
Linux Phone
Mac OS
Mac OS
Map Data
Map Data
Metro
Metro
Navigation
Navigation
Need Feedback
Need Feedback
Night Mode
Night Mode
NLnet 2024-06-281
NLnet 2024-06-281
No Feature Parity
No Feature Parity
Opening Hours
Opening Hours
Outdoors
Outdoors
POI Info
POI Info
Privacy
Privacy
Public Transport
Public Transport
Raw Idea
Raw Idea
Refactoring
Refactoring
Regional
Regional
Regression
Regression
Releases
Releases
RoboTest
RoboTest
Route Planning
Route Planning
Routing
Routing
Ruler
Ruler
Search
Search
Security
Security
Styles
Styles
Tests
Tests
Track Recording
Track Recording
Translations
Translations
TTS
TTS
UI
UI
UX
UX
Walk Navigation
Walk Navigation
Watches
Watches
Web
Web
Wikipedia
Wikipedia
Windows
Windows
Won't fix
Won't fix
World Map
World Map
No milestone
No project
No assignees
2 participants
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: organicmaps/organicmaps-tmp#3745
No description provided.