IdeaLayer provides a variety of layout options for structuring content on each page. Choosing the right layout depends on the type of content you're presenting and how you want users to interact with it.
Here is a breakdown of each supported layout, including its use cases and interactive behaviour. Screenshots accompany each description to help visualise layout styles.
1. Scatter (Freeform)
Content can be positioned and layered anywhere with no enforced structure. Content can be moved from the default positions and then will stay in their new positions for the remainder of the presentation.
- Best for: Creative and spatially exploratory experiences
- Use cases: Moodboards, spatial groupings of relating content, playful exploration, artistic layouts
- Interaction: Tap, pinch, rotate and drag freely
2. Scatter - Lower Third
Like the Scatter view, this places the items along the lower third of the screen. Items can be dragged to the main area when being presented, and then placed back down when done.
- Best for: Presentations that will highlight particular topics/content in sequence.
- Use cases: Story telling, non-linear presentation
- Interaction: Tap, pinch, rotate and drag freely
3. Grid
Displays content zones in uniform rows and columns. Multiple items can be opened and then freely moved around on the page.
- Best for: Clean and evenly spaced launchpad of content
- Use cases: Media libraries, product tiles, web links
- Interaction: Tap to open content items.
4. Carousel
Quickly swipe through a collection of content items, tapping to open. Multiple items can be opened and then freely moved around on the page.
- Best for: Small or medium-sized collections of content with full size previews
- Use cases: Media libraries, document collections, marketing tiles
- Interaction: Swipe through content collection, tap to open.
Optionally, carousels can be set to have file name titles displayed under the items, like in the example below. This is controlled in the page layout settings of the CMS.
5. Carousel - Modal
Quickly swipe through a collection of content items, tapping to open. Only a single item can be open at once, with the screen darkening behind it.
- Best for: Small or medium-sized collections of content with full size previews
- Use cases: Media libraries, document collections, videos
- Interaction: Swipe through content collection, tap to open. Tap behind the item to close it.
6. Gallery
A scrollable filmstrip of thumbnails enables quick access to open any of the images. A single item is visible at a time, and can be enlarged/moved around.
- Best for: Large collections of photos or videos
- Use cases: Portfolio photo/video gallery
- Interaction: Swipe through thumbnail filmstrip, tap to open
7. Single Item
A single content item will be displayed at a large size on the page. It can be freely repositioned and resized as needed.
- Best for: Single documents and web links
- Use cases: Presentation documents organised into their own tabs
- Interaction: Tap, pinch, rotate and drag freely
8. Single Item - Fullscreen
Shows a single item covering the whole page, typically for web browser links so that they appear as large as possible and enable scrolling/navigating the web page.
- Best for: Web links
- Use cases: Web links
- Interaction: Scroll up/down, tap on web links. Navigation bar (bottom left of web page) enables back/forwards navigation.
9. Blank
Hides any content items added to the page, instead just showing the page background
- Best for: Custom backgrounds with text and imagery embedded
- Use cases: Introduction/home tabs with custom-designed backgrounds
- Interaction: None
To get started with managing content and adjusting your page layouts, refer to the Managing Content section of pages, specifically Setting page layouts.