Take Full Control: Design Custom Interfaces with SeekBeak Overlays

Creating a custom splash screen with SeekBeak's Overlays takes just a few minutes, or less! Overlays are made up of objets we call "Nodes". There are text nodes, image nodes, container nodes, and more. Just add the type of Node you want, where you want it, and what you want it to do.

Here we've created a semi opaque container as a faux background, and added a child container which is simulating a centered popup. Every element in the popup is just an Overlay Node: a few text nodes, a few image nodes, and a few container nodes for responsive positioning.

Build visually, no coding required. Easily add, arrange, resize, and style elements like containers, text, images, and more.

Match your brand perfectly. Control colors, fonts, borders, rounded corners, shadows, padding, and margins for every element.

Behind the scenes, Overlays use the browser industry standard CSS, (Cascading Style Sheets), a style sheet language used to describe the presentation and styling of documents written in HTML. It allows you to control the layout, colors, fonts, and overall design of your Overlays. 

SeekBeak's Overlays also use a graphical version of the standard positioning system called Flexbox, allowing for a ton of Flexibility (pun intended), when positioning, aligning, and sizing Nodes.

Persistent Elements - Keep important information always visible. Create custom "Home" or "Contact Us" buttons, logos, or menus that stay in the same place on screen across all your Snaps.

Static Positions, Animated Content - Using animated png's or svg images to add motion to any Overlay image, like in the above example's animated wind turbine located in the bottom right panel.

Dynamic Content with Variables - SeekBeak allows you to use dynamic variables in your Overlays to display things like the current Snap name, and multiple other values, which update automatically. No need to constantly copy and paste things like title pages! Simply adding a special syntax like {{snap.name}} to any text will make sure it's automatically updated with the current value.

The display panel in the top left of the above demo was only created once, yet updates to reflect the current Snap Name every time the Snap changes.

Powerful Actions & Triggers: Create dynamic experiences. Make elements appear, disappear, or animate based on triggers like "On Snap Load," "On Click," or "Hover," with optional delays.

Rich Animations: Add polish and guide attention. Animate element opacity, position (move off/on screen), scale, or rotation to create engaging transitions and effects.

Embed Rich Media: Integrate external content seamlessly. Easily embed YouTube / Vimeo videos, Google Maps, web forms, or other iFrame content directly into your Overlay.

Ensure a great experience on any device. Instantly simulate how your Overlay looks and functions on various screen sizes (Desktop, 4K, Tablets, Phones) and orientations.