New size options for the Side Panel!

Related products: WebUI

Update: Thank you all for your participation in the poll for this Idea. The poll is now closed.

Dear Community!

Hope you all are safe and in good health!

We are extending the Grid Layout on Side Panels and are also planning to introduce a couple more sizes for the side panels so that you can utilize the grid layout in an efficient way and make better use of the real estate on the side panel.

Currently, the side panel has one fixed-width size of two columns. We want to introduce two more sizes, resulting in Wide, Medium, and Narrow. Narrow will be the current size available. 

Before we go ahead and introduce this, we wanted to check with you on your preference and how you would like the functionality to work.

We would like to know your preference on the implementation of these sizes on the WebUI. How and where these sizes should be set and how they should behave?

  1. One size for all side panels across the application. You can select one of the sizes and that will be set for all side panels across the application. You can set this value in the Application Settings.
  2. Defined size per page. You can select the desired size of the side panels per page. The side panel will open with that respective width on the page. You can set this value in the Page Settings. 
    We will also provide a preview option when configuring the side panel so the widgets and end-user experience remain the same.
  3. Size per side panel. Set a size for each side panel. You can set the size in the Side Panel page settings when adding widgets.

There are pros and cons for each implementation, the main being:

  1. One size across the application
    • Pro - Consistency is maintained across the application for end-users.
    • Con - Size would be dictated by the biggest size. Some side panels may not require that size and might look very empty. Poor use of the real estate.
  2. Standard size per Page
    • Pro - Maintaining consistency on the page when the user interacts with the side panels. 
    • Con - Here as well some of the side panels may not require that size.
  3. Size per Side Panel
    • Pro - Different sizes allow app developers to select the correct size based on the content.
    • Con - Inconsistency when the users interact with the side panel, different sizes would result in a lot of movement on the page.

 

We would also like to know your thought about the different sizes: Would you prefer to have 

  1. Three sizes - Wide (4 columns wide), Medium (3 columns wide), and Narrow (2 columns wide) - This is our current preference!
  2. Two sizes - Wide (4 columns wide) and Narrow (2 columns wide)
  3. Custom - Ability to define any size.

To give you a perspective of the different sizes:

Wide Side Panel

 

Medium Side Panel

 

Narrow Side Panel (Current Size)

 

We also plan to introduce a feature where the app developer and end-user can make the side panel a part of the page that will then not overlap (overlay) the widgets.  

 

Do also leave your suggestions and feedback. They are valuable and help us! 

 

Thanks,

Team WebUI.

Love the UI opportunities this creates @Pratap Kumble, have cast my vote.

Also, the ability to ‘pin’ the side panel so it doesn’t overlap the widgets is key functionality, we have lots of emerging UI patterns for SC Nav where this is really needed - hope it gets prioritized :wink:

Updated idea status New → Discussion ongoing

Dear Community,

 

We would like to thank everyone who participated and provided their suggestions for this Idea. We received a good amount of responses that helped us decide how to implement this idea.

Considering future development, like being able to pin/fix the side panel on the page, we will be implementing the following:

  • Introduce a new option in Application Settings > Application Extensions - Side Panel Width. The default size will be 2 columns when not specified.
  • Introduce a new option in Page Settings > Page Extensions - Side Panel Width. When specified this option will override the application setting option.
  • We will make it easy to select the size by providing a pre-declared list. 

Basically, you can set the side panel widget per Page. 

We are still deciding on what the max-width should be for the side panels. 

 

There were a few questions that were asked in the poll as well:

  1. Will the Active/Hidden state also be available?
    A: Yes, we will also work on enabling the `state` property in the specification. By default, the `state` will be "Active". To hide a side panel the `state` will have to be updated with "Hidden"
  2. Will the user be able to drag the side panel?
    A: We did consider this option, but decided to leave it out for the time being as the scenarios and complexity increase. Once we have implemented the above feature, based on the feedback we might introduce this feature as well.
  3. Will the pinning/fixing, i.e non-overlap of the side panel with the widgets work in a similar fashion to the workflow panel?
    A: Yes, When pinned/fixed, the side panel will push/compress the widgets on the page for space. 
  4. What about the size of the widgets inside the side panel?
    A: With the introduction of the Grid Layout on Side Panels, the widgets will just resize based on the layout proportions. So the issue with fixed size widgets will be taken care of by the grid layout.

You can expect the grid layout on the side panels with the next release and custom sizes of side panels in the coming months. 

 

Do watch the status to know when this idea is in its implementation phase!

 

Please do let us know if you have any questions. 

 

Thanks and Regards,

Team WebUI.

Updated idea statusDiscussion ongoing→On Backlog
Terms & Conditions

Didn't find what you were looking for? Try searching on our documentation pages:

AIMMS Developer & PRO | AIMMS How-To | AIMMS SC Navigator