Once I select search icon, the pop up appears as shown in the image. Results are displayed in the same popup. But the problem is once I select one of the Pins (say Pin 1) a pop up appears with additional information as shown in image 2 on first popup.

So is it good UX practice to have two popups? Or should I close the first popup once the user selects a pin and just keep second popup?

enter image description here

  • You can probably try like a in place popover. – LegendaryAks Mar 16 '16 at 5:36
  • The real problem lies in the fact that the foreground modal always needs to be smaller than the one in the background—if the opacity is set at 1. – Knu Mar 16 '16 at 6:26
  • Absolutely NO ! – Kristiyan Lukanov Mar 16 '16 at 14:44

More than one pop up is always overwhelming,I usually try to avoid it,instead what I would try is :

  • The info shown on both popus is more or less similar so we can try to accomodate that in a single screen.
  • The comment section could be a simple link that when clicked just pushes the options below to make space for typing your comment.
  • or as you suggested,if you are absolutely sure about the pin you are looking for,it makes sense to close the first popup.

I would suggest an accordion pattern for this area Divi, you can collapse the information in a header and have the entire details area and comments in the body. I have to agree with Nirav, you should try to avoid multiple pop-up windows at all cost, they are heavy to work with and usually lose context easily. Also I hope you don't have content behind that search if you are planning on showing a preview of the search area selection. Here is my view of it:


download bmml source – Wireframes created with Balsamiq Mockups

Save should be done on blur on the comment field. Hope it helps.


If the other action buttons/links on previous pop-up is not useful for latest popup, they need to be disabled.

One way to solve this is to apply a fullscreen transparent background overlay to cover the previous pop up to prevent mis-clicked.


If you only plan to add the "Comments" text input (as in your example)

I strongly recommend to use inline editing (pressing the pin / a 'modify' link on the pin...) So when activated, the 'comments' input appears directly inline, with its associated save button.


download bmml source – Wireframes created with Balsamiq Mockups

This way you will avoid having 2 popup, which is not as bad as it sounds but always feels clumsy for the users.


This depends on what exactly the ui you are designing and what platform is it on. is it a web site, or a web application or a mobile/tablet application? If it's a desktop application, they can be 'windows' instead of popups. having more than 2 windows is fine.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.