3.0 Quick Menu

[gagarinlg]

Is there an existing issue for this feature request?

• [X] I have searched the existing issues

Is your feature request related to a problem?

we need a new UI

Describe the solution you'd like

Implement a new main menu

Describe alternatives you've considered

No response

Additional context

No response

[JimB40]

So after last dev-hour I agree with @philmoz we should stick to our core value Kazein (small steps). Therefore my proposal is:

1. As the first step we focus only to implement new Main Menu.
2. This can be used in parallel with existing navigation, AFAIU not much changes needed to code in other places.
3. AFAIU it will be easier to sync this 3.0-main-menu branch with on-going changes in main branch

What you say @philmoz @gagarinlg @pfeerick?

[gagarinlg]

I agree. Do you have a list of things to change so that we can convert it into work items?

[JimB40]

1. New 3.0 main menu logic is self explanatory via LUA simu but if needed I can make some text description.
2. GFX
   • I keep everything in vector format while ETX uses bitmap masks
   • with tab icons I've tried to keep existing size while group icons are slighly bigger to emphasize meaning
   • there are few new icons created like Radio Settings, Model Manager or Apps Anyway I will export them to whatever format dev needs

[philmoz]

What about 'Model Notes', 'Reset Telemetry', 'Statistics' and 'About EdgeTX' from the current quick menu?

[JimB40]

1. I'm not seeing "Model Notes" in last nightly from yesterday so I don't know what it does. Anyway it should go to "Model Settings" group
2. Statistic is kind of Monitor

Concept for now is to change last group icon that is now 'Monitors" to something more broader like for example "Tools"

then we can include in this group.

• Screen Settings
• Channel Monitors
• Logical Switch Monitor
• Statistics (which is kind of dev monitor
• Spectrum Analyser
• Reset Telemetry (btw name is confusing - Reset Flight Data would be better)
• and last but not least "About EdgeTX"

Since "About EdgeTX" is special we may consider toggling ETX icon, but I had in mind to use this trick to switch between whole EdgeTX naviagtion tree and User Favoutites shotcuts. What I mean pressing EdgeTX logo will exchange it to Heart Icon and only user selected icons from whole navigation tree will be displayed.

[pfeerick]

I'm not seeing "Model Notes" in last nightly from yesterday so I don't know what it does. Anyway it should go to "Model Settings" group

Model notes has always been there, right from EdgeTX 2.4 😆 You just never had a model configured with model notes ;) In its simplest form, it's just a list of notes. Or can be shown when loading up the model as a checklist/reminder. Or can be made to be an a more interactive preflight checklist.

https://github.com/EdgeTX/edgetx/assets/5500713/3491bd56-1288-48df-a122-93123c946a73

[philmoz]

If I understand correctly the quick menu has two sections, groups at the top and the group controls/pages/tools at the bottom.

On a touch screen this is easy enough to navigate - select group then select item in group.

On a radio without a touch screen how will the navigation work to select group and group element?

[JimB40]

Yes.

1. Upper section (5 icons) are groups
2. Lower section (as many icons as it needs) are direct shortcuts to pages One exception - group icon can be direct shorcut if this "group" has not children. ie APPS case.

With touch UI navigation is staightforward.

1. You tap group icon
2. Group members are displayed in lower section
3. you tap desired shorcut icon
4. you tap on 'X' or outside Quick Menu to close it

With key UI initialy in Simu I've coded 2-stage nav using Roller and enter.

1. You roll selectin group in upper section
2. Press ENTER - Group members are displayed in lower section and focus is transfered to lower section
3. You roll selecting shortcut icon then 4a. Press ENTER - go to a page 4b. Press EXIT - focus is set to upper section allowing you to select another group.

But 2-stage nav is always less efficient and testing how good PAGE> & PAGE< works in #4104 I think we can go this way

1. PAGE> & PAGE< selects group icons in upper section
2. Roller selects shortcut in lower section.
3. ENTER always executes redirection to selected page (hightlighted shotcut icon)
4. EXIT always closes Quick Menu The only caveat is that in this concept every group always has to have at least on child (shotcut icon)

Hope that's clear

[JimB40]

@philmoz if you code that Quick Menu will remember state as I did in simu, second concept should be really fast & efficient as user will use both hands. Left for selecting groups, right for selecting shotcuts.

[philmoz]

I'm wondering why the 3.0 quick menu is not using the button and popup dialog styling to match the rest of the UI. Quick menu colors don't change when the theme changes.

[pfeerick]

Quick menu colors don't change when the theme changes.

This was my point a while ago... Robert argued that "system" stuff should be consistent colours... however this goes against everything else I see people asking for (and also wish for myself) - most of our target audience wants to be able to customise the colours, just as they want custom splash screens, shutdown screens and startup audio. Not boring old B&W menus (which then also look out of place against the rest of the system) 🤣 He lost that argument when I did the poll about the custom shutdown screen colors... majority rules 😝

[JimB40]

Have you ever wondered why quick menu in UI of most used handheld device is monochrome? But this time I won't explain reasons behind decisions in area of my expertise, repeating there is more than look. Just scratch 'old boring B&W' and make it full color. 😀

[philmoz]

I'm going to throw the cat among the pigeons and suggest an alternative quick menu.

The key goals here are:

• Keep navigation as consistent with current system as possible, no big learning curve
• Minimise the number of touches or key presses required
• Allow user configuration
• Make better use of available screen space (minimise waste space)

Notes:

• The Page keys will jump between the button groups.
• The close button is only shown for touch screen radios
• User can configure up to 8 favourite buttons
• Uses theme colors
• Page name for selected button shown in title bar

[Gerold68]

@philmoz: One or two extensions and the menu is bursting at the seams. Also A lot to process visually.

Robert's menu is for the long term more flexible. And it is more focused. If I select Models, only Model depended settings are displayed.

@JimB40: You should also make use of the available space.

But this is just a user's point of view ;-) Both proposals will make the menu more convenient.

[JimB40]

No budget for eye-tracking but no need to see overload. It is tempting to place 'everything' to gain UI speed, but few years of research in UX area shows it actually slows down interaction due to how our brain deals with visual information. Long story short over 5-6 items and decision efficiency start to decrease (in non linear way)

We have no proper UX tools to measure things (try to test code without debugger) so good approach IMHO is to apply best practices.

This quote shows modern UX direction: "The general goal of a UXer is to provide the most simple user experience possible and that is helped by reducing cognitive load. Ensuring that interface only includes the bare necessities can naturally render your UI design more intuitive. It can also reduce interaction cost."

How to divide and group features is another story.

PS. We (including me) shouldn't also trust our 'feelings' too much in this area. IT devs usually have way above average ability to process vast amount of data and strong analytical skills trained over years. So feedback result will be biased.

[philmoz]

Long story short over 5-6 items and decision efficiency start to decrease (in non linear way)

By that argument we should stay with the current quick menu UI.

[JimB40]

@JimB40: You should also make use of the available space.

Width is designed to fit vertical (< 320px) We can strech menu on horizontal but still applying above rule.

Where possible of course. Example is model setup that has now 12-13 shortcuts. Grouping them in 5-6 doesn't make much sense. So it's always to find balance. There are things that will come up only during testing stage.

@philmoz if we manage to keep UI navigation tree within 3 (in rare cases 4) levels. UI should be fast & robust. Writing UI navigatigation tree I mean UI navigation path where you go deeper into screeens with ENTER and go back with RTN.

Case 1 (Lists ie INPUTS/MIXES/ etc)

1. Quick Menu displayed
2. Full Screen with list displayed (previously called TAB)
3. Full Screen with options displayed (list's item editing screen)
4. Pop-up/Modal/Contextual Menu displayed to set selected option

Case 2 (non List)

1. Quick Menu displayed
2. Full Screen with options displayed (previously called TAB)
3. Pop-up/Modal/Contextual Menu displayed to set selected option

In rare cases there is another Full Screen with options displayed (but this should be avoided as much as possible in favor of changing content of screen from point 2 or by using scrolling)

I've left some features grouping for testing stage. To give you example. This group of buttons is in fact 'list' -> UI falls into Case 1 - UI navigation tree with 4 levels There are features like

• RF (internal & external) or Trainer that are rarely used (set and forget)
• Timers that seems to be used more frequently (even model configuration is done).

If we place Timers shortcut in Quick Menu (Case 2) we will scratch one level making this feature available at any point of UI state (allowing to change UI navigation tree branch), but then number of shorcuts in Quck Menu MODEL SETUP will increase. So those are concepts we will check with hands-on.

PS. Really wish I have here user UI path checking tool :)