“How do I create an interactive flipbook?” is a question we get asked a lot. Well, in today’s article, I will demonstrate some practical examples and how they are made with the multimedia editor in Flip PDF Plus Pro or Flip PDF Plus Corporate.
In my humble view, a book that interests the reader appeals to the reader’s senses—sight, hearing, and touch (in this article, touch will be derived as interaction).
Before we dive into the main topic, let’s take a quick look at the main areas of the multimedia editor.
We can simply divide the editor into 6 areas. The image below is for your reference.
- Area 1: top navigation bar
- Area 2: left menu bar
- Area 3: left secondary menu panel
- Area 4: canvas area
- Area 5: timeline area
- Area 6: right element properties panel
How to use the senses in flipbooks
Sense 1: Sight (Vision)
Sight, as in literally, is what you can see with your eyes. It is also the first sense used by the reader when reading a book. As a result, we may create some visual focal points to draw the reader’s attention. There is a visual line of motion when we read a book. On the one hand, we need to add attraction to the book in order to create a visual highlight, but we must also be careful not to make the visual focus too cluttered.
Sight-Example 1: Draw tour route
Step 1: Choose [Tools] >[Line Brush] in Area 2-left menu bar.
Step 2: Draw the route according to your plan.
Click once on the canvas to start drawing. Keep clicking to draw the next points and double-click to finish the drawing. You are also able to choose [curve] in the right element properties panel if you don’t want to use the straight line.
The flipbook’s first page contains a video tutorial.
Sight-Example 2: Add hotspots
Step 1: In Areas 2 and 3, click [Interact]>[Interactions]>[Hotspot] and add one or more hotspots to the canvas.
Currently, hotspots are classified into the five categories listed below: Blink, Zoom, Rotate, Gesture, and Arrow. Depending on the effect you want to achieve, you could select the appropriate hotspot.
Step 2: In Area 6, customize the hotspot in [Style] and add a trigger action. You are able to link the hotspot to a pop-up message window, video, image, link, or other item supported there.
Sense 2: Hearing (Sound)
American director and actor, Melvin Van Peebles, once said that music and sound in a film is a character as important as another character. Sound also plays an important role in setting the mood in digital publications. If you are creating a storybook, we recommend that you include background music or voiceover audio to create an audiobook, which can bring the book to life.
Hearing-Example 1: Add audio
Step: Select [Audio] and the audio player, then add.mp3 files to the program.
If you find it troublesome to create your own audio, you can download audio from commercially available audio websites, such as FreePD and YouTube Audio Library.
Hearing-Example2: Add audio trigger action
Add audio with a trigger action and the audio will play when you click a specific item
Step 1: In Area 2: left menu bar, click [interact]>[button] and put the button on the canvas.
Step 2: In Area 6: right element properties panel, click [Style] to customize the button (text, icon, and color), then click [Trigger action]>[Play audio].
Note: In addition to buttons, you are also allowed to add audio trigger actions to any item, including images, text, links, and so on. I’m just using the button as an example here.
Sense 3: Interaction
Interaction-Example 1: Conduct a survey
Many FlipBuilder users have inquired about whether our program supports forms and questionnaires. But unfortunately, these two features are not yet supported. Wait, there are still ways to include questionnaires or forms to flipbooks. We can use other survey tools to create questionnaires and then embed them into flipbooks.
The following six popular survey tools are recommended for you:
- Typeform
- Google Forms
- SurveyMonkey
- SoGoSurvey
- SurveyPlanet
- Jotform
Step 1: Create your own questionnaire in the survey tool platform and get the link.
Step 2: In Area 2, select [Tool] >[Iframe] and add the embed code in [Style]>[Web link].
Interaction-Example 2: Add trigger action
Click on different buttons to make different items appear through a trigger action. We could add any item to the canvas and then add an action to it. The action’s timing is customizable, which means that an action can be triggered if the predefined condition is met. Based on this principle, we can add product images to the flipbook and then change the color of the product when the button is clicked. It sounds abstract, so you could now try it for yourself by referring to the first page of the book below and clicking on it.
There is a video tutorial on the second page of the flipbook above.
Step 1: Prepare images of your product in different colors.
Step 2: In Area 2, click [image] and import the prepared images one by one, and rename the images in Area 5: timeline.
Step 3: In Area 2, click [Interact]>[Shape], choose one of the shapes you would like to use, and put it on the canvas.
Step 4: Select the shape items in the canvas and use the color picker in Area 6: right element properties panel and color the shape items according to your product.
Step 5: Add trigger events for the items in [Trigger action]>[Show/Hide].
Conclusion
Thanks to the promotion of going paperless and the growing awareness of environmental protection, digital publications have become a good alternative to traditional printed books. However, when compared to the traditional printed books, digital publications have the disadvantage of being more difficult to keep readers focused. Therefore, one of the most important lessons for publishers is how to keep readers focused while reading an ebook and how to create an ebook that keeps readers engaged. Empowering your flipbooks with senses would be a good way to immerse your readers.
If you have any doubts about making a flipbook, you can also contact us and we will be happy to help you out.