‘View mode drop-down menu’ and the ‘View mode slider’

This week we’ve added a new function to Elucidat which allows you to edit edit all your responsive sizes (desktop, mobile, tablet) without the fuss of having to resize your screen.

Meet your new friends the ‘View mode drop-down menu’ and the ‘View mode slider’:

These live at the top left of your screen:

Using the ‘View mode slider’ allows you to get pixel perfect dimensions and see how your course will react to a variety of screens whereas The ‘View mode drop-down’ allows you to concentrate only on specific platforms.

The ‘View mode drop-down’ will be periodically updated so you will always be able to design for current and future mobile and tablet types.

To use the ‘View mode slider’:

Open any page in Elucidat.

Click and drag the slider to the left, the further you go the smaller your page will become.

Notice the ‘Breakpoints’ on the slider.

Each time you pass a ‘Breakpoint’ the ‘View mode’ will change:

You can save changes made in different ‘View modes’ to create responsive projects.

For instance, if I have an image in my ‘Desktop’ view but I want a different image in my ‘Portrait’ view I must:

Insert my first image into the ‘Desktop’ view.

Press ‘Save’.

Resize my view mode to ‘Landscape Tablet’ view using the ‘View mode slider’.

Insert a different image.

Press ‘Save’.

Now when I switch between the two ‘Views modes’ the image will automatically change.

Note: You can do more than just changing images using ‘View modes’, try resizing, repositioning and changing the size of size text in different ‘View modes’.

To use the ‘View mode drop-down menu’:

The ‘View mode drop-down menu’ can be used in the same fashion as the ‘View mode slider’.

To enter the ‘View mode drop-down menu’, press the device icon.

Now choose a device, make any alterations and press ‘Save’.

For more information on how to set-up responsive pages see our manual page.