Learn Mode

Full IR1.1 Website Example

Name: DaizLab
Author: Daiz

Build a complete small landing page from IR.

Objective

See how meta, brand, layout, sections, actions, and output work together.

This lesson combines the major IR1.1 parts.

It creates a business landing page from structured JSON.

Try changing the colors, business name, headline, items, and WhatsApp message.

Syntax

Full IR1.1 = meta + brand + layout + sections + actions + output

Practice Editor

Temporary only. No local save. No cloud save. No compile quota used.

{
  "version": "1.1",
  "meta": {
    "title": "Lumic Electrical Solutions",
    "description": "Electrical, solar, CCTV, and building technology solutions.",
    "businessName": "Lumic",
    "businessType": "electrical",
    "location": "Nigeria",
    "language": "en"
  },
  "brand": {
    "colors": {
      "primary": "#0a8f3d",
      "secondary": "#076a2d",
      "accent": "#f2d21b",
      "background": "#ffffff",
      "text": "#111111",
      "muted": "#666666"
    },
    "typography": {
      "heading": "Arial, Helvetica, sans-serif",
      "body": "Arial, Helvetica, sans-serif"
    },
    "vibe": "corporate"
  },
  "layout": {
    "container": {
      "maxWidth": "1120px",
      "padding": "32px"
    },
    "grid": "mixed",
    "responsive": true
  },
  "sections": [
    {
      "id": "hero",
      "type": "hero",
      "badge": "ELECTRICAL SOLUTIONS",
      "headline": "Reliable electrical and security systems.",
      "description": "Lumic provides electrical works, solar inverter installation, CCTV, access control, and smart building solutions.",
      "cta": {
        "label": "Request Quote",
        "type": "whatsapp",
        "value": "+2349112747576",
        "message": "Hello Lumic, I want to request a quote.",
        "style": "primary"
      }
    },
    {
      "id": "services",
      "type": "services",
      "badge": "SERVICES",
      "headline": "What we install and maintain",
      "items": [
        {
          "title": "Electrical Works",
          "description": "Professional wiring, repairs, and installations."
        },
        {
          "title": "Solar Inverter",
          "description": "Power backup and solar energy setup."
        },
        {
          "title": "CCTV Security",
          "description": "Surveillance camera installation and support."
        }
      ]
    },
    {
      "id": "process",
      "type": "process",
      "badge": "PROCESS",
      "headline": "How we work",
      "steps": [
        {
          "title": "Send Request",
          "description": "Tell us what you need installed or fixed."
        },
        {
          "title": "Site Check",
          "description": "We review your space and recommend a safe setup."
        },
        {
          "title": "Installation",
          "description": "Our team completes the work professionally."
        }
      ]
    },
    {
      "id": "offer",
      "type": "offer",
      "badge": "READY",
      "headline": "Start with a quote today.",
      "description": "Use WhatsApp to explain your project and get the next step."
    }
  ],
  "actions": {
    "primary": {
      "label": "WhatsApp Lumic",
      "type": "whatsapp",
      "value": "+2349112747576",
      "message": "Hello Lumic, I need electrical or security service.",
      "style": "primary"
    },
    "secondary": {
      "label": "View Services",
      "type": "anchor",
      "value": "#services",
      "style": "ghost"
    },
    "floating": {
      "label": "WhatsApp",
      "type": "whatsapp",
      "value": "+2349112747576",
      "message": "Hello Lumic, I need help.",
      "style": "floating"
    }
  },
  "output": {
    "targets": ["html", "css", "previewHtml", "zip"],
    "singleFile": true
  }
}

Notes

This is the first full IR1.1 learning example.

It proves that IR can describe a real landing page before generating code.

Common Mistakes

Breaking JSON by deleting commas between objects.

Changing section type to a value the compiler does not support.

← Previous

Learn Mode

Full IR1.1 Website Example

Build a complete small landing page from IR.

Objective

See how meta, brand, layout, sections, actions, and output work together.

This lesson combines the major IR1.1 parts.

It creates a business landing page from structured JSON.

Try changing the colors, business name, headline, items, and WhatsApp message.

Syntax

Full IR1.1 = meta + brand + layout + sections + actions + output

Practice Editor

Temporary only. No local save. No cloud save. No compile quota used.

Notes

This is the first full IR1.1 learning example.

It proves that IR can describe a real landing page before generating code.

Common Mistakes

Breaking JSON by deleting commas between objects.

Changing section type to a value the compiler does not support.

← Previous

INITIALIZING DAIZLAB

System Progress14%

[~]Loading interface systems

[ ]Connecting workspace modules

[ ]Preparing authoring environment

Learn Mode

Full IR1.1 Website Example

Build a complete small landing page from IR.

Objective

See how meta, brand, layout, sections, actions, and output work together.

This lesson combines the major IR1.1 parts.

It creates a business landing page from structured JSON.

Try changing the colors, business name, headline, items, and WhatsApp message.

Syntax

Full IR1.1 = meta + brand + layout + sections + actions + output

Practice Editor

Temporary only. No local save. No cloud save. No compile quota used.

Notes

This is the first full IR1.1 learning example.

It proves that IR can describe a real landing page before generating code.

Common Mistakes

Breaking JSON by deleting commas between objects.

Changing section type to a value the compiler does not support.

← Previous