Pop Up pages

Pop-up pages can be effective for drawing attention to specific information or encouraging user interaction.

๐Ÿ‘‰ The Tag

By using this new tags you will be available to make new pages to popup!

๐Ÿ“ Where to add the tag: A top-level app page.

๐Ÿท๏ธ How to add the tag

  1. On a blank app page, create a Pop up design.

  2. Use the tag that you prefer the most for your pop-up.

Normal Pop Up

Use this tag:

Normal Popup [page:popup]

Rounded Corners Pop Up

In case you want rounded corners use this tag:

Rounded Corners Popup [page:popup] 

Color Background Pop Up

In case you want a color background Pop up use the follow tag:

Color Background Popup [page:popup:#CCFAFF00]

Blur Background Pop Up

You want a blur background Pop Up:

Blur Background Popup [page:popup:blur] 

Slider Pop Up

This is the case if you need to show more than one pop-up at a time.

Slider popup[page:popup]
Slide [container:slider:horizontal]

๐Ÿ”ฅ Important: To Close the popup the action close will be required:

[action:close]

Now you can do the prototyping! Your Pop Up is ready to use. Import to Bravo & preview on Bravo Vision ๐Ÿš€

it's important to use the Pop up pages judiciously to avoid creating a negative user experience, as excessive or intrusive pop ups can be disruptive and may lead to a poor user experience.

๐Ÿ’พ Example files

Duplicate the files below to see how to set it up!

Last updated