Questions tagged [forms]

Forms are a collection of input fields and design patterns that collect and process different types of qualitative and quantitative data input from users. Can include the visible user interface components as well as the logic required for controlling aspects of its behavior such as form validation, data retrieval and storing of incomplete forms.

Filter by
Sorted by
Tagged with
1 vote
2 answers
36 views

Auto numbering on questions

I'm designing a survey form builder. One proposed feature is to allow administrators to enable automatic numbering for questions and question groups. However, the software's robust logic and rule ...
Adela Kovářová's user avatar
2 votes
1 answer
61 views

Error message on blue background form?

I am trying to make an error message that is visible and matches the styling of a blue form, image attached. I am having difficulty since the red doesn't stand out against the blue background. Any ...
Laura's user avatar
  • 21
0 votes
1 answer
70 views

Should this edit form have fewer items than the add-new form?

I have an edit user form with the following fields: name, alternative name, gender, birthday, country, address, mobile phone, telephone, fax, email, Line, Facebook, and WeChat. Should the add new user ...
wyc's user avatar
  • 1,599
0 votes
0 answers
28 views

Full width buttons on desktop web application [duplicate]

I have a design for a form with a full width button, this is a desktop web application and for context it is an interactive shell/terminal that lest you submit API requests. It essentially looks like ...
Jeff S.'s user avatar
  • 223
1 vote
2 answers
50 views

Best way to reorganize large forms with niche user group?

I've hit a challenge with designing a web application that has a long form with many text field inputs (30+). Solutions go against best practices. Users are very technical and are engineers who need ...
Tina's user avatar
  • 21
0 votes
1 answer
33 views

Form validation question where if you click in a required field but leave it without typing it displays an error

This is a form on a webpage with about 8 text fields. I am curious has anyone seen this pattern which I am thinking of using. The submit button on the form is disabled. If the user clicks in a ...
Keano's user avatar
  • 71
1 vote
1 answer
45 views

How to let users add to a long chunk of text without editing the existing text?

I'm creating a form that generates a description (2-3 sentences) based on the user's choices. I want to allow users to then add more text to the description, but without editing the existing text. Any ...
Rachel's user avatar
  • 11
0 votes
1 answer
87 views

What could I use instead of these pill drop down selectors

I am looking for a alternative way to display multiple options for a user selection. The user selects a part and then must select a choice of options which populates a table. I tried with 'pill' ...
Ryan's user avatar
  • 1
0 votes
2 answers
156 views

How to display range of thousands of dollars in a HTML dropdown

For a website that provides kitchen renovations, we want to display a range of budgets. These are on $1,000s of dollars in a range from $35,000 - > $150,000 We are considering a range of ways to ...
jdog's user avatar
  • 103
0 votes
0 answers
31 views

Location of advanced options on form

In our platform, you can schedule routine scans. Imagine you can check boxes to scan for people, cars, locations. But under advanced options (located currently at the bottom) you can perform a type of ...
merlin's user avatar
  • 21
0 votes
1 answer
92 views

Creating discounts that are stackable

I'm creating a stacked discount setup page and I am stuck on a screen. I do not know how do I visualise the setup when the input can be numerical or 'all' items at any point of time. Imagine you have ...
confake's user avatar
  • 13
2 votes
1 answer
85 views

What's the best way to dynamically hide/show form elements when a user enters a value in a text/number field?

Context I work for a company that designs financial management software, and I've been asked to provide some redesigns for an expense rule builder. It allows users with admin privileges to set limits ...
AJS's user avatar
  • 21
1 vote
1 answer
67 views

Is providing a user with a 'change view' option when completing a long form a good user experience?

For context, I am designing a new form that a user is required to complete in a modal window. I have two options designed: a long scrollable form, and the same form broken into sections displayed ...
DAC84's user avatar
  • 113
1 vote
2 answers
62 views

Minimum focus style for a text input

I'm currently working on a chat style UI that has a single text input for entering a message. Usually I would follow the recommended accessibility best practises for the correct focus styling. I know ...
Burns's user avatar
  • 45
2 votes
1 answer
54 views

Examples of multi-step asynchronous workflows

our SaaS product has a very interesting 'workflow' pattern, and we are looking for examples of how other products might have handled this. It works like this: User fills out a short form (5 fields) ...
Max Prodaniuk's user avatar
1 vote
2 answers
100 views

Disabled options within a drop down

I have a scenario where a user can select a name from a dropdown list which will then prefill their details. They may need to add details for multiple people. So, if there are 2 people. I select a ...
Peter Rowland's user avatar
1 vote
0 answers
32 views

How to have a form and a preview of what the form generates on a small screen? [closed]

I am looking at this webcode.tools page: You find this pattern a lot, like with codesandbox and other places. I am thinking of putting ads on the left and right as persistent (320px width each), so ...
Lance's user avatar
  • 441
0 votes
1 answer
40 views

File download required before validation (mobile) [closed]

In mobile app I working on, I need force the user to download a file (GDPR) before validating a form. I dont have idea how to make it user-friendly. Can you help me?
hari44's user avatar
  • 13
1 vote
2 answers
72 views

When my page has multiple input forms with a range of options from 2 - 10, should i use dropdowns, segmented control, or a mix of both?

I have a form where the user select multiple different inputs. One input might have only 2 options (parent,child), while the next input might have 5 options (age: 0, 1-18, 18-25, 25-55, 55+), etc. ...
Gene's user avatar
  • 1,315
1 vote
1 answer
79 views

How to add a new contact inside a form using a contact dropdown?

I have a form using a contact dropdown and I would like to add a contact if the contact isn't present in the list. I need at least 2 fields for a contact (firstname and lastname). For example : I've ...
Jean-Pascal's user avatar
2 votes
1 answer
67 views

Are there any guidelines for using the auto focus (programmatic focus) on a webpage by WCAG 2.0?

Regarding ADA compliance and web accessibility guidelines like WCAG and WAI-ARIA, is there a specific requirement recommending the auto-focusing of input fields after service failure error (not a ...
BlendedThinking's user avatar
1 vote
1 answer
42 views

How to call bottom sheet?

Well I have a form look and since I avoided to use dropdowns and in this case I have a category which user has to pick from bottom sheet (I use them to replace dropdowns). Now I don't know how to in ...
Paco's user avatar
  • 51
2 votes
2 answers
87 views

Best method for ordering information in a form

Is there a good method for deciding on layout and order of information in a complex form ? For example - deciding how to order many customer details in a CRM system. Should the main criteria for order ...
Ido Levran's user avatar
1 vote
1 answer
44 views

Giving user a visual cue that form controls are disabled after clicking submit, while the form is being processed?

Never tested or researched this, tbh. After clicking submit, the submit button's label is replaced by a "processing" animation indicator. Functionally - the form is disabled, so user can't ...
Bojan Djuricic's user avatar
2 votes
1 answer
60 views

Whats a better way to group dates on a form

Looking to improve a claims form that claims assessors to review and approve in the insurance industry. One of the comments the user mentioned was that dates related to the claim was all over the ...
Blue Ocean's user avatar
  • 10.7k
12 votes
4 answers
3k views

What is the best UI for allowing the repeated selection of the same item from a list?

In my project, I have two lists of items: on the left, all the possible items for selection, and on the right, those that have been chosen. Unlike typical scenarios, in my case, the same item can be ...
Alice's user avatar
  • 143
7 votes
5 answers
2k views

Suggestions for UI for Delicate Question w/ Several Options?

I’m a longtime (20+ years) UI/UX designer and full stack developer, but I’m running into a wall with the UI for a specific field, concerning a delicate question that can be approached and handled in ...
Avana Vana's user avatar
2 votes
1 answer
86 views

Hiding the delete button behind 1, possibly 2 clicks

I have to anonymize this substantially, so forgive the abstraction, but here is the debate. There is an interface in which you can create an object. This object has several attributes, as well as sub-...
JClaussFTW's user avatar
  • 1,326
1 vote
3 answers
150 views

Cancel button to go back after Saving

In a desktop application, I have a form which the user can edit some data, then save it. When they save, they stay on the same page and get the feedback message like "Campaign saved". And to ...
feelerino's user avatar
  • 315
1 vote
1 answer
57 views

Balancing Create/Delete Options

In my admin page for a course registration system, administrators can create courses with attributes like city, school, and course name. Admins also need to manage cities and schools by creating or ...
user169841's user avatar
1 vote
1 answer
73 views

Multiple action buttons each with explanations

If I intend for a user to click one of four related but different submit buttons on a page and I also plan on having a brief paragraph explaining what each button is supposed to accomplish, what is ...
hello's user avatar
  • 265
1 vote
1 answer
86 views

How to design UI feedback from a form submission so it doesn't jolt the layout of the webpage?

I have this basic email subscribe input, and I'm wondering a general pattern for not having the error "notification" move the input down the page when it appears.... There can be 2 states: ...
Lance's user avatar
  • 441
1 vote
3 answers
110 views

Redesigning our searchbar

Our users are having trouble with our search bar. They don't realize they need to click the search icon to start searching. To make it clearer, I've come up with three solutions: A. Replace the icon ...
Jonathan's user avatar
  • 111
1 vote
1 answer
44 views

Uploading images - copying multiple form fields from one to multiple elements

Issue: We have an image upload form where the user needs to fill in several form fields related to each image, such as the author, description, expiration date, and comment. Some of these fields will ...
krolowa_swiata's user avatar
1 vote
1 answer
51 views

Form filling: Should we hide non-essential fields, or should we display all fields to the user?

My current task involves enhancing the user experience (UI) in various sections of the SaaS product I'm working on. Within this system, some non-essential fields are currently concealed behind the '...
Niall blair's user avatar
1 vote
1 answer
163 views

Best layout for radio buttons on forms

I have a webpage with a form arranged in a "Z" pattern, consisting of input fields. Additionally, I need to incorporate three radio button choices into the layout. Given that I've organized ...
Mourad's user avatar
  • 87
1 vote
1 answer
62 views

How to ensure accessibility for a variable-length collection of name fields in a form

My company supports a legacy application which uses a data form containing a Recipient section and a Sender section. Each section, upon first load, contains three text inputs (horizontally aligned) ...
user79517's user avatar
1 vote
2 answers
42 views

Handling and parsing string with multiple elements to the form using one input

We have a problem that we want to solve in the most intuitive way. There is a modal with one text input, but the requirements are for user to be able to put one OR multiple email in it. This is needed ...
Glib Zaitsev's user avatar
1 vote
1 answer
79 views

Design suggestion for a register page via smartcard

Context Developing a Login/Registration page Security is very important To reduce code complexity, I want to use just one controller and FXML page. I want to create a form to register three users at ...
Billie's user avatar
  • 13
1 vote
1 answer
43 views

How should the form behave when only a single question requires loading?

This is a form for an airlines platform that users need to fill to proceed checking in to their flight. The country dropdown may or may not change the questions below it depending on the country but ...
sarp's user avatar
  • 85
2 votes
1 answer
334 views

Best way to indicate required vs optional fields

I'm having some issues deciding how to indicate to users the some fields are required and some are optional. I've encountered these three scenarios, and the following solutions: All fields are ...
Mourad's user avatar
  • 87
1 vote
2 answers
66 views

How do you show populated values in forms?

I’m trying to improve the consistency in form designs (for tickets) while informing all members of the team (design/dev/product) of the type of answer that would make a specific input field ‘completed’...
Amesh Patel's user avatar
1 vote
1 answer
59 views

What is better way to implement category selection?

I am developing an android app and currently have a AutoCompletEditText implemented for selecting source of meme. However I want to limit source selection to limited number of options and therefore it ...
Melnyk_Vik's user avatar
1 vote
1 answer
18 views

Typeahead that makes it clear whether you've selected an extant entity or are creating a new one

We have a typeahead that lets users identify a dog in our database (by name) or specify the name of a new dog to be added to the database. Is there a good UI pattern that helps make it crystal clear ...
duhaime's user avatar
  • 247
0 votes
2 answers
75 views

Adding Custom Form Field

I have a tricky thing to solve. This would be used for fast food menu. First field is pretty much Name of the Group ex "Choose the sauce" and other 2 fields (and 2 fields should aways exist ...
Paco's user avatar
  • 51
0 votes
2 answers
63 views

ID number for each question in a long form

I'm redesigning a long form. I'm grouping the questions in logical chunks and communicating progress. Originally each question had an number ID as it follows: 2. Main group of questions 2.1 Subgroup ...
Danielst's user avatar
  • 371
1 vote
2 answers
107 views

Big form with blocks within blocks within blocks: how to improve or avoid this?

Apologies if this has been posted before. I'm doing a visual rework on an existing webapp that's essentially a big form with a bunch of form fields, that are divided into sections, subsections, and ...
Eva's user avatar
  • 13
0 votes
1 answer
342 views

How to create a multi step form with conditional steps?

I am designing a highly complex form for creating a software company. We are yet to decide on if the form needs to be designed as a Wizard. The first step of the form will gather basic details and ...
Shubham Tank's user avatar
0 votes
2 answers
241 views

Should I prevent users from passing max values or display errors when they do this?

I have several text fields that have max value, I want to provide good UX when the user enters the values. Let's take an example of the percent field which accepts digit values between 0 and 100. My ...
Menai Ala Eddine - Aladdin's user avatar
0 votes
2 answers
818 views

Showing error messages on form without shifting layout?

I have a form where I want to show some errors (like "Email field required"). What I currently have is a red error message under the description (like shown below). The issue is, when the ...
Artur Carvalho's user avatar

1
2 3 4 5
57