Learn how to create interactive infographics with Adobe Illustrator + InDesign

[@rizwanullahkhan1074]

Thank you for the excellent training session. I enjoyed every aspect of it. I never imagined the grand impact of the training session today. It was a very educative one.

[@AngeloMontilla]

Thanks for the kind words! I am glad you it helped and you enjoyed it!

[@muhammadadnanafzal39]

so much knowledge and absolutely free. Thanks

[@HarvestrX]

Why use InDesign instead of Animate? I am guessing this is for those who are into digital publishing more than animation and interactivity? Either way, cool that you can do this with InDesign. Then again it isn't a surprise that an app originally focused on print has more digital publishing features these days. I'm a long time Adobe fan, from my days of learning Photoshop 3 in 1995 at Texas Tech University.

[@friendsholic]

Excellent tutorial!

[@AngeloMontilla]

Thank you!

[@angelakazmierczak6156]

Thank you so much! This was just so awesome to follow along and do. Great stuff!

[@AngeloMontilla]

Awesome! I am glad you enjoyed it!

[@ShalemGraphicDesigner]

amazing tutorial wonderful techniques tons of thanks 🙏🙏🙏🙏🙏

[@lockelordllp1354]

I want to thank you for your videos as they are so easy to follow. I'm having a problem trying to replicate what you do with the switch infographic. I brought my icons in from Illustrator as you did but they won't stay grouped once I make them a button so when I try to click on them I have to click just on the background circle and not on the icon itself. I've watched and rewatched trying to match exactly what you do but I can't get mine to work.

[@DiegoSalotto]

Hi! great video! I have a question: I want to put the html in a wordpress post. Is it possible to put the html that gives the indesign?

[@AngeloMontilla]

Great question Diego. The answer is yes - but two parts: 1) The simple way is the Publish Online feature in InDesign and then copying the embed code and pasting into a WordPress post. 2) But if you mean creating a separate HTML page that you can host on your WP site, that takes a little more work. You'd have to File > Export > HTML in InDesign. This creates the css and java code folders, images/fonts that you share with a developer or if you know how to transfer it to your WP site yourself. I know In5 has a WordPress plug-in that allows you to go from InDesign to WordPress seamlessly and is responsive, but of course that comes at a cost with a full In5 license. Just another thing to consider. Thanks for following along!

[@DiegoSalotto]

​@@AngeloMontilla Excellent answer. For a couple of weeks I have been looking for the best way to make interactive infographics to publish in a Wordpress. I tried Adobe Animate and now I'm studying HTML and CSS. But I think that with Indesign it will be easier to create interactive infographics. Regarding your comment about how to publish in Wordpress, I need to not have to deal with the web page programmer. That's why I want to do it with HTML code only. Thanks for your answer!

[@DiegoSalotto]

@@AngeloMontilla I have another question. How can I paste the embed code in a Wordpress post? Where do I find that code?

[@DiegoSalotto]

OK I already understood what you propose to do with the embedded code. Unfortunately that option does not work for me because I have to do it through the adobe link. I need to have the html to place it on the page. I see that the best option is still to do everything directly in html with css :(

[@susanandangeloconti9424]

Angelo are you available to create an interactive infographic as a project?

[@rumpiee]

Great video as usual. I know you do a lot of digital InDesign work but I was wondering if you could do a design for those retractable banners that you see at conferences. I get a lot of requests for them. You're designs are always so great that I bet you could make a killer one. Thank you :)

[@AngeloMontilla]

I could definitely add that to my tutorial ideas Randie! I create a lot of them for clients so I'd love to share my tips, tricks. Take care!

[@rumpiee]

@@AngeloMontilla Thank you so much!

[@hendbadawi7966]

you tutorial is amazing ❤️

[@hajartalaatt9420]

Very cool, I would like to ask about displaying the magazine on the screen in the form of a video, how do I do that, Does the screen capture a video or what do you do to display only the content of the magazine as a video

[@LuisaAlejandraSuarez]

Would the first part of the interactive buttons work if we export as a pdf?

[@AngeloMontilla]

No, unfortunately this won't work for PDF.

[@courtneycox309]

the text change on hover is soooo slow. any way to speed that up? overall this is so helpful!

[@masah89]

thank you,Great video Is it possible to suggest a topic for implementation? I would like to suggest anything related to climate change

[@AngeloMontilla]

Thanks Kasara! I'll keep it in mind!

[@Fahad-xl9qf]

HI Angelo, The inner shadow effect is not appearing on the donut infographic chart even when you publish it online. I have tested that transparency and shadow effects do not work on design elements that are converted to interactive buttons. Is there any solution to apply to still apply these transparency effects?

[@手搖鈴創意設計工作室]

Where can I test this interactive infographic? I hope ur video could make more showcase or demonstration before tutorials

[@AngeloMontilla]

Hey there! Check out my other tutorials. There are many on how to Publish Online and export as a EPub (Fixed Layout) for viewing experiences.

[@MrPerversso]

there is any way not to export E pub, just pdf? or any website to convert epub to pdf whit the animations and buttons?

[@masah89]

Hi thanks very much, I want to know how I make video in mockup for magazine to share in Facebook , pls I want know the program that you use to that

[@MANNMAINJOHAI]

I cant copy and paste it into indesign the way you did. When I do and resize it, my icons disappear and everything gets disaligned

[@LollieCampbell]

Wondering on how to export as an interactive PDF using this technique... when I export it some of the info is missing now. Is there someway to avoid this?

[@AngeloMontilla]

Hi Lollie, a lot of the interactivity from this tutorial will not work for Interactive PDF.

[@sukdevdhavne9573]

Cool

[@npaverico]

For beginners, it is hard to keep up. I've had to restart over and over. :(

[@AngeloMontilla]

Keep practising and it'll become easier! Stick with it. 👍

[@Max-mh5yo]

the music is stressful

[@Tamyndris]

true, got quite unnerving bits, like at 2:45 and 3:50 ...