Skip to main content

Questions tagged [sidebar]

element that displays various forms of information to the side of an application or desktop user interface

Filter by
Sorted by
Tagged with
0 votes
1 answer
47 views

Showing sidebar based on the context?

When the user logs in to my website, they see the main dashboard. They can navigate to the Projects page and see a list of projects. I am planning to put the Dashboard, Projects, global Settings etc ...
Nijraj Gelani's user avatar
2 votes
1 answer
58 views

Optimizing API Calls for Multi-Select Filters in a Sidebar: Best UX Practices?

I have a filter sidebar with 5+ filters. Each filter allows to select multiple options. For now it is implemented using multi-select(not native one, you need to select items one by one). The issue is ...
Taras Savchenko's user avatar
0 votes
2 answers
110 views

How should a sidebar behave when using top and bottom sticky elements?

I'm designing a complex software interface which has a sticky-top element that contains tabs, and a sticky-bottom element with some CTAs. I'm adding a sidebar and I wonder if it should be placed over ...
Paula's user avatar
  • 149
0 votes
1 answer
47 views

Hidden sidebar feature on desktop Saas apps

I am currently designing a B2B Saas application for a startup, and I am having confusion while deciding the collapsable states of the sidebar - either collapsed with icons or completely hidden with ...
Metalll's user avatar
0 votes
2 answers
75 views

Sidebar exit or collapsing

Well I am here in situation where on a button inside toolbar user would open this sidebar with some filters and it has tabs on the top,filters below it etc. Now problem is how to create some way of ...
Paco's user avatar
  • 61
1 vote
1 answer
63 views

How to position the two panels

I have a question about how to arrange 2 panels for one section. Situation: I’m navigating through the settings and the page with user settings is causing me problems. Because there is a hierarchy ...
Alexei's user avatar
  • 11
1 vote
1 answer
45 views

In an app with a left sidebar for navigation and a hideable right sidebar for contextual info, how contextual should it be?

Our navigation sidebar is on the left. We also have this right-hand sidebar to provide contextual info based on the feature that a user is looking at. Within a given feature, Cohorts in this ...
Pat's user avatar
  • 11
1 vote
1 answer
102 views

Add a separate filter for items that are already listed in a sidebar, but not explicitly as a filter?

I have a question regarding a filter. I have a grid with cards that represent pages in a document. There are rules for these cards about when they should be displayed and when not in a generated ...
Kai's user avatar
  • 13
1 vote
2 answers
38 views

Duplicate link names in the navigation

I have a sidebar navigation where I need to seperate orders into two types - maintenance orders and service orders. Each order type has 4 statuses by which it should be separated - it has different ...
Marko Kos's user avatar
2 votes
1 answer
122 views

Multiple switchers in sidebar

I am working on a design framework that is used by multiple applications and I have a sidebar which need to include following things: User can change application User can change company and name of ...
Marko Kos's user avatar
1 vote
1 answer
65 views

How to let users know that they can save more images in history bar?

I'm designing a UI for an image editing tool. Right now the history bar looks like this. Users can decide whether they want to "save" (button) or "delete" (button) the image when ...
Ivan's user avatar
  • 111
1 vote
2 answers
188 views

Conflict between sidebar and tables with many columns

I am designing an internal tool for a client. This tool is very information dense and most of its content is tables with a lot of columns. When designing the navigation I had thought of a sidebar, but ...
Danielst's user avatar
  • 381
0 votes
2 answers
93 views

Quick navigation between courses in an LMS

I have a webapp LMS whose workflow, for students and teachers alike, goes like this: the home page has a list of cards representing the courses available, with a button to enter the course. When ...
Samuele B.'s user avatar
0 votes
2 answers
196 views

Double top-app bar

I created a webapp-based learning management system, and I'm debating whether a decision I took regarding the top app bar(s) is sound or could cause issues when it comes to user experience and ...
Samuele B.'s user avatar
2 votes
1 answer
603 views

Collapsible sidebar vs horizontal tabs

Our application is currently using tabs for its sub-navigation. The problem is, on some pages, there are more than 6 tabs; some of its labels are long, so we have had to shorten them. One idea I have ...
M Bo's user avatar
  • 1,414
2 votes
3 answers
375 views

How to handle 2 side navigation bars on a web app

I'm working on a web app that can briefly be described as the following. Every page has a table, and there's a primary side navigation bar that allows users to jump from one page (table) to another. ...
Mohamed Eltazy's user avatar
1 vote
1 answer
532 views

Nested sidebar behavior

I have a nested sidebar that goes 3 levels deep. I would like the interaction to slide left/right: So in this example, if you click on "Jobs" in (1), (2) would then slide in. My question is,...
M Bo's user avatar
  • 1,414
0 votes
1 answer
171 views

Expandable active filter list - user flow

I am trying to implement active filters list to a fixed side filter bar. When a user scrolls through data, they will always be able to preview the active filter list without having to scroll to the ...
Lorelei Heckmann's user avatar
2 votes
3 answers
576 views

How to implement a side filter bar for smaller screens without overlying the platform content?

Currently, I'm working on a data-driven platform. I designed a side filter bar that allows users to filter data dependable on their needs. The problem appears on smaller screens. After a discussion ...
Lorelei Heckmann's user avatar
3 votes
1 answer
201 views

Is there a specific name for this type of navigation?

Currently, I'm working on a project that requires a lot of repeated navigational options. For example: System 1: Transform; Require; Pipeline. System 2: Transform; Require; Pipeline. System 3: ...
Xasdown's user avatar
  • 31
2 votes
2 answers
244 views

Should we display Title of the Menu on the header even though user can see the menu title on the sidebar?

Do we still need to display the title on the header, if the title already can be seen on the sidebar like in the wireframe?
Banuraga's user avatar
0 votes
2 answers
133 views

When to hide a sidenav

I have in my app a sidenav which is by default visible. Now I got a feedback from users, that in lower resolutions (mobile, tablets) the sidenav covers a lot of space from the app. My question is: on ...
Runtime Terror's user avatar
0 votes
6 answers
4k views

Left Sidebar Menu design with hierarchy

Current scenario: I've a webapp, in which there is a left sidebar. There are some menuItems and subMenuItems in sidebar. This hierarchy can go to N level. New Requirement: Now There can be multiple ...
Rudrik Andharia's user avatar
1 vote
1 answer
272 views

Why do most interfaces rely on sticky top bars instead of sidebars?

Most web interfaces have the classic sticky topbar + 2-3 columns layout (just like StackExchange). Some but few websites use a different approach and, instead, have a collapsable sidebar (i.e. ...
XCore's user avatar
  • 927
2 votes
1 answer
994 views

Is there a best practice for sidebar width on mobile?

What is the best practice when it comes to sidebars and user experience on mobile? Is it better to have one that is full-width or one that is 85% width with 15% backdrop? What are the benefits or ...
Georgi Demirev's user avatar
2 votes
1 answer
2k views

Sidebar modal - pros & cons?

Do slide-out modals work well in your experience? Our requirements are to present deeper, specific content to users without taking them out of a flow, so linking to another page is not being ...
endymion1818's user avatar
0 votes
2 answers
413 views

How to choose between a Popover, Inspector, or Toolbar to edit properties?

macOS apps have the following patterns (and possibly others) for editing properties of selected items: Popovers (See here) Inspector Panels (Right Sidebar) Toolbars In the following example, the ...
Taylor's user avatar
  • 171
2 votes
2 answers
888 views

Responsive nav sidebar with company logo and information

Currently, our team's browser app looks like this: up to this point, we built our app to target desktop. However, because we're moving to Android, it is imperative that we can also effectively ...
Mike Warren's user avatar
1 vote
2 answers
795 views

Best practice to best illustrate side navbar children

I have this Side Navbar with children. I am not sure that the way I am illustrating the children is the best way of doing this. Questions - Is this the best way for me to illustrate navbar item's ...
Jeremy Walters's user avatar
0 votes
1 answer
239 views

Select elements in the sidebar, which is better?

So, my friend and I are building a web app and we were having a little argument. We need to have two select elements in the sidebar and one of them is not relevant to a few pages. Which of the ...
Lastrik's user avatar
1 vote
1 answer
418 views

Menu sidebar height on small screen resolutions

I'm currently having a challenge on a SaaS I'm helping designing, regarding small screen sizes. That SaaS has a menu sidebar on the left as its main navigation, with 2 levels of navigation. The ...
Joao Carvalho's user avatar
4 votes
5 answers
1k views

Only show a sidebar on some pages

In our application, we've got a dual sidebar design. On the far left is the main navigation sidebar, with all the top level pages. Next to this is a contextual sidebar, with links relevant to the page ...
PaReeOhNos's user avatar
3 votes
1 answer
1k views

SaaS admin navigation through lower tiers

I'm working on a Saas platform that will provide its user with an SDK for their apps. Users will either be able to create multiple apps (tier 1) in their account or only one (tier 2). Within each app, ...
Blooba's's user avatar
2 votes
2 answers
206 views

How long should a swipe action be to open a sidebar?

How long/quick should a left or right movement be in order to indicate it's a swipe rather than user scrolling the page? I was thinking, if user isn't scrolling in the y axis and performed touch ...
dǝɥɔS ʇoıןןƎ's user avatar
1 vote
6 answers
4k views

Actions inside a dropdown

We need to allow a user to select a project as primary and quick action, he should also be able to add a new project, edit and delete projects (as secondary actions) this is all done in the faceted ...
Eran Bar's user avatar
  • 1,040
1 vote
2 answers
385 views

What problems exist with removing the navigation bar during the checkout process?

I am working on a application that allows users to buy games. There is a sidebar with the global navigation throughout the whole app. And I am now wondering if I can hide the sidebar during the ...
Ola Osinska's user avatar
0 votes
1 answer
72 views

Is it ok not to place headers on pages?

Do I need a header on the top of every page I have or is a prominent indication of category in the sidebar enough? I keep jumping back and forth and cannot come up with a permanent solution. It also ...
Ola Osinska's user avatar
0 votes
1 answer
849 views

What should be the ratio of sidebar navigation to screen in ios?

I am working on designing a native iOS app. For one of the screen need to design a side navigation bar. Android navigation bar standard size details are available here - https://material.io/guidelines/...
Neelam Choudhary's user avatar
0 votes
1 answer
65 views

Navigation for dependent pages

I'm working on a location analysis dashboard. There are three main sections that are somewhat but not really related and somewhat but not really in a hierarchical system. There's the main page. A ...
Androidicus's user avatar
4 votes
2 answers
2k views

Expand sibebar menu with a home button?

I need a way to user expand sidebar menu, but I can't remove the logo (links to home page) to put a sandwich button. In the second screen I placed an arrow to the right when cursor is hovering the ...
TiagoXavi's user avatar
0 votes
3 answers
2k views

Are two sidebars good for a website design?

I am working on a website which is learning content based and I am planning to have two sidebars, one for the main navigation and other for the table of contents. Is that okay to have two or three ...
Bhansa's user avatar
  • 111
2 votes
2 answers
2k views

Is it ok to use Bottom Nav Bar with Tabs for sub-level?

I am trying to design and app with Material design which has 6 top level destinations and 4 of them have sub-levels. Is it ok to use Bottom nav bar for 5 of them and put 6th one in side navs along ...
Gaurav Gaikwad's user avatar
1 vote
1 answer
497 views

How to show long navigation list horizontally?

We have a screen as below that has a long left navigation list that spans the whole height of the page and is scrollable (a lot of rows). We also have an info panel that is basically tabular data. ...
Jun Wei Lee's user avatar
2 votes
1 answer
67 views

Floating sidebars of different widths under different modules of the same application

I'm designing a web application with multiple modules, and am using floating sidebars for new event creation. Currently, the sidebars have different widths since the number of form fields is ...
Jules Victor's user avatar
1 vote
2 answers
292 views

Is it useful for users to have different UI of side menu in each page?

This is what I got today while navigationg agoda.com Here you can see same content but different presentation. Does this help user?
Jivan's user avatar
  • 3,748
2 votes
2 answers
238 views

UI: add buttons to Sidebar boxes

I've got a window with a sidebar divided into several Boxes. The boxes have different controls, sometimes arranged into scrollable tables. UI looks ok to my users. Clean and simple. Now (the task) -...
LiMar's user avatar
  • 123
2 votes
2 answers
414 views

Validation in Slide Outs (desktop)

I have slide out with a bunch of filters.(sorry, because of private info I can't publish them) I can apply 1, 2 or 5 filters by clicking "Apply Filters". By clicking on filter I can get to its ...
user avatar
3 votes
3 answers
1k views

Thin left sidebar instead of hamburger menu for mobile

I'm interested in designing a mobile-friendly search results page where users can refine their results. I'm thinking about using a left-hand sidebar with the filtering options similar to this Dribbble ...
Janet's user avatar
  • 467
3 votes
2 answers
1k views

Minimalistic expandable / accordion menu button style

I'm trying to make a sidebar/panel to filter products and overall I use minimalist/flat design. Here is the layout, collapsed and expanded. My problem is, as you can see, the accordion button (filter ...
Dolorosa's user avatar
  • 302
3 votes
3 answers
286 views

What to do with this "wasted" space in my side bar navigation mockup?

I am currently working on a new UI design for an existing desktop application. Being mobile/touch friendly is very important for this project, so I am replacing the tradition desktop "File" menu with ...
James Hogle's user avatar