This feature is only available in Pageflow Next stories.


When creating interactive websites, it's important to ensure that key motifs in your images remain visible on all devices. The "Motif Area" feature allows you to adjust and highlight important areas of an image or video, ensuring they stay visible before being overlaid by text or other content as the user scrolls.



Just follow these 3 simple steps to ensure that the most important parts of your motifs are always visible and optimized for mobile viewing:



1. Open Motif Area selecetion
Click the icon with three dots (⠇next to the file. Click on "Select motif area" to open the selection window.









2. Select and save
Mark the important area of the image simply by dragging a rectangle. Click "Save"





3. Use the mobile preview
Switch the device preview and check how the selected Motif Area will look on smartphones.










Optional: Choose a separate mobile background
If the key part of the image/video differs on mobile devices, you can upload a different background image or video specifically for smartphones. This ensures the motif is perfectly adapted to the smaller screen, maintaining visibility and impact.


a) Add the same image/video as a portait version if you want to highlight a different area, or 


b) choose a seperate (9:16) image/video for mobile devices.