• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers

Secondary pop-up in Main pop-up modal

New Here ,
Oct 07, 2022 Oct 07, 2022

Copy link to clipboard

Copied

Hi!

I have been cracking my brain for a few days now. I hope someone here can help me out!

I have created a lobby page. In it a settings icon. Clicking on the settings icon will open up the settings pop-up modal. I used an overlay type for the settings pop-up.

 

Now in the settings pop-up, I have a language button. Clicking on the language button will slide the language pop-up from the side. 

 

Here's what happens when the language pop-up slides... The settings pop-up vanishes from the background and instead the lobby page is getting displayed. Why is that? The settings pop-up is supposed to be displayed in the background instead of the lobby page, right?

 

I have tried linking the language button in the settings pop-up to the language pop-up with overlay type, transition type, and Auto-Animate type. None of them seems to work.  

 

I have attached a screenshot. 

Screenshot 2022-10-07 151315.jpg

Views

149

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Oct 07, 2022 Oct 07, 2022

Hi @InfocomS, I couldn't find a way of creating "popup in a popup" (I'm not going to get into the UX side of things and say "even box in a box is not recommended in UI/UX Design, let alone a popup in a popup or something 😅) but thinking how I'd resolve the issue, I'd make the first/Settings popup a component which has a slide-in toggle menu. That way after opening the settings popup, user could be able to click a languages button/interactive element and trigger the languages toggle menu. You ca

...

Likes

Translate

Translate
Community Expert ,
Oct 07, 2022 Oct 07, 2022

Copy link to clipboard

Copied

Hi @InfocomS, I couldn't find a way of creating "popup in a popup" (I'm not going to get into the UX side of things and say "even box in a box is not recommended in UI/UX Design, let alone a popup in a popup or something 😅) but thinking how I'd resolve the issue, I'd make the first/Settings popup a component which has a slide-in toggle menu. That way after opening the settings popup, user could be able to click a languages button/interactive element and trigger the languages toggle menu. You can see the prototype here: https://xd.adobe.com/view/1413e9f3-8544-445c-8e89-a8fdb69e6882-4140/

And the file here: https://www.dropbox.com/s/hmts19hbho6xagu/popup-test.xd?dl=0

Hope this helps!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 07, 2022 Oct 07, 2022

Copy link to clipboard

Copied

@AkinGn Thanks a lot! It works... Just what I'm looking for

The UX I'm creating is for a game... Usually, in games, you will find a pop-up over a pop-up. 

But again, thanks for helping me out!

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 08, 2022 Oct 08, 2022

Copy link to clipboard

Copied

LATEST

@InfocomS oh I only play casual games (and it's not frequently 😅) for a long time, and especially in mobile categories that's not the case but I understand, thanks for the info, and tried some game UI design in that category for personal projects, can be fun, cheers! 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines