23
votes
Based on what criteria do you add/not add icons to labels within a toolbar?
There are a couple of reasons:
If there is a generally accepted icon for that feature. Examples, save, cut, copy etc.
If the feature is borrowed from another application which has an app-icon. For ...
22
votes
Based on what criteria do you add/not add icons to labels within a toolbar?
I don't think there's an "official" methodology for this, but I've noticed a pattern across a number of programs. Many programs - especially IDEs - have a number of commands that can be accessed both ...
12
votes
Accepted
Desktop app status bar: Notification vs error message
There's a third option similar to the one used on this page: the message tray icon that is only activated when it has some content with the corresponding number.
Advantage:
The message tray can ...
10
votes
Is it OK to use hamburger menus in iOS?
If you want to follow Apple's Human Interface Guidelines then you have to think of another pattern, because last year they announced that hamburger menus are not a welcomed sight in iOS applications:
...
8
votes
Accepted
I need to justify why having two sidebars on the same side is wrong
Learn, don’t justify
Here's your problem:
How can i justify my assumption
Don't justify it — test it. User experience is about discovering the answer, not enforcing it through ...
6
votes
Desktop app status bar: Notification vs error message
One problem with your first example is in deciding which message to summarize.
In your example, there appear to be two messages (one informative: there's an update available; one error/warning: ...
6
votes
Accepted
Rationale for persistent UI elements that is overlayed onto video windows
Users just don't need to do anything to hide the control bar.
As there is no reason to move the cursor until users want to interact with the controls,
BY using Progressive Disclosure technique MS ...
4
votes
Monochrome or Colorful Icons for the Toolbar of a Desktop Application?
It's a close call, good question.
You have to choose between supporting the primary task (writing) by not distracting attention using monochrome icons and making the secondary task (format text) ...
3
votes
Why is this button of the Windows Explorer labelled "File"?
I can't speak directly for Microsoft, but i think it's pretty obviously a relic of earlier windows versions. Changing the name would hurt more users than a semantically incorrect button does.
You ...
3
votes
How to choose between a Popover, Inspector, or Toolbar to edit properties?
It depends on the context, and the amount of functionality you need to complete a task.
Popovers
Apple declares in their Human Interface Guidelines:
Use a popover to expose a small amount of ...
3
votes
Communicate that an object in the toolbar cannot be added to the document a second time
See each button as a stack of buttons of the same kind. When you drag an instance from the stack, the next one appears. But when it is the last one there is no next button underneath.
2
votes
Is it OK to use hamburger menus in iOS?
I see the hamburger menu in several iOS apps on my phone: Google Maps, Google Drive, Netflix, IMDB, Wikipedia, etc. YouTube uses a "kebab menu," which is similar. So my answer to your question is yes, ...
2
votes
Why is the Windows taskbar default at the bottom?
After some digging I found a post where they explain, that most users (98%, old data, but probably still relevant) don't relocate their taskbar despite the settings being just a right-click away, ...
2
votes
Why is the Windows taskbar default at the bottom?
I know this is a bit of an old question, but here's a possible extra reason:
It means that the cursor movement doesn't need to be precise when navigating an app. If the taskbar was at the top, you ...
2
votes
Accepted
Responsive design for a suggestion/toolbar
Attaching a suggestion.
1) Its an accordion suggested which opens up a sub-menu (Sliced, Chopped etc) if available.
2) More is avoided, and scroll takes care of more content.
3) If there are ...
2
votes
Android: Action bar vs. Toolbar, Spinner vs. Dropdown
@Karen covers the Spinner vs Picker question. Regarding the ActionBar vs Toolbar question:
Definition of Toolbar
A Toolbar is a generalization of action bars for use within
application layouts.
...
2
votes
Why is this button of the Windows Explorer labelled "File"?
Take a look at the Windows Human Interface Guidelines, specifically the Menus section:
Standard menus
Use the standard menu organization for programs that create or view documents. The ...
2
votes
Monochrome or Colorful Icons for the Toolbar of a Desktop Application?
Who is your target audience, and how do they react?
Color helps some people, but hinders others. In my experience, men tend to register color less than women, even allowing for the 10% prevalence of ...
2
votes
Accepted
Can I customize app bars on each destinations in a bottom navigation bar?
There seems to be two questions, so I will try to address both of them.
You can safely customize the app bar on respective tabs
Generally, the user perception of different tabs equals to different ...
2
votes
Accepted
Is a 'single tab-stop' a valid goal for a toolbar which is almost the whole of the UI?
According to that document, it seems there are two main benefits of presenting this as a toolbar and treating it as such.
When a set of controls is visually presented as a group, the toolbar role ...
2
votes
Accepted
What's the optimal toolbar placement?
Place the "toolbar" on the left, and the information panel on the right.
Why?
The F-Pattern
This positioning emphasizes the natural left-to-right movement you mentioned—a user first reads ...
2
votes
Desktop app status bar: Notification vs error message
I think your first option provides more context to the user. Gives a clearer idea of what is happening and I would suggest dropping the icon and instead, go for a coloured label to indicate something. ...
2
votes
Based on what criteria do you add/not add icons to labels within a toolbar?
I would recommend only adding icons when they provide value, ie differentiating between javascript and HTML files. Looking at your screenshot, you would need to create a tonne of similar-looking icons ...
2
votes
Based on what criteria do you add/not add icons to labels within a toolbar?
Simple answer, "Yes".
They chose to provide icons to ubiquitous actions and where applicable they used icons which can be pulled from existing use such as file icons.
There is no need to iconify ...
2
votes
Accepted
Having external links (hyperlinks) and multiple actions in the same dashboard page
It seems like your current table is a cluster of right click functionalities per column , links, buttons and dropdowns.
I would assume that there is no structure or logic as to where actions are ...
2
votes
What is the name of this control that looks like a floating toolbar called?
I checked in the Google Forms code but it's not really helping ha ha :D
Some research
I would go for a mix between utilities and the way it displays.
It seems to be an "Editor Toolbar" that ...
2
votes
Accepted
What is the name of this control that looks like a floating toolbar called?
If you use the Material Design documentation as a reference, I think a navigation rail or a floating action button group would be closest to what you are looking for, but there are always new ...
2
votes
Communicate that an object in the toolbar cannot be added to the document a second time
I think the technique in your Picture A, disabling the button and showing a tooltip when you can place no more, looks fine. It is very similar to how the video game Super Mario Maker 2 handles this ...
1
vote
Accepted
Multi-Workspaced UI
Are the two modes really equal importance? Doesn't the drawing mode create drawings that are effectively embedded in the larger document of the app (correct me if I'm wrong). That is, you have an ...
1
vote
Multi-Workspaced UI
For those who are not familiar with NSTabView mentioned in the poster's question, it's a standard Tab view UI widget for Mac OS that looks like this:
Question: One big unknown is, what kind of use ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
toolbar × 83menu × 14
navigation × 10
buttons × 9
icons × 6
sidebar × 6
android × 5
ios × 5
gui-design × 4
web-app × 4
interface × 4
mobile-web × 4
desktop-application × 4
windows-os × 4
actions × 4
ipad × 4
position × 4
usability × 3
website-design × 3
mobile × 3
layout × 3
iphone × 3
consistency × 3
design × 2
mobile-application × 2