New Feature: Playlist Center! Pick a topic and let our playlists guide the way.

Start learning with our library of video tutorials taught by experts. Get started

Add Your jQuery Project to a Digital Magazine
Illustration by

Add Your jQuery Project to a Digital Magazine

with Chris Converse

Video: Previewing the final project

Hi! I'm Chris Converse, and this is a course on taking an HTML5 project, and putting it into a digital magazine. Now, if you're a Premium Member of the lynda. com online training library, you'll have access to the exercise files. If you don't have access to these files, you can use any localized HTML project. And inside of the B folder here, I have two copies of previous lynda.com courses. So if you've taken any of my previous courses, you can use those projects as well. I've included the Bar Chart here, and the Interactive Map. To preview these, I'll come down and double- click on the HTML file for the Bar Chart.

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
please wait ...
Add Your jQuery Project to a Digital Magazine
16m 43s Intermediate Jun 20, 2012

Viewers: in countries Watching now:

This short, project-based course combines the use of Adobe InDesign and the Digital Publishing Suite plug-in to add an interactive web experience to your digital magazine. Author Chris Converse reveals how to download Digital Publishing Suite, how to create articles and add them to a magazine with the Overlay Creator, and how to preview the finished magazine on a mobile device such as an Apple iPad or Android tablet.

Subjects:
Design Web Digital Publishing Projects
Software:
InDesign jQuery iPad Digital Publishing Suite
Author:
Chris Converse

Previewing the final project

Hi! I'm Chris Converse, and this is a course on taking an HTML5 project, and putting it into a digital magazine. Now, if you're a Premium Member of the lynda. com online training library, you'll have access to the exercise files. If you don't have access to these files, you can use any localized HTML project. And inside of the B folder here, I have two copies of previous lynda.com courses. So if you've taken any of my previous courses, you can use those projects as well. I've included the Bar Chart here, and the Interactive Map. To preview these, I'll come down and double- click on the HTML file for the Bar Chart.

So, inside of our browser, we can see that each one of these bars animates, and we have a label that animates on each one as well. Let's come down and click on the Interactive Map. So, this map here has a dropdown menu that I can come down, and I click on individual continents. When I select a continent, all the dots will hide except for that continent. I can click on each one of these and get more city detail information. So again, this full interactive experience inside of the browser, we want to capture this, and encapsulate that into a digital magazine. So, let me close my web browsers here. So, at this point, let me bring up my iPad.

So I'm going to be using the Adobe Digital Publishing Suite, and so for my device, I'm going to be using an app called the Adobe Content Viewer. You can search your App Store for this particular app. You can find this for iOS, Android, and BlackBerry. As you can see, I have this app in the upper left-hand corner of my screen here. So I'm going to come up here and tap on this device to launch this. Once the app launches, you're going to sign in with your Adobe ID. Then the app is going to check with the Adobe Folio Producer which is an online tool to see which magazines you have access to, to preview.

So here I see, I have a magazine called Codify Demo for lynda.com, and I see a little blue label underneath that says Free. I'm going to come up here and tap Download to download a preview of this. Once this downloads, that free label will go away, and I'll see two buttons here Archive and View, I'm going to come up here and tap on View. So here, I have a three article magazine, the cover counts as the first article. I am going to come up here and swipe to the second page. We can see the animation of the bar chart taking place, and then if I swipe one more time, we'll actually see the Interactive Map.

Now this map is fully interactive just like we saw in the browser. So I am going to come over here and tap on a Country List, choose Australia, come up here, and tap on Sydney, and then I can see the city details come up. Come up here and tap on Perth, go back to the main menu, click on Show all continents and then all the dots come back. So again, we're seeing that exact same user experience now in the magazine that we saw in the browser. So, in this course, we're going to look at taking an HTML experience and making it an entire article like we see here. On the second page, we're going to use a feature in InDesign called the web View which means we can have most of the screen be InDesign but a part of it be HTML5.

We're going to lay out this content in InDesign. We're going to use the Folio Builder to build our magazine, push it up to the Folio Producer, and then pull our final project back down using the Adobe Content Viewer app that we just looked at. So I hope this course sounds interesting to you, and if so, let's get started.

There are currently no FAQs about Add Your jQuery Project to a Digital Magazine.

 
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

join now Upgrade now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Add Your jQuery Project to a Digital Magazine.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Are you sure you want to delete this note?

No

Notes cannot be added for locked videos.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.