10

I suggest you to do like the most websites. Same shape, side by side, different colours. Highlight and put first the main used button. See good examples below. I know that you ask just about the format and my answer is a bit more complex but this definitely could help you. Make buttons intuitive changing their positions More buttons, more option, more ...


4

Align-left is better for readability, because it have consistent spaces between words. It was find out that readers read faster and comprehend more informations when text is evenly spaced. Justify text is pretty, it can fit more characters in the line, but it is specced randomly. Human brain have to work harder to follow it. More about: http://www.zaetric....


3

Reference Point Locator This is the name in Adobe's applications: transformation reference point Locator. https://helpx.adobe.com/illustrator/using/transforming-objects.html


2

100+ items is a long list, and I think it's important to make categorizing fast, and also to give the user a feeling of progress through the list. With that in mind, I would set up each item with a single tap/click control for A or B. Once selected, items would move to the relevant (maybe collapsed) list elsewhere in the page. If the user wants to change ...


2

I would try to change the bar shape, that way it would go from being an incomplete bar to a semi-complete bar until it get finished with the fully filled bar:


2

Infinite scroll can essentially slow browser down. This would be a bad user experience. I'd suggest you you use normal paging. Provide a check box so that users can mark what they are interested in. Also provide a separate list displaying the items that they have selected for export. Think of it like kind of "shopping cart". Then even in case of scrolling ...


2

This isn't so dissimilar from A-B Testing, where you test two valid or "workable" options to see which works best for users. It'd probably be a fun thing to test, but there's a very big caveat here. Long-time users will be used to the old design, and while some will invite change, others may think the old one is better or easier for them, no matter how ...


2

If buttons are semantically/functional related, then they should be in close proximity regardless of their appearance. An example would be a window/screen that has a 'cancel' button and a 'submit' button. A common practice is place them at opposite sides of the window/screen, but that's not ideal because people have very limited central vision. Even though ...


2

Consider the metaphor you're using and its roots. Buttons. What are buttons? They're an element you can "press" or "click" to take some action. Where does this metaphor come from? From physical machines. Do physical machines have buttons of different size or shape near one another? Yes! Look down at the keyboard in front of you. Assuming you aren't using a ...


2

There are limited shapes we can use for buttons - rectangle, rounded rectangle, circle. If we use too many shapes for buttons, it wouldn look more like icons rather than buttons. It is necessary to keep consistent shape for action buttons as people generally scan interface and consistency helps to fix user attention towards action. Again, if some buttons ...


2

The metaphor that comes to my mind is that of a bidirectional joystick or jog switch type control: At rest in a neutral, central position, and causing motion in the direction of either excursion (up or down, left or right). If executed well, the action of the UI control you describe is very learnable by users, especially if you describe the electric window ...


1

Left align text is most favourable and used in web and mobile user interfaces because the human eye tends in "F-Patterns" - (read from left to right). but if your visual interface/design is for publication/print then align-justified will also works Read this article: https://99designs.com/blog/tips/6-principles-of-visual-hierarchy/


1

I don't think there are specific rules regarding this. If the users know the information are going to check is sensitive, it is more up to them to make sure there is no one around. Anyway, if it is a screen with different information, you can have a similar approach to the password fields, hide the content and put a button beside to show it, you can even ...


1

When you can't find a logical place to put navigation elements, there are more options out of the static. Like an Expandable Search Form that you can put it at the left / over the title: (This example is over a web menu)


1

You want to do what is likely to make the most intuitive sense to your users. Anyone answering here won't know the larger context of how the rest of this site/page is working, so we'll have to make some assumptions. I'm a sample size of one, but the first place I'd intuitively look for search is the upper-right area, like across from "Select your features"....


1

If you're talking about just the image then it's commonly known as avatar, profile avatar or user account avatar. Currently there's a trend of using a letter (usually the initial, sometimes 2 letters) for a neutral gender default avatar if the user hasn't selected one, instead of the previous generic-man-face and variations.


1

Most of the popular design systems out there has basic accessibility built in from the component level which covers the common issues you mentioned like color, contrast and meaningful iconography. But I find this article: https://inclusive-components.design/notifications/ written by Heydon Pickering has in depth details about accessibility like using WAI ...


1

My guess is it would have to do with usability. In the case of the apps using top navigation bar (which, by the way, is also a recommended navigation pattern for Android Apps), usability may be better off by having the "lesser used" actions far away from the user's thumb. By doing this, they free up the space for users to swipe or choose any of the more ...


1

I think this is a very interesting case in understanding whether skeumorphism is the best approach for replicating a physical functionality digitally. Another well-known example is the notorious volume control button which has a very good rationale in its physical implementation but not so much for digital controls (and same with toggle buttons). There are ...


1

Make a left hand side list menu for each of your tab items. And clicking on list menu item will open respective tab content. Its just a vertical arrangement of tab, but to ensure tab titles (now list menus) are not written vertically.


1

A multi-select dropdown might be a way to keep this visually simple. The default setting for each student could read "Use Team Permissions": When the administrator expands the dropdown, the default option is checked: If the administrator checks any other options, the "Use Team Permissions" box becomes unchecked. Likewise, if the "Use Team Permissions" ...


1

Yes, the design of any type of input is essentially an affordance on how the element ought to be used. Affordances: Affordances are an object’s properties that show the possible actions users can take with it, thereby suggesting how they may interact with that object. For instance, a button can look as if it needs to be turned or pushed. The ...


Only top voted, non community-wiki answers of a minimum length are eligible