Questions tagged [modal]

A shorthand way of saying "modal window": a panel that appears over and disables the main content, requiring user interaction with it.

Filter by
Sorted by
Tagged with
0 votes
1 answer
92 views

What justifies a full page modal navigation?

What arguments support having a full page modal acting as a hub that takes you to different actions / pages that are linked together? For instance imagine an app where you manage recipes, you would ...
user avatar
0 votes
2 answers
47 views

How to present six or more options in a card / modal on mobile screen (to abort an order)

I am working on an app which is used by workers to complete an order within a fixed/ closed process. Since the process is closed until the order is finished, workers need the option to abort in case ...
user avatar
  • 1
0 votes
0 answers
31 views

Bottom sheet on top of popup on mobile

Is it problematic to open a bottom sheet on top of a popup on mobile? Flow User is shown a popup User taps "Select option" dropdown-like input field Bottom sheet with options are shown on ...
user avatar
1 vote
2 answers
58 views

Label to dismiss a dialog box?

I have a dialog box that is asking a user to confirm the cancellation of a task. Since the main CTA already says, "Yes, cancel this task", it might be confusing for the action to exit the ...
user avatar
  • 1,042
1 vote
1 answer
77 views

Can I use both toggle switch and checkbox in one modal?

First of all, I am not a native speaker, I ask for your understanding even if the writing is weird. I'll explain it in as much detail as possible. If you need further explanation, please leave a ...
user avatar
2 votes
2 answers
120 views

Edit mode + Side panel/Modal, how to deal with double validation?

I am currently struggling with an edit mode user scenario inside a web application. Context The web application will be used also on mobile, so we can't use “on hover” comportment. 99% of the time, ...
user avatar
  • 331
20 votes
7 answers
3k views

Intuitive dialog for choosing whether to close and lose changes or keep editing

It's a pretty simple use case. I have a modal with an editable form. If the user enters something into the form and then tries to cancel, we want to warn them they have unsaved changes, which they'll ...
user avatar
  • 333
1 vote
4 answers
107 views

Modal with horizontal tabs, each tab has different content size

I have a modal, which has horizontal tabs at the top of it. Below the tabs is the tab content. Each content has different height. Without properly handling it - the modal size will have to change, ...
user avatar
0 votes
2 answers
62 views

Close/Cancel function: Use Secondary or Warning type button?

Some software systems use the secondary button for cancel/close functions, and others use the warning button (usually red). Which is more correct?
user avatar
0 votes
1 answer
82 views

Good idea to design go back button in modal

I need some directions, currently I have a list, if I click one of the items, one modal is shown with information about the item previously selected, and a list of its children, so if I click one of ...
user avatar
0 votes
2 answers
133 views

What is this mobile bottom sheet UI element called?

I want to communicate the implementation of this kind of bottom sheet to developers, specifically how it's a tall bottom sheet, but you can still see the background minimized underneath. What is this ...
user avatar
3 votes
1 answer
730 views

Is it a good practise to load contents outside of modal?

There is a dropdown and date-picker inside a modal and the size of the modal is small, so when we click on the date-picker the widget is overflowing the modal. Is this a good practise? or should we ...
user avatar
  • 1,040
20 votes
8 answers
5k views

Close button position: corner or inside?

This is the modal dialog for the admin page. We had a discussion about the close button position. Which one do you think is better? A is more common and can be seen in many great web apps (Figma, ...
user avatar
0 votes
1 answer
118 views

Maximum modal size?

I am working on a problem where we need to show the users a preview of an image through a modal. We want them to have the maximum possible view within a modal and not create a separate page for that. ...
user avatar
1 vote
2 answers
253 views

Delete confirmation for items within a modal

I have a modal that contains a table of items. Each item is in a row and a user should be able to edit/delete each item. When deleting an item, there needs to be a confirmation dialog asking the user ...
user avatar
  • 1,042
1 vote
2 answers
107 views

Which button layout is the best?

I'm currently working on a modal in app, that can be display in full screen. I'm having some issue about the way to close this modal. In the first situation, we can have a “Fermer” (close) button as ...
user avatar
1 vote
3 answers
166 views

Best way to show attachments

I've designed an HTML table where each row can contain attachments. Each row has a grey paper clip icon which, when clicked, opens a file selector. The user can then upload file(s) to S3. After a ...
user avatar
5 votes
3 answers
1k views

Should closing the dialog clear its fields?

I identified as the most preferrable strategy for user not to lose their data implementation of confirmation/discard dialog when exiting original one. I expect a few more form dialogs to emerge in ...
user avatar
  • 151
2 votes
1 answer
266 views

Should hitting the ESC key close a modal that has a form?

Typically, when you hit the ESC key, that closes a modal. But if this modal contains a form that the user needs to fill out, that would mean that hitting ESC (sometimes, inadvertently) closes the ...
user avatar
  • 1,042
1 vote
2 answers
153 views

What sort of progress indicator would you use for this task?

I have checked online as well as on the forum here that touches on my specific scenario and have not had any luck. Context: User downloads a third party app from our platform but they are missing ...
user avatar
2 votes
1 answer
316 views

How to best handle a modal with multiple tabs and buttons

We have a modal that is used for an action to Add an item and Edit an existing item. It also has a button to delete the item all together. I am trying to determine the best way to handle the button ...
user avatar
2 votes
2 answers
191 views

When displaying an "OK/Cancel" button group that is right-aligned should the main action be on the right?

I am designing an "OK/Cancel" button group on a modal hence this button group is right-aligned. Since this is the case I have placed the main action button "OK" on the right, and ...
user avatar
  • 195
2 votes
1 answer
159 views

What is the best way to add edit and delete buttons to a modal?

I have a task data visualization modal, but I need to add an option to edit or delete these tasks. Where in this modal could I insert buttons to delete or edit?
user avatar
0 votes
2 answers
137 views

Modal over another modal [duplicate]

we have a new feature annoucement pop up which comes once to the user on our dashboard. when we speak about new feature it is ideal to show the the demo video as well i feel. so we have inluded a ...
user avatar
1 vote
1 answer
200 views

Show/Hide Toggle for a Toggle

We have a toggle available in our main screen, to enable/disable an important functionality. Since, only 30% of our users use this functionality at least once per month, we are considering to (...
user avatar
  • 119
26 votes
5 answers
6k views

What is better: to have a modal open instantly and then load its contents, or to load its contents and then open it?

Let's say you have a button. When you click it a GET request is fired for some data (for this example assume that the data cannot be prefetched). Then a modal opens and displays that data in a pretty ...
user avatar
2 votes
2 answers
264 views

Align width of dropdown menu to?

In the past I ran often into the problem, that I did not know how to decide the width of a dropdown menu. I as a designer don’t mind to just eyeball a good-looking width, but developers would love to ...
user avatar
1 vote
1 answer
71 views

Is this called Handle or Grip?

I was wondering what the correct discription for the little handle within an iOS Modal is? The little Handle on the very top of the Modal....Is it a handle? Or a Grip?
user avatar
  • 51
2 votes
2 answers
187 views

Change size of modal in wizard experience

I am building a wizard experience to guide a user through a complex setup flow. In the flow, some steps require more space and some require less space. Does it make sense to change the modal size on ...
user avatar
0 votes
1 answer
204 views

Is it okay to show the loads of data on modal or on the new web page?

I am working on an application which has some data in tabular format. There is a view button for each row. So my question is: After clicking on that button, should I show the data on the new web ...
user avatar
2 votes
1 answer
99 views

Warning/ Information on top of a Modal

I want to give users a warning on a modal that changing one form field has implications on another form field. I am aware of 2 patterns that are used as shown here. I am seeking suggestions on what UI ...
user avatar
0 votes
2 answers
85 views

Hover up modal over another hover up modal in mobile UI

Is it better to use a hover up modal over another hover up modal on mobile UI? In the current situation I want to open an information page when the user taps on a certain card, and that information ...
user avatar
1 vote
2 answers
149 views

Is it okay to display list of members/users in a modal?

I'm currently designing an interface similar to Slack/Discord. Is it possible to display the list of members in a modal? I've already checked multiple platforms (Discord, Slack, Quora, FB) but they ...
user avatar
  • 613
2 votes
3 answers
86 views

Should browser page back present modals as well as pages?

Currently, on using the browser back button, our site pages back through not only the pages but any modals used. So if the modals were part of a 'series' (e.g. three consecutive modals to capture ...
user avatar
  • 21
1 vote
1 answer
352 views

Could i use a drawer within an overlay modal?

I'm prototyping a candidate selection application for a job agency. The client needs a module in which they can filter to search for the right candidates for a job. When they click on a candidate in ...
user avatar
1 vote
4 answers
467 views

Really long list inside a modal-- fix the height of the list and make it scrollable?

I have a modal with some options that are selectable. It's currently longer than the screen. You can of course still scroll the full screen. Should we make the list a smaller fixed height and the ...
user avatar
  • 151
2 votes
1 answer
1k views

Best size for modal

I am designing a modal for enterprise application. What is the optimal size for modal width and height. I need to design one for small medium and large.. Is there a resource or user research done ...
user avatar
1 vote
3 answers
592 views

How to define modal size?

I want to design a modal-dialog, which contains a stepper. Also in some cases, the input fields are not too many and in other cases, they are A LOT of them. Which means if I predefine the size of the ...
user avatar
0 votes
2 answers
63 views

Open message in modal or in separate page?

Unfortunately I can't provide visual examples now, I hope that's not a problem. The question is simple: we have an inbox, which displays all the private messages a user has received, nothing new so ...
user avatar
  • 185
2 votes
1 answer
57 views

Need help with showing information in a limited space

Well, it is my first time seeking help for user experience design, so pardon me as I am not accustomed to the proper rules. I have an information card which shows a thumbnail for a video and below it,...
user avatar
1 vote
1 answer
55 views

Is it bad UX for a form to be presented in different formats (either in a modal or separate page), depending on context?

I'm designing an internal tool in which a user, at certain points, will need to fill out a fairly detailed form in order to add a piece of content to our user-facing platform. However, the challenge ...
user avatar
  • 533
2 votes
2 answers
138 views

If a user clicks an action link from w/in a modal and is then taken to a separate page, do they return to that open modal after completing the action?

I'm designing an internal tool that enables my coworkers to curate post-op care plans for orthopedic patients on our platform (basically sending educational content to users at specific intervals). I'...
user avatar
  • 533
1 vote
2 answers
231 views

Is it best practice to place an editable data table in a modal/popup?

I am curious if this is already established as best practice but so far I haven't seen any standards on this. Let me know your thoughts. Scenario is: We are trying to go with either V1 or V2 inside ...
user avatar
0 votes
2 answers
175 views

Best place to show a confirmation modal in a purchase flow

So, I'm working on an insurance ecommerce and would like to get input on where to show a confirmation modal. Let's say I am in the summary page, and there's a "Change Plan" button to choose another ...
user avatar
3 votes
3 answers
473 views

Modal button positioning on mobile

I am designing a design system for my company and am currently looking at designing the modals and dialogues for both desktop(tablet too) and mobile. I have placed the primary action to the bottom ...
user avatar
2 votes
3 answers
3k views

Is a double modal pop up a concern?

What I mean is that say you select something on a webpage. It serves you a modal pop-up form to complete. On this form is a date-picker which would serve another full screen (on mobile) modal pop up. ...
user avatar
  • 484
3 votes
1 answer
889 views

Sidebar modal - pros & cons?

Do slide-out modals work well in your experience? Our requirements are to present deeper, specific content to users without taking them out of a flow, so linking to another page is not being ...
user avatar
1 vote
2 answers
1k views

Modal and overlay behavior - When to close the modal

Considering a modal/popup over an overlay, I know that there are certain acceptable ways (as per need), as to which interaction should close the modal, as below: Clicking on overlay Hitting esc key ...
user avatar
  • 195
1 vote
1 answer
2k views

Slide out panel or new page

I'm in the middle of redesigning a section of our app which lists files + folders, and I'm not sure which approach would be best from a UX point of view. The current system has a show action for each ...
user avatar
1 vote
1 answer
127 views

on-demand scrolling modal?

On our desktop site, our response for many places where table, or cards, is used to display data, is to have a button that spawns a modal for adding a record to the table/cards. The models for these ...
user avatar