Buttons perform an action or activity in a software solution. Use this tag for questions about how buttons should be placed, styled, aligned or used to express their purpose and facilitate their operation.

learn more… | top users | synonyms (1)

37
votes
16answers
8k views

Should the OK/Cancel buttons be aligned right or centered?

Where should I put the OK/Cancel buttons on my dialogs? At the bottom centered or aligned right? I've seen both and I personally don't care, but I want to create a consistant look across my ...
5
votes
2answers
111 views

What's the best practice for button alignment in responsive email templates?

I was looking for case studies or UX research to figure out what is the best practice for button alignment especially in email templates, but couldn't find anything relevant. Our practice: We tend ...
3
votes
3answers
100 views

alert users that clicking on the button takes the scroll?

i have a big problem for mobile users: i have a google maps that has a width 100% (or less some pixel), if i touch the screen on the map the scroll is inside the map and not scroll of window... So ...
35
votes
10answers
22k views

Alternatives to checkboxes and radio buttons in web-based surveys?

I've been tasked with designing a simple questionnaire design with a lot of different types of questions. I've been taking a lot of web-based surveys myself as well as testing some with users. The ...
0
votes
5answers
115 views

Cancel and Back button on same form?

I have a web application where we end up at a screen with a form and we have both a CANCEL and BACK button on that screen. My doubts are : Should we clear out the form on pressing the back button? ...
9
votes
4answers
483 views

Is it a good idea to show progress indicator inside a button?

Typical examples: http://msurguy.github.io/ladda-bootstrap Crazier examples: http://tympanus.net/Development/ProgressButtonStyles This is for a desktop app if it matters. Consider that the target ...
1
vote
1answer
70 views

Snap-to-increment Ranger Slider vs. Buttons

I am working on an app which requires filtering of distance: < 10km < 25km < 50km < 100km My options are: 1 row with 4 buttons for each distance option, or a range slider that snaps on ...
3
votes
2answers
503 views

How to display negative, positive, warning, and neutral colors in website if the theme includes one of those colors?

The following colors, generally, mean the following: Positive: Green. Negative: Red. (though negative and positive are reversed in China) Warning: Yellow. Neutral: Gray. Now, what if I made a ...
7
votes
5answers
189 views

How to communicate visually the ability to change columns in a table

Often websites may include functionality that allows a user to select what columns appear in a table. When this occurs, what is the best way to visually communicate this action, so the user both ...
0
votes
0answers
47 views

Advice on document management controls [closed]

I have screen which includes application for user project. This screen is important for control system which is control all projects, documents, users etc. User have to download draft documents and ...
295
votes
20answers
40k views

Should a toggle button show its current state or the state to which it will change?

I have a quick question about buttons that toggle between two states. (Think Play/Pause, or Shuffle/Regular Play.) As the title says, should the toggle show it's current state or the state to which it ...
2
votes
1answer
93 views

Button text based on previous button's context

There's a table with a list of files that need to be tagged before uploading. The table might get longer than the page height, so it's scrollable, and above it there are buttons that work on selected ...
2
votes
5answers
415 views

Microsoft Windows Dialog: No Close Button Scenario(s)

Windows Dev Center states: "Dialog boxes always have a Close button...Don't disable the Close button. Having a Close button helps users stay in control by allowing them to close windows they don't ...
0
votes
3answers
97 views

Where to place close button

I have a main view with a settings button on the top middle part of the screen as follows (please excuse the bad mockup): After touching this button, The settings shows with animation of it coming ...
5
votes
1answer
141 views

Standard behaviour of dropdown buttons and its styling

I have been reviewing some UI design patterns where the use of dropdown buttons as both a selection and call-to-action has been ambiguous, and I am thinking of how it relates to various design ...
1
vote
2answers
96 views

Lots of buttons with user input if none are applicable

I am creating a quiz and one of the questions needs to have a list of options for the user to select one. But also, if the answer is not in the options, I need to allow the user the write the answer ...
4
votes
2answers
71 views

View Blockage vs disable button in mobile app form submission in cases of slow server response time

I am developing a mobile application. In cases where the server takes too long to respond during form submission, what is considered a best/widely acceptable practice to prevent users from trying to ...
3
votes
2answers
39 views

Changing button alpha value v button text colour to indicate current button status

I'm working on an old iOS app which requires updating. This app requires users to make selections from various screens. For example, the user needs to make two choices on the main screen before ...
1
vote
1answer
56 views

Allow multiple actions for each word of a text

I'm searching for a way to have a quick method of applying two different actions to each word within a text. I currently try do design a UI to help myself learn new vocabulary by reading texts. For ...
1
vote
2answers
62 views

Are there any established patterns for triggering an overpanel on mobile (iOS and Android)?

By default, I'm showing a screen with a particular country selected. To change the country, when the user taps on the text I trigger an overpanel listing the available countries to choose, but it isn'...
1
vote
1answer
57 views

How to display additional information in a form

I have a rather complex form that might require some additional information to the user so (s)he might be able to fill in the form correctly. Just above the form, there is a piece of brief ...
2
votes
2answers
44 views

How to make specific “Take action” buttons or blocks?

Let me explain what I need... I have a dashboard for transportation companies. In that dashboard, we have info about the user and all the invoices that he made: the ones that he has to correct ...
7
votes
8answers
603 views

UI button labeling in touch/mobile web and native apps

The concerns are based on my own end-user experience with touch applications (both native and web SPA). Even slim and clean UIs may be prone to the same problem - the learning curve is gradual than ...
5
votes
6answers
2k views

Button order Save | Save and next | Cancel | Previous

In an application, the user is able to edit the information of several objects. The user is able to save and go to the next object. What is a good order for this buttons?
5
votes
5answers
119 views

Which element to emphasis in a list

On the site I'm working on, we have a list of buttons which make donations. We would like to promote a specific donation button so it will convey more traffic. We tends to prefer less big donations ...
4
votes
2answers
172 views

Is the 'Sell It' button annoying? [closed]

I am developing an android application that is about buying or selling second hand stuff around your area. The screenshot is from the list of the app and i wonder if this button will be annoying for ...
1
vote
4answers
245 views

Sticky submit button at top and bottom of the form?

Typical mental model suggests that submit button is at the end of the form. Should I go with button at top as well as bottom. since in our application we put action items on a sticky bar at top at top....
3
votes
3answers
96 views

Improving button state by only changing colours

Background In short, the above 'Object list' increases in content when the different buttons at the top (A, B, C, D & E) are selected. These buttons look like tabs, but since several can be ...
30
votes
7answers
10k views

Do I really need a button?

I have a slider - it's actually 2 jquery slider bars where the user can select 2 values, then press a button to go to the next page. The question is do I really need a button or is it just taking up ...
3
votes
3answers
83 views

What is the practical consideration and impact on user experience when the designer makes the logout link/button difficult to access?

It seems like many websites go to great lengths to make the logout link/button very difficult to find or click on. For returning users hiding the logout link/button doesn't make sense because they ...
3
votes
1answer
83 views

Order of buttons when on the right of the page

I've been going through various posts on this board to clarify my doubts but I haven't found anything yet. As I understand, there are 3 methods of positioning buttons, by importance of the action. ...
27
votes
6answers
3k views

What's the point of a “Read full story” button?

I've noticed a lot of news websites, particularly on mobile, sometimes will cut off their story with a button you have to click to see the rest of it. I can understand why they'd do this if they ...
15
votes
8answers
4k views

What is the best way to show my users that buttons in the same line have different functionality?

I have four buttons on my interface that all look the same but don't all act the same. They are laid out like the example below. download bmml source – Wireframes created with Balsamiq ...
2
votes
3answers
97 views

Social Icons and Download Badges in mailer header?

Im currently doing a mailer design. I've placed the social icons in the header, next to the company logo. Underneath the social links I have put download badges, before the main content of the mailer....
3
votes
3answers
187 views

Is a plus symbol without button text sufficient to denote adding of an item?

Let's say I'm using Bootstrap panels and I have these two choices: Option A) Option B) Which option is better from a UX perspective? Is a plus symbol without button text sufficient to denote ...
3
votes
2answers
1k views

Why Google Chrome does not have a GoTo link button like other browsers?

Why google chrome does not provide a GoTo Link button like in IE, Firefox, etc.? And if this is because of the simple & modern design concept than why does other browsers still have GoTo ...
1
vote
2answers
164 views

Select from option list and apply action

I have several labels that are associated with text, e.g. Default : Text Label1 : 123 Label2 : 456 Label3 : 789 The UI for this is currently structured as follows: [Default ▾] [Save] [Save as] [...
1
vote
1answer
289 views

UX modal window: Cancel / Save / Close vs Cancel / Save & Exit

I am working on an application where the user needs to complete their preferences which open in a modal window. There has been a big discussion about what are the best practices in this situation. ...
29
votes
3answers
2k views

More clicks while using “Noun” or “Verb” for actions?

“Sign up” or “Membership”? “Donate Now” or “Donations”? You can create an action button with verb or a noun. Is there any recommendation for increasing the click-rates? Which one is better than the ...
1
vote
1answer
560 views

Best user friendly option for buttons and icons placement

I have created below UI controls... but I am not sure if they are really user friendly or not... so overall they should look good as well as user should be able to understand moment they see that ...
5
votes
2answers
159 views

Icon size inside a button [closed]

Is there a correct size, or relative size, to use on an icon within a button with/without text? I've seen this being used a lot of times but didn't found any source about choosing the proper icon ...
36
votes
6answers
23k views

What is the optimum button size of touch screen applications?

There was a not so recent blog post about the ideal button size of touch screen control sizes (sorry there is no link, the website is now a spam trap) that was based on the study form the MIT touch ...
5
votes
2answers
679 views

Evidence of a difference in conversion rate between a “ghost” and a “traditional” button?

Many new sites have been applying the "Ghost Buttons" in landing pages. Same people are saying this is a new trend of 2014. I think with the “ghost button” we have a beautiful and clean design. ...
4
votes
5answers
165 views

Do we really require a reset button for form fields?

I am questioning the use, in web form design, of reset buttons placed along with "Submit" or "Finish" buttons. What happens if a user accidentally clicks on "Reset" button after filling up all ...
1
vote
1answer
37 views

Best way to place table specific functions [closed]

I am looking for the most intuitive location for table specific functions. In our webapplication, which is available on all devices, we display large amount of data in tables. The columns of these ...
3
votes
2answers
82 views

Grid action button selection

Problem statement: 1. Need to select individual row and Copy. 2. Need to select multiple rows and Copy. 3. Need to select items from different page (Pagination) and Copy. 4. Need to select all items ...
1
vote
2answers
19 views

Save untested connection when testing is possible?

I have an admin console where I can add configure different data sources for my web application. The page looks like this : Some of my queries are : What is the ideal scenario for test and save ...
4
votes
3answers
45 views

Focusing users on specific option/fragment creating the opposite reaction

i've made a research about my app today, and i've found some unexpected results. The default/opening screen of my app(iOS) is : The user can create a live photo from video or a photo. The "Video | ...
23
votes
7answers
2k views

Placement of buttons for Previous, Next, and Save Draft actions

I am designing a five step form. The user can exit the form and return to it later. So I have a Previous, Next, and Save Draft action. What is the ideal placement of the buttons/elements? I want ...
0
votes
2answers
61 views

Giving positive/negative connotation to two textual options/buttons

I'm developing an "photo editor'ish" mobile application. After the user has finished processing their photo (such as choosing filters, shape, etc), the user should save the outcome to their camera ...