Challenge:
- Text overlaps crucial image elements
- Motif and layout not optimally aligned
- Poor readability due to low contrast
➔ Solution: Motif area
With the “Motif area“ feature, you can ensure that central image content always remains visible before it is overlaid by text. In combination with the dynamic shadow, readability is further optimised.
Why this feature is important
✔ Ensure recognisability
Important motifs are perfectly visible before they are overlaid by other content when scrolling.
✔ Align motifs for desktop and mobile
Ensures optimal positioning across all screen sizes, since you can add separate backdrops for smartphones.
✔ Improve readability
Selecting an image area then enables the use of dynamic shadows, which ensure sufficient contrast without compromising the design.
How to apply the feature
1️⃣ Select a section
Select a section with a background image or video in the editor.
2️⃣ Mark the design area
Open the menu (three dots) of the background medium and click on "Select motif area".
3️⃣ Define centre area
Draw a rectangle around the important area that should always remain visible and click on ‘Save’.
Combine with the following features
✐ Activate dynamic shadow
Go to ‘Text Background’ and enable Dynamic Shadow to adjust contrast just as text scrolls over the image
✐ Test in the preview
Check the display in the mobile preview to make sure everything looks optimal.