Skip to content

Landing Page / Home Screen

By default, Kivicube shows a landing-page style UI before the content actually starts, for example:

  • logo
  • title
  • background image
  • Start Now Button

If your project wants to keep that default experience, just leave the default properties as-is.

Controllable Landing Page Elements

The main Web plugin properties related to the landing page are:

  • hideLogo
  • hideTitle
  • hideDownload
  • hideStart

Example:

js
await kivicubeIframePlugin.openKivicubeScene(iframe, {
  sceneId,
  hideLogo: true,
  hideTitle: true,
});

Build a Custom Host-Layer Landing Page

The more common pattern is:

  1. render a branded landing page in the host page
  2. place the Kivicube iframe underneath or in a placeholder area
  3. after ready or downloadAssetEnd, either show the iframe's real Start Now Button or use advanced APIs to read and adjust its button area

For example:

js
iframe.addEventListener('downloadAssetEnd', () => {
  hideHostLandingPage();
  showIframeLandingPage();
});

If you only want to align a host-layer button with the real button inside the iframe instead of hiding it, see getStartButtonRect() / setStartButtonRect() in Start Now Button first.

When to Keep the Default Landing Page

Good fit for:

  • quick integrations
  • projects with low branding requirements
  • cases that want to reuse the platform's built-in landing-page artwork and copy

When to Build a Custom Host Landing Page

Good fit for:

  • campaign pages, brand pages, and marketing pages
  • projects that want the Kivicube experience to match the main site design completely
  • flows that need to integrate with host-side analytics, login, or task systems

Recommendations

If you plan to customize the landing page, you will often pair it with:

  • hideLogo: true
  • hideTitle: true
  • decide case by case whether hideStart: true is also needed

But note that hideStart affects media autoplay success rate, so use it only if you fully understand the consequences.

If you only want to move the button or overlay a branded button on top, you do not necessarily need hideStart.

The next page covers that in more detail.