Adobe Captivate Tutorial - Creating and Publishing Responsive Project in Captivate 8

 

 

Adobe Captivate 8 had be release and include some amazing new features, especially the responsive design for mobile devices. Responsive design can created multiple screen and develop any-screen mobile learning without programming using all-new responsive authoring. Let’s us create a new Responsive Project and publish it to explore this features!

 

1. After launching Captivate 8, click New and click first thumbnails Responsive Project.
Then click Create to create a new responsive project.
OR
you also can click File > New Project > Responsive Project to create new responsive project.
 


Note: This is the responsive project interface
.



2. Click the Primary, Tablet and Mobile icon to switching to the different breakpoints.
You can view your the Responsive Project content area in three breakpoints: Primary, Tablet, and Mobile.
 


3. You can drag the slider to resize the width of device. 
 


4. If you want to customizing  the slide height, click the View Device Heigh checkbox.

 


Note: You can see the yellow border for each viewport as shown in below when device height is selected.

Then, drag the yellow border of device height to set the device height of each three device layout.
 


5. From the toolbars, click the arrows under Themes and select the Clouds theme to apply in this project.


6. Click Yes.
 



7. If you feel don’t like preset Theme Colors, you can customize it.
Click Themes > Theme Colors in the toolbars.

 

8. Choose any one of Theme colors from Select Theme Colors drop-down menu.
OR
click the Customize button to change the colors of each component of slides.
Then, click Close.
 

 

9. You can add your content now.

10. Before you publish it, please preview it first.
From the toolbars, Click Project > choose any one preview way from drop-down menu.
 

 

When you preview your project in HTML5 browser, you will see an option to view three different breakpoints as following image.
 

When you preview your result content in devices using Adobe Edge Inspect, you can see the  result content how look like on the physical devices .
 

 

After you preview it, let’s start publish it.

 

11. From the toolbars, click Publish > Publish for Devices.
 

 

12. In the Publish for Devices dialog box, type your project name in the project title field.
Set your File Location.
If you want to let your file become zip file, let’s select the Zip Files checkbox.
 

13. You can apply common gestures, like pinch & zoom and swipe to your Responsive Projects while Publishing projects.
Click the blue colored No text besides Mobile Gestures.
 

 

Note: It will display a new dialog box.

 

 14. Click the Gesture Configuration check box.
Then, click OK.
 

 

15. When you finish all the settings, click publish button.

It’s finish.

Thank You.

 

By Yuel Tu   | Google  | LinkedIn

 

Cempaka Technology Sdn Bhd

Pusat Latihan Komputer Cempaka
~Your HRDC Premiere Training Provider~
64-2, Jalan Puteri 2/2, Bandar Puteri Puchong, 47100 Puchong Selangor, Malaysia. Tel: 603-80684461
1-28, Jalan PM4, Plaza Mahkota, 75000 Melaka. Tel: 606-2835955
Instant SSL