Skip to main content
Share Your Experience: Take the 2024 Developer Survey
44 votes
Accepted

Is it acceptable to place an action button on a tab bar?

You should separate the two actions. Use tabs just for selection and for adding a task you should stick the action to bottom of visible area. Your tasks can be viewed by scrolling within the tabs and ...
Sheraz's user avatar
  • 1,819
24 votes

Is it acceptable to place an action button on a tab bar?

Selection category and its action can be separate, as it likely to confuse most of the users. Having a clear separation between them will be more clear and it also standard practice for mobile. You ...
Yobuddy's user avatar
  • 261
19 votes
Accepted

What is the difference between alert, notification banner and toast message?

Notifications choice often depend on what system you are building for. If you are building for an existing platform e.g. an iOS app or Android app, then most platforms have guidelines which are in ...
stradled's user avatar
  • 2,537
19 votes
Accepted

Should the label for a switch component be tappable on iOS?

In iOS tapping the label does not enable/disable the switch. Go with what ever the convention that is part of the respective operating systems, as the users of those systems will expect the ...
UIO's user avatar
  • 2,684
16 votes
Accepted

Label for input type email in a form

I definitely recommend that you use the word "Email" together with a simple general placeholder like "[email protected]". Email ID: The ID part sounds confusing. It will probably confuse the user ...
Babalwa Mehlomane's user avatar
16 votes
Accepted

Pie Chart VS Doughnut Chart: When to use each?

A doughnut (or donut) chart serves a similar purpose to a pie chart, except that it is able to show more than one set of data. Think of it as a pie chart with an additional dimension. See the example ...
dr_'s user avatar
  • 693
11 votes
Accepted

Does it make sense to have differently shaped buttons together?

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 ...
Rafael Perozin's user avatar
9 votes
Accepted

When is usability over design more important?

You have heard the expression "Form follows Function"? You mention usability over design, but I suspect what you really meant was usability over visual design. Usability (function) always comes ...
SteveD's user avatar
  • 8,924
9 votes

Why does Airbnb put the close button for a dialog on the top left corner?

Airbnb is a US-based company. Most of its revenue generated in the US itself. Statistics shows that ios is the topmost OS used in the US where the close button is located at the top left. By placing ...
Codesigner's user avatar
7 votes

Fullscreen modal vs. conventional modal?

I just went through this same process last week, first starting with full screen modal and then retracting it back to a "standard" modal. TL;DR users will hit the back button in the browser. This ...
Aaron Hudon's user avatar
7 votes

Defined used for the icon: three vertical dots

According to this list: https://material.io/icons/ three vertical dots icon means "more options". Hamburger menu helps user to navigate trhough The document, three dots menu grant user functions as "...
WalterV's user avatar
  • 1,584
7 votes

Accessibility Tools on StackExchange sites

Let's look at the screen reader as an example. It's not worth the money. In general, the number of users that require assistive technologies is relatively quite small, compared to those that don't. ...
maxathousand's user avatar
  • 19.5k
5 votes

What's the difference between cards, panels, and tiles?

According to Google's Material Specification...Tiles have square corners, no more than 2 actions, cannot be rearranged or dismissed. Cards have rounded corners (like playing cards), have multiple ...
Kevin Braun-Braun Interactive's user avatar
5 votes

Using search as main functionality on centre

I wouldn't mix tabs (where you are displaying pages/sections of your app) with search functionality. Don't mix icon labels and text labels in the same tool bar: Don't. Do not combine text ...
Alvaro's user avatar
  • 16.8k
5 votes

Should CTA be placed on all cards

You have two actions available from the card: Visit website Learn more You need to decide which of these is the primary action, and make sure the rest of the content doesn't conflict with these ...
Matt O'Keefe's user avatar
  • 1,860
5 votes

Defined used for the icon: three vertical dots

I agree with @Walter Villa but I think the concept generated from horizontal three dots used for trimming exceeding text to control the flow of UI design representing there are more content for e.g. ...
Niraj Shakya's user avatar
5 votes
Accepted

How long should a loading spinner take to do one rotation?

There are some comments on the question which are quite telling - some people can get stressed or anxious when they have difficulty following the motion of an animation or sequence. Yes, there is ...
Roger Attrill's user avatar
5 votes
Accepted

Modal close button style

For Modals, the common practice is B for web apps. For mobile apps a larger button as seen in A is often used for ease of touch/tap interactions. However in that case, you're more likely to see the ...
truleighsyd's user avatar
5 votes
Accepted

Looking for options to make the UI more pleasant and understandable

Don't worry about 'sexy'; make sure the user knows what they need to do, what they've done, and where they are in the process. Focus on comprehension. Your question is concerned with layout, but ...
Mike M's user avatar
  • 24.7k
5 votes

Should long paragraphs be aligned justified or just left aligned?

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 ...
Ada's user avatar
  • 552
5 votes
Accepted

Is there a name for circles that show progress through form?

Dot navigation Horizontal dot navigation Series of icons in the top or bottom of a content frame: Show how many elements or steps there are In a simple element content, allows easily jump from ...
Danielillo's user avatar
  • 19.1k
5 votes

How to differentiate different states of input field

If your text becomes read-only, then give it the coloring of read-only text. In your case, that's near-black text on a white background, such as you use for your labels. No shading and no border. I ...
Michael Zuschlag's user avatar
5 votes
Accepted

Adding a copy link in the email to copy the verification code

If you're sending via email, you can't use Javascript due to security reasons, so the copy code feature won't work. For SMS or app-based communication (like on mobile devices), phones often recognize ...
Devin's user avatar
  • 38k
4 votes

What is the difference between alert, notification banner and toast message?

Notifications: there are two types of those System notifications that are typically displayed in form of a wide and slim banner on top of the screen and are used to make user aware about a prolonged ...
Zoe K's user avatar
  • 4,958
4 votes

Notification banner with auto close need “close(x)” button?

Yes, because you can't know how "fast" the user is in reading these. A user shouldn't be forced to see the messages until your timer has ran out, he should be given the option to close them as fast as ...
JaVae's user avatar
  • 81
4 votes

What is replacement for Android's Floating Button in iOS?

As Himanshu Vaishnav mentioned, there's no prohibition on using a Floating Action Button (FAB) on iOS, but it's decidedly a part of Google's Material Design system. And while Material Design is a nice ...
Daniel Newman's user avatar
4 votes

How to know which model fits best among Fitts', Walford's and Shannon Model for given data

It is unclear what you are looking for when you ask "which model is best". All three models are telling you the same thing. Saying "the lower the IDe value, the best the model is" or "the higher the ...
Nicholas Pappas's user avatar
4 votes

What are the best methods to test/validate a set of user interface design guidelines for a concept product that does not exist yet?

Do you have the opportunity to create a low-fidelity prototype of the product? The Wizard of Oz experiment comes to mind as it works very well on unfinished products (specifically low-fidelity ...
robin's user avatar
  • 348
4 votes
Accepted

In an organization using SCRUM, who guides design?

Ultimately the UI and design should be guided by users, meaning that you should be doing some form of user research (remote testing, session playback videos, focus groups, A/B testing, lab based user ...
Stephen Keable's user avatar

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