# Lidar Drone Scanning — Design Reference

Schema: Design Details DESIGN.md v3.2
Source: https://drone.riotters.com/
Captured: 2026-10-06
CSS measured: 2026-10-06T06:25:49.250Z at 1440×1000 — https://drone.riotters.com/
Values come from computed CSS; role labels are AI judgments. Live CSS may differ from an older screenshot.
Status: AI analysed; curator review pending
Rubric: 3.2
Observer: google/gemini-3.1-pro-preview
Judge: anthropic/claude-sonnet-5

## Design direction

The website presents a technical demonstration of a LiDAR drone scanning system, employing a highly refined, minimal, and technical visual language. A persistent 3D drone model acts as the central focal point, orchestrated via scroll-linked animations to physically contextualize the surrounding informational content. The typography relies on 'Switzer' for clean, modern headings and body copy, supplemented by 'protoMono' for data-centric microcopy, reinforcing the technical theme. The color palette is predominantly cool, monochromatic (whites, greys, deep charcoal), creating a sleek, almost clinical aesthetic that foregrounds the product. Layouts are airy, utilizing generous whitespace and pr

## Classification

- Industry: technology
- Site type: Landing
- Business model: Software
- Styles: minimal, corporate, typographic, technical-engineering, cinematic-product-showcase
- Platform: Custom code
- Technology: Next.js, Tailwind CSS, Three.js

## Typography

- Display: switzer — weight 300; size 240px; line-height 220.1px; tracking -13px; Regular (95% role confidence, computed values)
- Heading: switzer — weight 300; size 64px; line-height 72px; tracking -2.4px; Regular (90% role confidence, computed values)
- Body: switzer — weight 400; size 14px; line-height 24px; tracking normal; Regular (90% role confidence, computed values)
- Mono: protoMono — weight 400; size 12px; line-height 24px; tracking normal; uppercase (95% role confidence, computed values)

## Functional palette

- Canvas — canvas #FFFFFF: color-1: computed rgb(255, 255, 255); AI role: Pure white (#FFFFFF) used extensively as the main background for the site. (95% role confidence, computed values)
- Text — text #24363F: color-4: computed rgb(36, 54, 63); AI role: Dark charcoal (#24363F) used for primary text elements like nav items, headings, and the contact button. (90% role confidence, computed values)
- Muted Text — muted text #C7CCCB: color-3: computed rgb(199, 204, 203); AI role: Light grey (#C7CCCB) used for secondary/inactive text or subtle background typographic elements. (85% role confidence, computed values)

## Exact computed CSS inventory

The browser extracted these declarations from rendered DOM at capture time. They are facts, not visual guesses. Image and video pixels are outside this inventory.

### Font configurations

```json
[
  {
    "id": "font-1",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 43,
    "contexts": [
      {
        "tag": "p",
        "text": "Lidar Drone Scanning",
        "top": 26,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Surface",
        "top": 16040,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "deformation",
        "top": 16040,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-2",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "400",
    "size": "15px",
    "lineHeight": "28px",
    "letterSpacing": "-0.4px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "Tech Stack",
        "top": 17794,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Riotters Services",
        "top": 17794,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-3",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "28px",
    "letterSpacing": "normal",
    "traits": "capitalize",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "Tech Demo by RiottersRiotters",
        "top": 24,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Riotters",
        "top": 24,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-4",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "\"DJI\" and \"Mavic 2 Pro\" are trademarks of SZ DJI Technology Co., Ltd. This is a non-commercial techn",
        "top": 18079,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "© Riotters 2026. All rights reserved",
        "top": 18079,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-5",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "32px",
    "lineHeight": "40px",
    "letterSpacing": "-0.8px",
    "traits": "Regular",
    "count": 321,
    "contexts": [
      {
        "tag": "span",
        "text": "Engineered around the DJI Zenmuse L2 LiDAR payload. Our system delivers frame-based point cloud acqu",
        "top": 2553,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "E",
        "top": 2554,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "n",
        "top": 2554,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-6",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "28px",
    "lineHeight": "32px",
    "letterSpacing": "-0.8px",
    "traits": "Regular",
    "count": 191,
    "contexts": [
      {
        "tag": "span",
        "text": "Power grids, wind turbines, and solar arrays span thousands of acres of terrain that ground crews ca",
        "top": 7545,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "P",
        "top": 7545,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "o",
        "top": 7545,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-7",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "24px",
    "lineHeight": "32px",
    "letterSpacing": "-0.8px",
    "traits": "Regular",
    "count": 114,
    "contexts": [
      {
        "tag": "span",
        "text": "Autonomous",
        "top": 912,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "LIDAR",
        "top": 912,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "inspection",
        "top": 912,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-8",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "20px",
    "lineHeight": "28px",
    "letterSpacing": "-0.4px",
    "traits": "Regular",
    "count": 103,
    "contexts": [
      {
        "tag": "span",
        "text": "Full-hemisphere LiDAR capture at 240,000 points per second across terrain, structures and vegetation",
        "top": 8935,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "F",
        "top": 8937,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "u",
        "top": 8937,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-9",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "64px",
    "lineHeight": "72px",
    "letterSpacing": "-2.4px",
    "traits": "Regular",
    "count": 72,
    "contexts": [
      {
        "tag": "span",
        "text": "Detecting cracks, deformations and structural risks before they become failures.",
        "top": 1400,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "D",
        "top": 1397,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "e",
        "top": 1397,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-10",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "400",
    "size": "20px",
    "lineHeight": "32px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 47,
    "contexts": [
      {
        "tag": "span",
        "text": "Structural Fault Zone",
        "top": 16003,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "S",
        "top": 16007,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "t",
        "top": 16007,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-11",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "240px",
    "lineHeight": "220px",
    "letterSpacing": "-13px",
    "traits": "Regular",
    "count": 19,
    "contexts": [
      {
        "tag": "span",
        "text": "Solutions",
        "top": 7084,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "S",
        "top": 7047,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "o",
        "top": 7047,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-12",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "12px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "uppercase",
    "count": 16,
    "contexts": [
      {
        "tag": "span",
        "text": "[ MAX RETURNSMAXET RSNUR ]",
        "top": 3759,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "MAXET RSNUR",
        "top": 3759,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "[ Detection AccuracyDetuiat nccAcocrey ]",
        "top": 3759,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-13",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "240px",
    "lineHeight": "220.1px",
    "letterSpacing": "-13px",
    "traits": "Regular",
    "count": 13,
    "contexts": [
      {
        "tag": "span",
        "text": "Capabilities",
        "top": 8370,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "C",
        "top": 8333,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "a",
        "top": 8333,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-14",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "400",
    "size": "15px",
    "lineHeight": "20px",
    "letterSpacing": "-0.4px",
    "traits": "Regular",
    "count": 12,
    "contexts": [
      {
        "tag": "span",
        "text": "Next.js",
        "top": 17838,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Three.js",
        "top": 17866,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "WebGL",
        "top": 17894,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-15",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "14px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 9,
    "contexts": [
      {
        "tag": "span",
        "text": "01",
        "top": 15951,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "risk level:",
        "top": 16145,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "moderate",
        "top": 16145,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-16",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "32px",
    "lineHeight": "40px",
    "letterSpacing": "-0.8px",
    "traits": "Regular",
    "count": 6,
    "contexts": [
      {
        "tag": "span",
        "text": "360°",
        "top": 7941,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "2",
        "top": 7942,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "100 km²/day",
        "top": 8047,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-17",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "12px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 6,
    "contexts": [
      {
        "tag": "span",
        "text": "[ TECHTECH ]",
        "top": 3535,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "TECH",
        "top": 3535,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "[ aevion ]",
        "top": 16836,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-18",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "240px",
    "lineHeight": "360px",
    "letterSpacing": "-13px",
    "traits": "Regular",
    "count": 5,
    "contexts": [
      {
        "tag": "span",
        "text": "Gear",
        "top": 2113,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "G",
        "top": 2146,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "e",
        "top": 2146,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-19",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "48px",
    "lineHeight": "56px",
    "letterSpacing": "-2.8px",
    "traits": "Regular",
    "count": 5,
    "contexts": [
      {
        "tag": "span",
        "text": "360°",
        "top": 8863,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "3",
        "top": 8862,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "6",
        "top": 8862,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-20",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "56px",
    "lineHeight": "64px",
    "letterSpacing": "-1.4px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "span",
        "text": "Energy",
        "top": 7385,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Infrastructure",
        "top": 7385,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Industry",
        "top": 7385,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-21",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "16px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "span",
        "text": "3",
        "top": 2118,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "4",
        "top": 7089,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "5",
        "top": 8375,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-22",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "0.3px",
    "traits": "uppercase",
    "count": 4,
    "contexts": [
      {
        "tag": "span",
        "text": "[ tech ]",
        "top": 8664,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "[ tech ]",
        "top": 9231,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "[ stats ]",
        "top": 8664,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-23",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "51.8px",
    "lineHeight": "64px",
    "letterSpacing": "-1.4px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "Scan",
        "top": 8860,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Connection",
        "top": 8940,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Compactness",
        "top": 9004,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-24",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "300",
    "size": "48px",
    "lineHeight": "56px",
    "letterSpacing": "-2.9px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "5 rtesrnu",
        "top": 3695,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "±2 cm",
        "top": 3695,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "450m",
        "top": 3695,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-25",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "28px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "GMT 6",
        "top": 29,
        "property": "font"
      },
      {
        "tag": "span",
        "text": ":25 am",
        "top": 29,
        "property": "font"
      },
      {
        "tag": "span",
        "text": ":",
        "top": 29,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-26",
    "family": null,
    "fontStack": "monospace",
    "weight": "400",
    "size": "14px",
    "lineHeight": "21px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "div",
        "text": "Frame: 646",
        "top": 16,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "646",
        "top": 22,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-27",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "span",
        "text": "Scroll Down",
        "top": 936,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Contact Us",
        "top": 17685,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-28",
    "family": "protoMono",
    "fontStack": "protoMono, \"protoMono Fallback\"",
    "weight": "400",
    "size": "12px",
    "lineHeight": "24px",
    "letterSpacing": "0.3px",
    "traits": "uppercase",
    "count": 2,
    "contexts": [
      {
        "tag": "span",
        "text": "PAYLOAD",
        "top": 2554,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "PLATFORM",
        "top": 15568,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-29",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "500",
    "size": "15px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "aevion",
        "top": 26,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-30",
    "family": "switzer",
    "fontStack": "switzer, \"switzer Fallback\", sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "24px",
    "letterSpacing": "normal",
    "traits": "lowercase",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "menu",
        "top": 26,
        "property": "font"
      }
    ]
  }
]
```

### Color configurations

```json
[
  {
    "id": "color-1",
    "hex": "#FFFFFF",
    "alpha": 1,
    "cssValue": "rgb(255, 255, 255)",
    "count": 66,
    "contexts": [
      {
        "tag": "body",
        "text": "Frame: 646 /* The clip wrapper is the element the scroll handler positions (absolute/fixed, animated",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "section",
        "text": "SolutionsSolutions4EnergyEnergyInfrastructureInfrastructureIndustryIndustryGeospatialGeospatialPower",
        "top": 6764,
        "property": "background"
      },
      {
        "tag": "span",
        "text": "01",
        "top": 15951,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-2",
    "hex": "#FDFDFD",
    "alpha": 1,
    "cssValue": "rgb(253, 253, 253)",
    "count": 6,
    "contexts": [
      {
        "tag": "div",
        "text": "aevionLidar Drone ScanningTech Demo by RiottersRiottersGMT 6:25 ammenumenu",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "section",
        "text": "Autonomous LIDAR inspection systems. Precision that secures critical infrastructure. Scroll Down",
        "top": 0,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-3",
    "hex": "#C7CCCB",
    "alpha": 1,
    "cssValue": "rgb(199, 204, 203)",
    "count": 577,
    "contexts": [
      {
        "tag": "span",
        "text": "D",
        "top": 1397,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-4",
    "hex": "#24363F",
    "alpha": 1,
    "cssValue": "rgb(36, 54, 63)",
    "count": 290,
    "contexts": [
      {
        "tag": "span",
        "text": "aevion",
        "top": 26,
        "property": "text"
      },
      {
        "tag": "path",
        "text": "",
        "top": 3270,
        "property": "svg-stroke"
      },
      {
        "tag": "circle",
        "text": "",
        "top": 3178,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-5",
    "hex": "#DDE5E9",
    "alpha": 1,
    "cssValue": "rgb(221, 229, 233)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 8640,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-6",
    "hex": "#24373F",
    "alpha": 0.6392156862745098,
    "cssValue": "rgba(36, 54, 63, 0.64)",
    "count": 35,
    "contexts": [
      {
        "tag": "p",
        "text": "Lidar Drone Scanning",
        "top": 26,
        "property": "text"
      },
      {
        "tag": "span",
        "text": "Riotters",
        "top": 24,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-7",
    "hex": "#005555",
    "alpha": 0.011764705882352941,
    "cssValue": "lab(21.3512 -5.48422 -8.11293 / 0.01)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 7909,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-8",
    "hex": "#25353E",
    "alpha": 0.3215686274509804,
    "cssValue": "lab(21.3512 -5.48422 -8.11293 / 0.32)",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "Infrastructure",
        "top": 7385,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-9",
    "hex": "#26363F",
    "alpha": 0.23921568627450981,
    "cssValue": "rgba(36, 54, 63, 0.24)",
    "count": 63,
    "contexts": [
      {
        "tag": "div",
        "text": "Detecting cracks, deformations and structural risks before they become failures.Detectingcracks,crac",
        "top": 1000,
        "property": "border"
      },
      {
        "tag": "span",
        "text": "±2 cm",
        "top": 3695,
        "property": "text"
      },
      {
        "tag": "section",
        "text": "CapabilitiesCapabilities5[ tech ][ tech ]ScanScanConnectionConnectionCompactnessCompactness[ tech ][",
        "top": 8346,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-10",
    "hex": "#24363F",
    "alpha": 0.8784313725490196,
    "cssValue": "lab(21.3512 -5.48422 -8.11293 / 0.88)",
    "count": 6,
    "contexts": [
      {
        "tag": "span",
        "text": "360°",
        "top": 7941,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-11",
    "hex": "#FFFFFF",
    "alpha": 0.3215686274509804,
    "cssValue": "rgba(255, 255, 255, 0.32)",
    "count": 44,
    "contexts": [
      {
        "tag": "span",
        "text": "S",
        "top": 16007,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-12",
    "hex": "#24363F",
    "alpha": 0.8823529411764706,
    "cssValue": "oklab(0.321251 -0.0180477 -0.0218171 / 0.883)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "5 rtesrnu",
        "top": 3695,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-13",
    "hex": "#24353E",
    "alpha": 0.3568627450980392,
    "cssValue": "oklab(0.321253 -0.0180565 -0.0218162 / 0.357)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "450m",
        "top": 3695,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-14",
    "hex": "#24363F",
    "alpha": 0.47843137254901963,
    "cssValue": "rgba(36, 54, 63, 0.48)",
    "count": 13,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 36,
        "property": "background"
      },
      {
        "tag": "span",
        "text": "[ tech ]",
        "top": 8664,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-15",
    "hex": "#24363E",
    "alpha": 0.5764705882352941,
    "cssValue": "oklab(0.321254 -0.0180636 -0.0218154 / 0.578421)",
    "count": 2,
    "contexts": [
      {
        "tag": "span",
        "text": "[ MAX RETURNSMAXET RSNUR ]",
        "top": 3759,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-16",
    "hex": "#24353F",
    "alpha": 0.30196078431372547,
    "cssValue": "oklab(0.321254 -0.0180636 -0.0218154 / 0.301579)",
    "count": 2,
    "contexts": [
      {
        "tag": "span",
        "text": "[ MAX RANGEMAXA NRGE ]",
        "top": 3759,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-17",
    "hex": "#000000",
    "alpha": 1,
    "cssValue": "rgb(0, 0, 0)",
    "count": 2,
    "contexts": [
      {
        "tag": "div",
        "text": "Frame: 646",
        "top": 16,
        "property": "text"
      },
      {
        "tag": "span",
        "text": "646",
        "top": 22,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-18",
    "hex": "#FFFFFF",
    "alpha": 0.8,
    "cssValue": "rgba(255, 255, 255, 0.8)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Frame: 646",
        "top": 16,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-19",
    "hex": "#CACFD1",
    "alpha": 1,
    "cssValue": "rgb(202, 207, 209)",
    "count": 2,
    "contexts": [
      {
        "tag": "div",
        "text": "This website is a tech demo. Want something similar?This website is a tech demo. Want something simi",
        "top": 17512,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-20",
    "hex": "#FFFFFF",
    "alpha": 0.23921568627450981,
    "cssValue": "oklab(0.999994 0.0000455678 0.0000200868 / 0.24)",
    "count": 10,
    "contexts": [
      {
        "tag": "div",
        "text": "01",
        "top": 15943,
        "property": "border"
      },
      {
        "tag": "div",
        "text": "",
        "top": 16153,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-21",
    "hex": "#263340",
    "alpha": 0.0784313725490196,
    "cssValue": "rgba(36, 54, 63, 0.08)",
    "count": 1,
    "contexts": [
      {
        "tag": "button",
        "text": "menumenu",
        "top": 24,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-22",
    "hex": "#D6D9D9",
    "alpha": 1,
    "cssValue": "rgb(214, 217, 217)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "d",
        "top": 8965,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-23",
    "hex": "#B7BABC",
    "alpha": 1,
    "cssValue": "rgb(183, 186, 188)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "e",
        "top": 8965,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-24",
    "hex": "#E7E9EA",
    "alpha": 1,
    "cssValue": "rgb(231, 233, 234)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "o",
        "top": 8965,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-25",
    "hex": "#DEE1E2",
    "alpha": 1,
    "cssValue": "rgb(222, 225, 226)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "n",
        "top": 8965,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-26",
    "hex": "#D8DBDC",
    "alpha": 1,
    "cssValue": "rgb(216, 219, 220)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "c",
        "top": 8965,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-27",
    "hex": "#8D9295",
    "alpha": 1,
    "cssValue": "rgb(141, 146, 149)",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "s",
        "top": 8965,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-28",
    "hex": "#171717",
    "alpha": 1,
    "cssValue": "rgb(23, 23, 23)",
    "count": 6,
    "contexts": [
      {
        "tag": "span",
        "text": "Detecting cracks, deformations and structural risks before they become failures.",
        "top": 1400,
        "property": "text"
      }
    ]
  }
]
```

### Extraction limits

- Font families are computed CSS declarations, not optical font identification.
- Colors are computed CSS converted by the browser to sRGB; image/video pixels and gradient stops are not sampled.
- Transparent colors are recorded with alpha but excluded from opaque palette role assignments.
- Only currently rendered DOM elements are sampled; closed shadow roots and iframe contents are excluded.

## Type, spacing, and shape language

- Spacing rhythm: Airy and expansive, utilizing massive vertical spacing between major sections to accommodate scroll animations, with tighter, precise padding within data grid components.
- Corner style: Sharp, 90-degree corners are universal across the layout grids and the contact button, emphasizing precision.
- Radius: Not actively used for layout containers; buttons and grids rely on sharp edges. (Some minor UI icons like the circle indicator use border-radius: 50%).
- Borders: Extensive use of 1px solid borders (often rgba(36, 54, 63, 0.24)) to create structure, tables, and divide content areas, functioning as a primary layout tool.
- Buttons: Minimalist. The primary CTA is a solid rectangle with sharp corners (color-4). The nav button is ghost/subtle with slight background opacity.
- Content width: Appears fluid but constrained within a wide container, with some elements (like oversized text) bleeding or stretching near edges, while data grids maintain a structured central column.
- Density: Very low overall density (sparse) to allow the 3D model to breathe, contrasting with high-density micro-layouts within specific stat blocks.
- Evidence: Visual inspection of the layouts confirms sharp edges on grid boxes (color-9), vast whitespace around the drone, and solid, sharp-edged buttons.

## Sections

Gallery section count: 8. Each entry corresponds to one gallery capture.

1. **Hero — Autonomous LiDAR Drone Hero** (Home)
   AI suggestion (98% confidence): Complete page-opening hero with brand navigation, a dominant drone product visual, concise positioning copy, and scroll cue.
   Capture: 1440×1008px; page bounds 0–1008px of 18127px; source section ID: `f06f9f26-7672-46a8-98c8-3d709493c4e4`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/ad1b4893318db4c9d6acc3d96ef2cdc0a172529d67d4de9a786ef98ae35f0993/f06f9f26-7672-46a8-98c8-3d709493c4e4.webp
   SECTION.md v3.2: `f06f9f26-7672-46a8-98c8-3d709493c4e4` (deterministic evidence; editorial review pending)
2. **Features — Gear Gear** (Home)
   Reusable feature composition from Home, organized around “Gear Gear”.
   Capture: 1440×864px; page bounds 2090–2954px of 18127px; source section ID: `00d1237a-56d6-4851-9add-ae1102a81b57`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/1f197dfc8113b4b145ecd0f1c2cd14c4a45205e55e80caf6b7c16ef2d639af75/section_crop-00d1237a-2026-10-06T06-25-59-515Z.webp
   SECTION.md v3.2: `00d1237a-56d6-4851-9add-ae1102a81b57` (deterministic evidence; editorial review pending)
3. **Features — Lidar Drone Scanning Features** (Home)
   Reusable feature composition from Home, organized around “Lidar Drone Scanning Features”.
   Capture: 1440×3900px; page bounds 2954–6854px of 18127px; source section ID: `a9a2e00f-aed6-4a51-ae37-06282711a5ba`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/21a3ec2e859e348b5dda0258e9855cc1952c4beb9a2412f08d90fe3312856c20/section_crop-a9a2e00f-2026-10-06T06-26-00-434Z.webp
   SECTION.md v3.2: `a9a2e00f-aed6-4a51-ae37-06282711a5ba` (deterministic evidence; editorial review pending)
4. **Features — Solutions Solutions** (Home)
   Reusable feature composition from Home, organized around “Solutions Solutions”.
   Capture: 1440×1582px; page bounds 6764–8346px of 18127px; source section ID: `08f964f6-a0ef-4282-ab97-57e7f36ccfe4`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/d134aeaef63982870b34cc9420a58d2e9330bfed6a239249d643f62df0fd19db/section_crop-08f964f6-2026-10-06T06-26-01-634Z.webp
   SECTION.md v3.2: `08f964f6-a0ef-4282-ab97-57e7f36ccfe4` (deterministic evidence; editorial review pending)
5. **Features — Software Software** (Home)
   Reusable feature composition from Home, organized around “Software Software”.
   Capture: 1440×1665px; page bounds 15147–16812px of 18127px; source section ID: `f19c2f90-8540-4c67-b89f-a653a694aa54`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/c1f2289688e063c012433bc0c468f4e50da8524e67b32242bce2bbf26efe3a54/section_crop-f19c2f90-2026-10-06T06-26-02-654Z.webp
   SECTION.md v3.2: `f19c2f90-8540-4c67-b89f-a653a694aa54` (deterministic evidence; editorial review pending)
6. **Features — Infrastructure Defect Detection Feature** (Home)
   AI suggestion (94% confidence): Self-contained feature panel pairing a large inspection drone visual with a clear benefit statement about detecting cracks, deformation, and structural risks; bounded by horizontal dividers.
   Capture: 1440×1083px; page bounds 1011–2094px of 18127px; source section ID: `0866f77c-f2bf-4602-ad72-d86466269b20`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/256c3817eba1852e7dacec8671152d93ce78c1f4a1b73a389fb149a5f9472020/0866f77c-f2bf-4602-ad72-d86466269b20.webp
   SECTION.md v3.2: `0866f77c-f2bf-4602-ad72-d86466269b20` (deterministic evidence; editorial review pending)
7. **Features — 360° Scan Capability** (Home)
   AI suggestion (93% confidence): Complete capability showcase with oversized heading, feature navigation, drone visualization, and a concise 360° LiDAR specification. It is the strongest complete representative of the repeated capability pattern.
   Capture: 1440×771px; page bounds 8346–9117px of 18127px; source section ID: `f7d0c3aa-94e3-4a76-b047-9bfa6c4eba03`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/4491aa6e7a5adf686f2b12f32e63b84aa92594857dd03cae032eaf3b24a9bf6c/f7d0c3aa-94e3-4a76-b047-9bfa6c4eba03.webp
   SECTION.md v3.2: `f7d0c3aa-94e3-4a76-b047-9bfa6c4eba03` (deterministic evidence; editorial review pending)
8. **Footer — Tech Demo Contact and Services Footer** (Home)
   AI suggestion (98% confidence): Complete page footer with a conversion prompt, Contact Us button, technology and service lists, brand mark, and legal copy; it has a clear divider-led beginning and ends cleanly at the page bottom.
   Capture: 1440×612px; page bounds 17515–18127px of 18127px; source section ID: `538e3d2f-33aa-4220-9b34-5a41cdfafa98`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/d9c242df9d08e5133fb5e0416976d4092af2ef77470287634cd9d280e704a6d7/538e3d2f-33aa-4220-9b34-5a41cdfafa98.webp
   SECTION.md v3.2: `538e3d2f-33aa-4220-9b34-5a41cdfafa98` (deterministic evidence; editorial review pending)

## Capture and motion evidence

- Desktop screenshot: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/58b2bda263e517b042fc0d172541029e3189061403696a74c773a75084942b66/desktop_full-da3027d7-2026-10-06T06-25-49-264Z.jpg
- Mobile screenshot: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/8099022ccd6940570e385be7490fba90f4598804cb850d3ac127e3ced4dd4203/mobile_full-da3027d7-2026-10-06T06-26-34-089Z.webp
- Open Graph image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/1ced14ef7c0205310e796b45f5425a2a52a28e003e63c2247ae6ac1a374dff4e/og_image-da3027d7-2026-10-06T06-25-57-042Z.webp
- Full-page video: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/0767ec8f3d9915d58129562a68141460c37365c39512e70b1a53c5a24879a6b1/motion-1791268243015.mp4
- Video poster: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/82bdc200ba3f90390518257720f0113f030a24c9a862fc4e2d995e83d5ce065a/motion-poster-1791268243015.webp
- Motion status: Recording attached. Consult the motion score and section motion records; do not infer exact easing from frames alone.

## Implementation contract

- Treat computed CSS values, screenshot dimensions, and section bounds as measured evidence.
- Treat typography roles, palette roles, style labels, quality scores, and prose analysis as model or curator judgments.
- Rebuild the page in the listed section order. Request SECTION.md v3.2 using the listed ID. Promoted IDs include editorial observation and judgment; raw gallery IDs still return deterministic geometry, site design facts, media treatment, and explicit evidence gaps.
- Do not invent exact responsive behavior, motion curves, or hidden interaction states when they were not captured.

## Reusable components

- Navigation Bar
- Hero With Background Imagery
- Stat Block
- Split Hero
- Tabs
- Primary Button
- Footer
- Ghost Button
- Feature Collection
- Scroll Driven 3D Narrative
- Hairline Grid Layout
- Oversized Background Typography
- Data Bracket Labels

## Quality rubric

Overall: 60.4/100 (Good)
Evidence coverage: 100%
Judge tier: Good
Verdict: A polished, purposeful technical product demo built around a single strong idea — a persistent 3D drone choreographed to scroll position and tied to feature copy — executed with a disciplined monochrome palette and a consistent typographic/grid system. It reads as competent, good craft within a familiar scroll-driven product-showcase idiom, but repetition in the Capabilities template, a color system with almost no usable accent, scrambled text in several captured frames, and reliance on one motion mechanic for the entire length of the page keep it from the structural richness and polish required for a 'strong' rating.

- Typography (15%): 62 — A deliberate two-family system (Switzer light-weight display/body, protoMono for bracketed technical labels) is applied consistently from hero to footer, with a clear scale from 14px body to 240px oversized section titles. The -13px tracking on the huge display sizes and the uppercase mono microcopy ('[ TECH ]', '[ MAX RANGE ]') reinforce the engineering theme. However, several captured frames show garbled/scrambled letter order in headline and label text ('5 rtesrnu', 'MAXET RSNUR', 'DETECTIRUOCA CNCYA', 'Detuiat nccAcocrey'), which reads as either an unresolved scramble-decode effect or a rendering fault — either way it undercuts legibility and polish at the moments captured.
- Color (10%): 60 — A tightly restrained monochrome palette (white #FFFFFF/#FDFDFD canvas, charcoal #24363F text, light grey #C7CCCB secondary) suits the clinical, technical brand and is applied with discipline across sections. But the palette is almost entirely neutral with only a faint, barely-visible teal/green accent (color-7 at ~1% alpha, a green ring on the drone) — there is little evidence of a confidently used secondary color to create visual accents, hierarchy, or memorable brand color moments beyond the grey-on-white system.
- Layout (20%): 64 — A hairline-grid system with sharp corners, consistent stat-block compartments, split-hero text/asset pairings, and oversized typographic section dividers is applied across Hero, Gear, Solutions, Capabilities, Software, and Footer sections, showing a real systemized approach rather than a one-off hero. Density is intentionally low to let the 3D model breathe, with tighter stat grids providing contrast. The weakness is that the core 'left text / right image or 3D asset' template repeats with only size changes across the Capabilities section (Scan/Connection/Compactness all use nearly identical composition), reducing structural variety across the page's long scroll length (18,127px tall).
- Motion (20%): 64 — The site's signature device is a persistent 3D drone that translates, scales, swaps folded/unfolded states, and tints in sync with scroll position, directly illustrating adjacent copy (observed moments show spec-cycling tied to drone highlight color, and model-state swaps tied to active Capabilities tab). This is a real, content-linked scroll narrative rather than decorative parallax, and reverse-scroll reportedly replays consistently. However, the entire motion vocabulary is built around one mechanic (scroll-position-driven transform/model-swap) repeated for most of the page's length, with recorded frames showing extended holds where little visually changes between distant timestamps (e.g., near-identical frames at 22.5s/23.1s and 45.0s/45.6s), suggesting pacing that may feel static between transition beats. No evidence of eased secondary motion, micro-interactions, or hover-state anima
- Originality (25%): 56 — The central conceit — a persistent 3D hero object scroll-bound to accompanying copy, swapping states to demonstrate product features — is a well-known high-end product-showcase pattern (seen across many electronics/automotive launch sites) rather than a genuinely novel structural idea. The blueprint/hairline-grid aesthetic, bracketed mono labels, and oversized watermark typography are all familiar devices within technical/developer-portfolio design language. Execution is competent and the drone-state-to-copy mapping is a nice, purposeful detail, but there is no hard-to-substitute idea here that couldn't be found in comparable scroll-driven product demos.
- Content (10%): 55 — Technical specs (5 returns, ±2cm, 450m, 240,000 pts/s) are tied to the drone model's visual states and to section narratives (Solutions tabs correspond to industry use-cases with matching imagery), which is a real integration effort. But the site self-identifies as a 'tech demo' with disclaimer copy about DJI trademarks, and several data labels appear scrambled/corrupted at capture time, undermining confidence that the specific numeric content is presented reliably and legibly throughout.

Coverage: 100% of the current weighted rubric. Compare overall scores only at similar evidence coverage.

Formula: weighted mean of scored axes — Typography 15%, Color 10%, Layout 20%, Motion 20%, Originality 25%, Content 10%. Inconclusive and not-assessed axes are excluded and coverage is shown explicitly.

## Verification checklist

- [x] Score evidence
- [x] Design tokens
- [ ] Functional palette
- [x] Normalized sections
- [x] Reusable components
- [x] Typography roles

## Curator notes

A giant pale wordmark fades behind the drone photo, floating the product against soft grey gradients like it is airborne. Repeated specs in bold black and light grey, paired with the same drone shot rotated at different scales, let visitors scan hard numbers down a long page without losing trust in the claims.

## Usage guidance

Use this record as design evidence. Combine it with other references and create an original implementation; do not reproduce the source website or its proprietary copy and assets.