Preview in modal window

Feedback & Problem Solving
#1

Hi folks!
I got this issue with setting up the preview in modal window. The problem is, the preview makes the whole modal to high, so the buttons for save/preview disappears outside the screen… so each time I want to save/preview I need to scroll the modal.

I made this preview: https://1rut2e.axshare.com/#g=1

On the left side you can see the modal during setting widget options (the user needs to click preview). The second version shows modal when user clicks preview button - It makes the whole modal window expanding and the button for Saving sometimes disappear from the screen. Another version of this modal is on the right with the buttons for Save/preview located below to the widget options it will be visible during preview of a widget, and user still will be able to press Save without scrolling a modal.

The question is, which solution will be the best for better flow?

cheers!
M.

1 Like
#2

if having the preview/save buttons always visible is important to you, have you considered floating them to the bottom of the screen? i.e. as soon as the buttons scroll out of view, they stick to the bottom. It’s a common technique to keep the buttons always visible? Just an idea

2 Likes
#3

I don’t think its good solution, because it will still will cover the preview on the bottom of the screen, and there are other parts of the system where Save button is placed on the very bottom of the page (so want to stay consistent).
I was thinking maybe the preview/save button should stay at the very bottom, but I would add just a ‘update preview’ button above the preview after user makes some change, so he don’t have to scroll down the page to hit preview after editing settings.

1 Like