Join Aaron Quigley for an in-depth discussion in this video Adjusting the responsive device sizes, part of Adobe Captivate 8 First Look.
- View Offline
As you start creating responsive projects inside of Captivate 8, the first step is to figure out what size screen will the users actually be viewing your project in. By default, Captivate's going to set up a mobile device that's 360 pixels wide, a tablet device that's 768 pixels wide, and a desktop view that's 1,024 pixels wide. These can easily be changed, however, by grabbing the slider next to them and either expanding them out or contracting them in. Now, if I were to change the desktop view, the tablet view would remain at 768.
And I'd have to come into each individual device and choose exactly the pixels that I would like for that device to appear. Now, this is only changing the width of the actual slide. In order to change the height of the slide, we'll need to check the box that says View Device Height. This will now give me these yellow lines on both the left and the right. And if I scroll down, I can see that there is a bar that I can grab. And I can use this bar to change the height up and down. Now, by default, it was 1,024 by 627 and I'll go ahead and leave it at that for this particular slide. Make sure that when you're done with changing the height of the slide that you also unclick the box that says view device height.
That way you don't accidentally change it if you're working on something at the bottom of the canvas. The last thing I'd like to point out in reference to devices, is that each device has it's own color. Here, at the desktop view, you can see that a green color is used across the top. This green color becomes important as we start looking to the properties menu. For example, I'm going to click on Position on the right hand side and I can see that there's some green highlights around these various boxes that is telling me that currently these green values are being used for the desktop version. If I click onto, let's say, the tablet view, I can see that some of the boxes change to blue.
As you're working with responsive devices, these colors and the corresponding outline boxes will always tell you what numbers are lining up to what device.