October 14, 2021
HOW TO IMPROVE YOUR VERTICAL STORYTELLING WITH PAGEFLOW NEXT
As access to web reports and longreads via smartphones continues to rise, it's more important than ever to pay special attention to the mobile version of a story.
Pageflow Next meets the users’ demands and offers solutions that enable forward-looking storytelling, even on the run. Therefore we're pleased to present some fresh features for mobile optimization.
Pageflow Next comes with all-new capabilities that give mobile users the best possible experience of a multimedia story in vertical orientation.
MOBILE Background IMAGES
Pageflow Next pursues the goal of displaying background images in full-screen, just like the classic version does. With some motifs this has sometimes led to an issue: essential components of an image did not fit into the vertical viewport on smartphones, i.e. with group photos or other images where important parts of an image, a chart or map were lost due to cropping:
Works fine in landscape mode, but ..
As a solution to this, Pageflow Next now gives you a new tool: The optional use of a separate mobile background image as an alternative to the landscape image on desktop.
If you're reading this article on a Smartphone in vertical orientation, you'll notice: The image shows three adults and a child. Unfortunately, you're missing some members of this group due to the small width of your viewport.
Please scroll down to see what happens to the vertical version if a mobile image is applied:
All in one ✅
To adequately represent a group of people, all members should be visible, right?
Here's an example of two more groups of people that can now be set into scene with a portrait version, perfectly matching the aspect ratios of both orientations:
As a content creator, it's often not so easy to take into account the aspect ratios and formats of the different platforms and devices when producing media.
Covering format requirements of social media platforms equally well, such as 16:9, 9:16, 1:1 and so on, is essential for efficient media production these days.
Pageflow Next now provides tools that let you embed all of these kinds of formats into your story. The new concept of content elements makes it easy to reuse media with different aspect ratios such as the square video above ⬆️
USING MOBILE IMAGES "inline"
Pageflow Next fundamentally changes the way media is incorporated into a story:
The original page-based structure, which only allowed to place a single type of media asset on a backdrop, has been replaced with the more flexible concept of "sections" that can be filled with an arbitrary number of different content elements.
Just like with background images, you can decide whether a content element should display a different image for the mobile version. If you, for instance, want to show an infographic, it will be useful to create two versions in order to keep things readable.
The following landscape visualization will become too narrow in portrait mode:
Landscape Version
This landscape image will be shown "inline" both on desktop and smartphone unless you determine a separate mobile image:
Portrait Version
Quite hard to read on a smartphone, right? One possibility now would be to use a portrait image for the desktop version as well. This way the content is readable in both cases:
But: The goal is to make your content enjoyable across platforms and to offer your audience the best possible readability in both orientations. Please your reader's eyes with the right version, tailored to their device:
Adaptive Version
Once a mobile image is selected, a different version is displayed depending on the aspect ratio of the screen. The following image will be shown in landscape (wide) or vertical mode depending on the device you're using right now:
How-to-Pageflow-Next
Furthermore, with the "Motif Area Selection" and the "Dynamic Shadow", there are even more possibilities to set a motif in scene equally beautifully in both worlds. We will present these and other features with more "How-To-Pageflow-Next" articles here on our blog soon. Thanks for your attention and stay tuned!
It's never been easier to bring all types of media with different formats together in a mobile-friendly environment with Pageflow.