Justinmind

SUPPORT

Learn how to prototype web and mobile apps

How to simulate scrollbars in your interactive wireframes

Simulate scrollbars in your interactive wireframes with the help of this tutorial, which will show you how to turn a Dynamic panel into a scrolling area.

To do this, follow these three easy steps:

  1. Create a new prototype and drag a dynamic panel onto the canvas.
  2. Go to Properties and set the ‘vertical scroll’ and ‘horizontal scroll’ to ‘always visible’.

Simulate scrollbars in your interactive wireframes

 

3. Right click on the dynamic panel and select ‘Edit Content’. Then drag content inside the panel, and the scroll bars will automatically show when you simulate.

And that’s it! Simulate and enjoy!

Next tutorial > Scroll between fixed bars in your mobile wireframes

5 Comments

  1. Shamma

    January 27, 2015 at 9:35 pm

    how can i add text in scrollbars axes ??

  2. charles

    September 11, 2015 at 12:13 pm

    If I have a long dynamic panel with vertical scrolling can I have a section of this screen scroll horizontally?

    Cheers c

    • Danielle Schneider

      September 11, 2015 at 1:00 pm

      Yes – select the dynamic panel and look at the properties panel. There, you should seen an option to enable horizontal scrolling.

  3. atb

    November 20, 2015 at 9:44 pm

    What if I have already set up content? I have an overlay of the dynamic panel. I tried dragging my current content to be be placed underneath the dynamic panel, but it messes up the placement of all my stuff. Is there a quicker way to do this?