Pagination is useful as it lets people know how long or short a story is. I'm looking to create a "tappable web story" where you tap right to move forward one screen, and tap left to go back.
Navigating back and forth can be handled inside Hype, but how can I set up the pagination element so it shows:
100% opacity on the "active" scene bullet
50% opacity on all the "inactive" scenes bullets
and follows this pattern as the user navigates through the story
Assume that all scenes in a project will be viewed in a linear fashion, so users would navigate from Scene 1 - Scene 10, or back from Scene 10 to Scene 1.
It does the navigating. Obviously, it's the navigation template.
For the little buttons at the bottom, I'd probably just use loops in JavaScript. One loop could be used to create the little page indicators dynamically, Another loop is used each time a scene is changed. All the indicators would be turned off first... 50% opacity …then one indicator would be set to 100% based on the scene name.
Thanks so much for this example @h_classen ! Just what I was looking for.
It's very easy to understand, and by playing around with the symbol in the editor, I think I can use it for my purpose. Since I am focusing on short stories (15 scenes max), I can set up the pagination manually.
