# Maze — Design Reference

Schema: Design Details DESIGN.md v3.2
Source: https://maze.co/
Captured: 2026-10-08
CSS measured: 2026-10-08T01:46:05.678Z at 1440×1000 — https://maze.co/
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 Maze homepage features a modern, clean, and highly legible design with a strong focus on typography and whitespace. The color palette is primarily neutral (white, off-white, black, dark gray) with strategic pops of bright lime green and softer pastels (purple, mint) for emphasis and visual interest. The 'Phonic' font family is used exclusively across the site, contributing to a cohesive brand identity. The layout is structured with large headings, concise copy, and clear calls to action. Visual elements include floating cards, stylized graphics, and subtle background textures, creating a sense of depth and interactivity. The design is airy and structured, avoiding clutter to guide the us

## Classification

- Industry: technology
- Site type: Landing, Blog
- Business model: AI, Software
- Styles: minimal, typographic, corporate, colourful, clean-tech
- Platform: Custom code
- Technology: Tailwind CSS, Three.js

## Typography

- Display: Phonic — weight 300; size 130px; line-height 136.5px; tracking -11.7px; Regular (95% role confidence, computed values)
- Heading: Phonic — weight 300; size 90px; line-height 90px; tracking -6.3px; Regular (90% role confidence, computed values)
- Body: Phonic — weight 300; size 22px; line-height 30.8px; tracking -0.7px; Regular (85% role confidence, computed values)
- Mono: Phonic — weight 400; size 14px; line-height 14.7px; tracking 0.4px; uppercase (70% role confidence, computed values)

## Functional palette

- Text — text #1C1C1C: color-3: computed rgb(28, 28, 28); AI role: Near black (#1C1C1C) used for primary text, ensuring strong contrast against light backgrounds. (95% role confidence, computed values)
- Canvas — canvas #FFFFFF: color-1: computed oklch(1 0 0); AI role: Pure white (#FFFFFF) used extensively for backgrounds, particularly in cards and main content areas. (90% role confidence, computed values)
- Surface — surface #F5F4F0: color-2: computed oklch(0.967 0.005 95.1); AI role: Off-white/light gray (#F5F4F0) used for alternating section backgrounds and subtle contrast. (85% role confidence, computed values)
- Muted Text — muted text #706F6C: color-6: computed oklch(0.542 0.005 91.5); AI role: Medium gray (#706F6C) used for secondary text, descriptions, and less critical information. (85% role confidence, computed values)
- Accent — accent #DBF570: color-10: computed oklch(0.925 0.161 118.9); AI role: Bright lime green (#DBF570) used for vibrant highlights, interactive graphic elements, and badges. (85% role confidence, computed values)
- Border — border #EAE6E1: color-8: computed oklch(0.927 0.008 73.7); AI role: Light gray (#EAE6E1) used for borders, dividers, and subtle lines separating elements. (75% 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": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "46px",
    "lineHeight": "52.9px",
    "letterSpacing": "-2.3px",
    "traits": "Regular",
    "count": 48,
    "contexts": [
      {
        "tag": "h3",
        "text": "Reach the right people, effortlessly",
        "top": 2395,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Card sorting",
        "top": 4779,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Tree testing",
        "top": 4779,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-2",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "28px",
    "lineHeight": "36.4px",
    "letterSpacing": "-1.1px",
    "traits": "Regular",
    "count": 14,
    "contexts": [
      {
        "tag": "p",
        "text": "Maze puts continuous user and market research behind every decision, so you move fast in the right d",
        "top": 556,
        "property": "font"
      },
      {
        "tag": "blockquote",
        "text": "Maze allows us to democratize research across multiple teams. We now collect feedback and insights 2",
        "top": 6169,
        "property": "font"
      },
      {
        "tag": "blockquote",
        "text": "Maze's AI is incredible—it surfaces things we hadn’t considered, which has an immediate impact on ho",
        "top": 6169,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-3",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "58px",
    "lineHeight": "63.8px",
    "letterSpacing": "-3.5px",
    "traits": "Regular",
    "count": 8,
    "contexts": [
      {
        "tag": "h2",
        "text": "Trusted by research teams who refuse to guess",
        "top": 3145,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Recruit the right participants, run rigorous",
        "top": 4444,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "studies with research-grade AI, and bring",
        "top": 4507,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-4",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "90px",
    "lineHeight": "90px",
    "letterSpacing": "-6.3px",
    "traits": "Regular",
    "count": 5,
    "contexts": [
      {
        "tag": "h1",
        "text": "Every question. One place to test it.",
        "top": 716,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Recruit",
        "top": 2257,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Research",
        "top": 2257,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-5",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "130px",
    "lineHeight": "136.5px",
    "letterSpacing": "-11.7px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "h1",
        "text": "Research at the",
        "top": 258,
        "property": "font"
      },
      {
        "tag": "h1",
        "text": "pace of change",
        "top": 395,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-6",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "130px",
    "lineHeight": "130px",
    "letterSpacing": "-11.7px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "h1",
        "text": "Make learning your advantage",
        "top": 8400,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-7",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "17px",
    "lineHeight": "24px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 48,
    "contexts": [
      {
        "tag": "p",
        "text": "The State of Market Research Report is here.",
        "top": 12,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Instantly tap into our panel of over 6 million participants or connect with your own community. Maze",
        "top": 2517,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Jean-Baptiste Kaloya",
        "top": 6370,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-8",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "12.6px",
    "letterSpacing": "0.4px",
    "traits": "uppercase",
    "count": 23,
    "contexts": [
      {
        "tag": "p",
        "text": "Head of product",
        "top": 6395,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "UX Lead",
        "top": 6395,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Senior Director, User Experience & Product Innovation",
        "top": 6384,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-9",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "22px",
    "lineHeight": "30.8px",
    "letterSpacing": "-0.7px",
    "traits": "Regular",
    "count": 10,
    "contexts": [
      {
        "tag": "p",
        "text": "Maze connects every research method, team, and stage, so learning keeps pace with the decisions that",
        "top": 920,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Build a shared understanding of your customers, market, and category. Give your strategy a clear, ev",
        "top": 4087,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "All traffic, including customer data, is transported securely and encrypted via SSL.",
        "top": 5490,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-10",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "14.7px",
    "letterSpacing": "0.4px",
    "traits": "uppercase",
    "count": 10,
    "contexts": [
      {
        "tag": "span",
        "text": "Platform",
        "top": 81,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Solutions",
        "top": 81,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Resources",
        "top": 81,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-11",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "12px",
    "letterSpacing": "0.4px",
    "traits": "uppercase",
    "count": 9,
    "contexts": [
      {
        "tag": "span",
        "text": "Encrypted transmission",
        "top": 5453,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Access control",
        "top": 5453,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Data center security",
        "top": 5453,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-12",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16.8px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "New",
        "top": 9129,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "New",
        "top": 9449,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Copyright © 2026 Maze",
        "top": 9802,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-13",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "14px",
    "letterSpacing": "0.4px",
    "traits": "uppercase",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "Trends and insights",
        "top": 6746,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-14",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "400",
    "size": "17px",
    "lineHeight": "17px",
    "letterSpacing": "-0.3px",
    "traits": "Regular",
    "count": 15,
    "contexts": [
      {
        "tag": "button",
        "text": "Read the report",
        "top": 13,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Log in",
        "top": 77,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Try Maze for free",
        "top": 69,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-15",
    "family": "Phonic",
    "fontStack": "Phonic, sans-serif",
    "weight": "300",
    "size": "28px",
    "lineHeight": "29.4px",
    "letterSpacing": "-0.6px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "button",
        "text": "Start for free",
        "top": 8692,
        "property": "font"
      },
      {
        "tag": "button",
        "text": "Request a demo",
        "top": 8692,
        "property": "font"
      }
    ]
  }
]
```

### Color configurations

```json
[
  {
    "id": "color-1",
    "hex": "#FFFFFF",
    "alpha": 1,
    "cssValue": "oklch(1 0 0)",
    "count": 107,
    "contexts": [
      {
        "tag": "p",
        "text": "The State of Market Research Report is here.",
        "top": 12,
        "property": "text"
      },
      {
        "tag": "button",
        "text": "Read the report",
        "top": 13,
        "property": "text"
      },
      {
        "tag": "button",
        "text": "Read the report",
        "top": 13,
        "property": "::after-background"
      }
    ]
  },
  {
    "id": "color-2",
    "hex": "#F5F4F0",
    "alpha": 1,
    "cssValue": "oklch(0.967 0.005 95.1)",
    "count": 9,
    "contexts": [
      {
        "tag": "div",
        "text": "The State of Market Research Report is here.Read the reportPlatformMaze PlatformTurn research into a",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "button",
        "text": "Monitor",
        "top": 3604,
        "property": "control-background"
      },
      {
        "tag": "section",
        "text": "Trends and insightsMarket research is changingInsights from 200+ research professionals and industry",
        "top": 6603,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-3",
    "hex": "#1C1C1C",
    "alpha": 1,
    "cssValue": "rgb(28, 28, 28)",
    "count": 204,
    "contexts": [
      {
        "tag": "div",
        "text": "The State of Market Research Report is here.Read the report",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "path",
        "text": "",
        "top": 76,
        "property": "svg-fill"
      },
      {
        "tag": "span",
        "text": "Platform",
        "top": 81,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-4",
    "hex": "#ADEEDA",
    "alpha": 1,
    "cssValue": "oklch(0.9 0.071 173.6)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Trends and insightsMarket research is changingInsights from 200+ research professionals and industry",
        "top": 6683,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-5",
    "hex": "#FDFFFF",
    "alpha": 0.5019607843137255,
    "cssValue": "oklab(1 0 0 / 0.5)",
    "count": 3,
    "contexts": [
      {
        "tag": "div",
        "text": "Move fastSource user feedback in 1-2 days, not weeksRead case study",
        "top": 7647,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-6",
    "hex": "#706F6C",
    "alpha": 1,
    "cssValue": "oklch(0.542 0.005 91.5)",
    "count": 80,
    "contexts": [
      {
        "tag": "button",
        "text": "Try Maze for free",
        "top": 69,
        "property": "border"
      },
      {
        "tag": "p",
        "text": "Maze puts continuous user and market research behind every decision, so you move fast in the right d",
        "top": 556,
        "property": "text"
      },
      {
        "tag": "h2",
        "text": "Research",
        "top": 2257,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-7",
    "hex": "#000000",
    "alpha": 1,
    "cssValue": "rgb(0, 0, 0)",
    "count": 12,
    "contexts": [
      {
        "tag": "svg",
        "text": "",
        "top": 81,
        "property": "svg-stroke"
      },
      {
        "tag": "path",
        "text": "",
        "top": 87,
        "property": "svg-stroke"
      },
      {
        "tag": "div",
        "text": "Recruit the right participants, run rigorous",
        "top": 4444,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-8",
    "hex": "#EAE6E1",
    "alpha": 1,
    "cssValue": "oklch(0.927 0.008 73.7)",
    "count": 8,
    "contexts": [
      {
        "tag": "header",
        "text": "PlatformMaze PlatformTurn research into a system of learning<img data-gatsby-image-ssr=\"\" width=\"320",
        "top": 49,
        "property": "border"
      },
      {
        "tag": "button",
        "text": "Recruit",
        "top": 2249,
        "property": "control-background"
      },
      {
        "tag": "div",
        "text": "Company",
        "top": 9045,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-9",
    "hex": "#FFFFFF",
    "alpha": 0.6980392156862745,
    "cssValue": "oklab(1 0 0 / 0.7)",
    "count": 7,
    "contexts": [
      {
        "tag": "button",
        "text": "Try Maze for free",
        "top": 69,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-10",
    "hex": "#DBF570",
    "alpha": 1,
    "cssValue": "oklch(0.925 0.161 118.9)",
    "count": 15,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 6119,
        "property": "background"
      },
      {
        "tag": "span",
        "text": "New",
        "top": 9129,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-11",
    "hex": "#92B116",
    "alpha": 1,
    "cssValue": "oklch(0.7119 0.1668 121.63)",
    "count": 36,
    "contexts": [
      {
        "tag": "svg",
        "text": "",
        "top": 6128,
        "property": "svg-fill"
      },
      {
        "tag": "path",
        "text": "",
        "top": 6131,
        "property": "svg-fill"
      }
    ]
  },
  {
    "id": "color-12",
    "hex": "#3C3C3C",
    "alpha": 1,
    "cssValue": "oklch(0.356 0 0)",
    "count": 5,
    "contexts": [
      {
        "tag": "span",
        "text": "Company",
        "top": 9053,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-13",
    "hex": "#F6F6F6",
    "alpha": 1,
    "cssValue": "rgb(246, 246, 246)",
    "count": 5,
    "contexts": [
      {
        "tag": "button",
        "text": "",
        "top": 925,
        "property": "border"
      },
      {
        "tag": "img",
        "text": "",
        "top": 927,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-14",
    "hex": "#D2CEC6",
    "alpha": 1,
    "cssValue": "oklch(0.852 0.012 84.6)",
    "count": 1,
    "contexts": [
      {
        "tag": "footer",
        "text": "CompanyAboutBlogCareersNewsroomContact usPlatformPricingAI ModeratorNewModerated InterviewsPrototype",
        "top": 8980,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-15",
    "hex": "#9E9B94",
    "alpha": 1,
    "cssValue": "oklch(0.69 0.011 87.5)",
    "count": 4,
    "contexts": [
      {
        "tag": "input",
        "text": "",
        "top": 9351,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-16",
    "hex": "#18B96E",
    "alpha": 1,
    "cssValue": "rgb(24, 185, 110)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 959,
        "property": "background"
      }
    ]
  }
]
```

### 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: Generous vertical spacing between major sections, creating an airy feel. Tight, consistent padding within cards and tight grouping of related text elements.
- Corner style: Consistent use of rounded corners on buttons, floating cards, feature cards, and form inputs.
- Radius: Buttons appear to use pill-shaped (fully rounded) radii, while cards use softer, medium rounded corners.
- Borders: Subtle, solid borders (1px) used on outline buttons, specific cards, and to separate header/footer areas. High-contrast elements often rely on background color rather than borders.
- Buttons: Pill-shaped buttons. Primary buttons are solid dark gray/black with white text. Outline buttons are transparent with dark borders and text.
- Content width: Content is centered with generous side margins, likely constrained to a maximum readable width on larger desktop displays.
- Density: Low density overall. Ample whitespace is prioritized over packing information tightly, enhancing readability and focus.
- Evidence: Observations based on visual relationships, alignment, padding within visible cards, button shapes, and overall layout structure shown in the desktop crops.

## Sections

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

1. **Features — Target with precision** (Explore study recruitment)
   Reusable feature composition from Explore study recruitment, organized around “Target with precision”.
   Capture: 1440×800px; page bounds 826–1626px of 7591px; source section ID: `e4f7e85c-b933-4bfd-8c18-4687c82168ca`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/ccb66f5d70de190b0bcdfeb40b49b22382d0bd6170563005a913672a8faa2c7d/section_crop-e4f7e85c-2026-10-08T01-58-08-800Z.webp
   SECTION.md v3.2: `e4f7e85c-b933-4bfd-8c18-4687c82168ca` (deterministic evidence; editorial review pending)
2. **Features — Test with your users** (Explore study recruitment)
   Reusable feature composition from Explore study recruitment, organized around “Test with your users”.
   Capture: 1440×800px; page bounds 2426–3226px of 7591px; source section ID: `ed61a5d9-9d7c-453d-bf23-6ac3462e7f41`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/8d1c54c83c9e97f5784c3b88314628c17a80874b9ea6a5df939fc22dbcdf6e28/section_crop-ed61a5d9-2026-10-08T01-58-10-843Z.webp
   SECTION.md v3.2: `ed61a5d9-9d7c-453d-bf23-6ac3462e7f41` (deterministic evidence; editorial review pending)
3. **Features — Recruit the right participants, run rigorous studies with research-grade…** (Home)
   Reusable feature composition from Home, organized around “Recruit the right participants, run rigorous studies with research-grade…”.
   Capture: 1440×745px; page bounds 4324–5069px of 9883px; source section ID: `f983603b-8399-4608-9665-51b1226697e8`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/517b143c5e965e1a96adf94ec61ea7d897318d1e3aeda97fc40beb1e5a814cbb/section_crop-f983603b-2026-10-08T01-46-26-466Z.webp
   SECTION.md v3.2: `f983603b-8399-4608-9665-51b1226697e8` (deterministic evidence; editorial review pending)
4. **Features — Recruit the right audience for the right feedback with Maze Panel** (Explore study recruitment)
   Reusable feature composition from Explore study recruitment, organized around “Recruit the right audience for the right feedback with Maze Panel”.
   Capture: 1440×718px; page bounds 3226–3944px of 7591px; source section ID: `5e7a8252-f44f-4073-bd86-f9db975c05e2`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/bdbcb77036793ca80893b1ec00a24a4318e833d814b1369c4dde643e292e31ac/section_crop-5e7a8252-2026-10-08T01-58-11-771Z.webp
   SECTION.md v3.2: `5e7a8252-f44f-4073-bd86-f9db975c05e2` (deterministic evidence; editorial review pending)
5. **Features — Maze Features** (Home)
   Reusable feature composition from Home, organized around “Maze Features”.
   Capture: 1440×640px; page bounds 5963–6603px of 9883px; source section ID: `53d33201-76a1-4f73-9b3e-17c52db912aa`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/92006c2fac0eaaee425ecbdb88696a5b48124e52320bdcf62e71c0f7f8dd5d0b/section_crop-53d33201-2026-10-08T01-46-29-018Z.webp
   SECTION.md v3.2: `53d33201-76a1-4f73-9b3e-17c52db912aa` (deterministic evidence; editorial review pending)
6. **Features — Research that delivers more than insights** (Home)
   Reusable feature composition from Home, organized around “Research that delivers more than insights”.
   Capture: 1440×876px; page bounds 7316–8192px of 9883px; source section ID: `5da0ee15-1de1-42d5-8363-fa9ffd1157e9`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/418314e55e873c1e9305c617235a0081c7f25c3893c5c977c606f0152a99bae9/section_crop-5da0ee15-2026-10-08T01-46-32-543Z.webp
   SECTION.md v3.2: `5da0ee15-1de1-42d5-8363-fa9ffd1157e9` (deterministic evidence; editorial review pending)
7. **Features — Every interaction is an opportunity to learn** (Explore study recruitment)
   Reusable feature composition from Explore study recruitment, organized around “Every interaction is an opportunity to learn”.
   Capture: 1440×660px; page bounds 6028–6688px of 7591px; source section ID: `caa108e6-4b28-43ab-97f7-20eb86afb010`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/0dc5eac9ecb7a9a97edddb54bf21d907ffeacb8a461f4863a536b2bb78e5fac7/section_crop-caa108e6-2026-10-08T01-58-15-919Z.webp
   SECTION.md v3.2: `caa108e6-4b28-43ab-97f7-20eb86afb010` (deterministic evidence; editorial review pending)
8. **Hero — Reach the right audience hero** (Explore study recruitment)
   AI suggestion (97% confidence): Complete two-column hero with product label, prominent value proposition, supporting copy, dual CTAs, and a distinctive audience-criteria interface visual.
   Capture: 1440×687px; page bounds 129–816px of 7591px; source section ID: `65102f61-32a4-4b25-a479-046e18d7f679`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/1cb56ace86e2f4642937ec6519447db8dc27dac348d979ab64d788c968b60b1c/65102f61-32a4-4b25-a479-046e18d7f679.webp
   SECTION.md v3.2: `65102f61-32a4-4b25-a479-046e18d7f679` (deterministic evidence; editorial review pending)
9. **Hero — Research at the pace of change** (Home)
   AI suggestion (98% confidence): Complete hero with a strong headline, supporting copy, dual CTAs, product-research imagery, and a visible scroll cue.
   Capture: 1440×876px; page bounds 132–1008px of 9883px; source section ID: `a3837d93-5ef4-4f5a-b047-6180fc0a9c44`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/a82ff8138bbfdc984606505a20b0a8ecf5d5990a75bc473cf07f8fbbcc0f8fa9/a3837d93-5ef4-4f5a-b047-6180fc0a9c44.webp
   SECTION.md v3.2: `a3837d93-5ef4-4f5a-b047-6180fc0a9c44` (deterministic evidence; editorial review pending)
10. **Feature Card — Global reach for interviews** (Explore study recruitment)
   AI suggestion (93% confidence): Self-contained alternating feature block pairing a recruitment interface visual with a clear benefit statement, explanatory copy, and concrete performance bullets.
   Capture: 1440×684px; page bounds 1704–2388px of 7591px; source section ID: `cf4aa9c8-82eb-419a-9c1b-be5474dc6c06`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/90187b26674afeeb37a8ebbc3c43d57419a2500ee180c3d11ea582b1364ad7bb/cf4aa9c8-82eb-419a-9c1b-be5474dc6c06.webp
   SECTION.md v3.2: `cf4aa9c8-82eb-419a-9c1b-be5474dc6c06` (deterministic evidence; editorial review pending)
11. **Features — Recruit, Research, Decide workflow** (Home)
   AI suggestion (94% confidence): Complete tabbed product feature section showing the Recruit use case, explanatory copy, study-recruitment link, and a substantial interface visual inside a bounded card.
   Capture: 1440×780px; page bounds 2214–2994px of 9883px; source section ID: `d756b1c3-6975-4e7b-a5ab-1cf9109922de`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/7221a7e9cab253345d82755b5670b2644a333cc85e6aeed0d1905f7a4fb5507b/d756b1c3-6975-4e7b-a5ab-1cf9109922de.webp
   SECTION.md v3.2: `d756b1c3-6975-4e7b-a5ab-1cf9109922de` (deterministic evidence; editorial review pending)
12. **Logo Cloud — Trusted by research teams** (Home)
   AI suggestion (98% confidence): Complete social-proof section with a clear headline and a single row of recognizable customer logos.
   Capture: 1440×321px; page bounds 3125–3446px of 9883px; source section ID: `b677351c-1855-427b-a03c-4503a32abfc2`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/099f78dbcb557025f1d2af078045e5df51c759052e068373e563051e577af681/b677351c-1855-427b-a03c-4503a32abfc2.webp
   SECTION.md v3.2: `b677351c-1855-427b-a03c-4503a32abfc2` (deterministic evidence; editorial review pending)
13. **Feature Card — Establish how your market sees you** (Home)
   AI suggestion (97% confidence): Self-contained feature panel combining workflow tabs, a large value proposition, supporting copy, CTAs, and a distinctive research-cycle diagram.
   Capture: 1440×729px; page bounds 3527–4256px of 9883px; source section ID: `d22e6f86-7253-4209-86b6-06140ca3ea4f`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/3db0a563e6caa7b2b04c7b4c7311a480b553b080cdef85aad6d27d659f27ffbf/d22e6f86-7253-4209-86b6-06140ca3ea4f.webp
   SECTION.md v3.2: `d22e6f86-7253-4209-86b6-06140ca3ea4f` (deterministic evidence; editorial review pending)
14. **Testimonials — Get insights in hours customer story** (Explore study recruitment)
   AI suggestion (97% confidence): Complete testimonial component with its own heading, customer portrait, prominent quote, attribution, role, and company branding.
   Capture: 1440×474px; page bounds 4016–4490px of 7591px; source section ID: `56ac0586-1739-448a-b7d1-c48fb416a442`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/3b65c48939c5a699df8cdd9c5ea3de4f702429f9a9fe93f4e74a6fa74c887ee7/56ac0586-1739-448a-b7d1-c48fb416a442.webp
   SECTION.md v3.2: `56ac0586-1739-448a-b7d1-c48fb416a442` (deterministic evidence; editorial review pending)
15. **Editorial — Related research resources** (Explore study recruitment)
   AI suggestion (96% confidence): Complete editorial resource section showing a three-card article grid with imagery, content labels, titles, links, and a concluding “View all” action.
   Capture: 1440×702px; page bounds 4616–5318px of 7591px; source section ID: `20027d26-c122-40e3-99d3-e0c77b2f47cf`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/4a5962d36ce85a7533cce89d83dcf4a7a63787de9021ed674c916170c88e6b7c/20027d26-c122-40e3-99d3-e0c77b2f47cf.webp
   SECTION.md v3.2: `20027d26-c122-40e3-99d3-e0c77b2f47cf` (deterministic evidence; editorial review pending)
16. **Feature Grid — Security built for research at scale** (Home)
   AI suggestion (94% confidence): Complete security section with a clear heading, sales CTA, and a cohesive six-card grid covering encryption, access control, compliance, SSO, and workspace security.
   Capture: 1440×615px; page bounds 5245–5860px of 9883px; source section ID: `d333b269-20da-4726-acf1-e1b6f094b3ee`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/d759f7a15ee6c8a1b073a69d7f1477c9c81e8c68e61de0a0ff30547a2a9be06d/d333b269-20da-4726-acf1-e1b6f094b3ee.webp
   SECTION.md v3.2: `d333b269-20da-4726-acf1-e1b6f094b3ee` (deterministic evidence; editorial review pending)
17. **FAQ — Frequently Asked Questions Accordion** (Explore study recruitment)
   AI suggestion (98% confidence): Complete FAQ component with a prominent heading and five clearly bounded accordion questions in a reusable two-column layout.
   Capture: 1440×516px; page bounds 5437–5953px of 7591px; source section ID: `4bc7d621-741b-48d9-afdd-d25b0c2fcfa4`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/7e643c106d3f4e31d7892eda4f36d4284b43c13d856b725afa78bf044ade7de2/4bc7d621-741b-48d9-afdd-d25b0c2fcfa4.webp
   SECTION.md v3.2: `4bc7d621-741b-48d9-afdd-d25b0c2fcfa4` (deterministic evidence; editorial review pending)
18. **CTA — State of Market Research report** (Home)
   AI suggestion (96% confidence): Self-contained report promotion with category label, headline, supporting copy, action button, and a distinctive publication mockup.
   Capture: 1440×480px; page bounds 6685–7165px of 9883px; source section ID: `71ff4470-4835-49b2-b65a-7feee8065b14`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/923ec619a53067052ef05e378f53db843cdd7c02fa6b9348235166a0e4caa579/71ff4470-4835-49b2-b65a-7feee8065b14.webp
   SECTION.md v3.2: `71ff4470-4835-49b2-b65a-7feee8065b14` (deterministic evidence; editorial review pending)
19. **Footer — Mega Footer with Newsletter Signup** (Explore study recruitment)
   AI suggestion (99% confidence): Complete, substantial footer featuring organized link columns, newsletter form, social links, oversized brand mark, and legal navigation.
   Capture: 1440×904px; page bounds 6687–7591px of 7591px; source section ID: `73f41c5d-1a77-484b-bc18-7484fb993327`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/5d5805e52be662bb91a2562d607c7fcfa308e726f79c5082f312ea1ab25f5e47/73f41c5d-1a77-484b-bc18-7484fb993327.webp
   SECTION.md v3.2: `73f41c5d-1a77-484b-bc18-7484fb993327` (deterministic evidence; editorial review pending)
20. **CTA — Make learning your advantage CTA** (Home)
   AI suggestion (98% confidence): Complete, spacious conversion section with a prominent headline and two clear actions for starting free or requesting a demo.
   Capture: 1440×791px; page bounds 8196–8987px of 9883px; source section ID: `1d2337b2-e1e7-474f-abc1-a50ce4be7310`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/90416662d38feff7c17cae70c257f2a34858e4ff0f2eb3352925aa2c95a52fb6/1d2337b2-e1e7-474f-abc1-a50ce4be7310.webp
   SECTION.md v3.2: `1d2337b2-e1e7-474f-abc1-a50ce4be7310` (deterministic evidence; editorial review pending)
21. **Footer — Maze link directory and newsletter footer** (Home)
   AI suggestion (99% confidence): Complete substantial footer with organized navigation columns, customer links, newsletter signup, social links, oversized brand mark, and legal links.
   Capture: 1440×894px; page bounds 8989–9883px of 9883px; source section ID: `c9e98b53-cf15-4a89-bfa8-d5a9e2154911`; image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/6de287678bd068c6e7ac4c838274bf5eac5f6cb33737d4b4887da104b28d0860/c9e98b53-cf15-4a89-bfa8-d5a9e2154911.webp
   SECTION.md v3.2: `c9e98b53-cf15-4a89-bfa8-d5a9e2154911` (deterministic evidence; editorial review pending)

## Capture and motion evidence

- Desktop screenshot: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/5f8153b9a6a954bdccf0086aa2d344e64dd71a8ee9186971e584b02c1766f4d2/desktop_full-6ee42775-2026-10-08T01-46-05-703Z.webp
- Mobile screenshot: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/ed24782c298073709b97179b4d8f8a66a5e981a1a1f7705bcb11560116a90dae/mobile_full-6ee42775-2026-10-08T01-47-24-378Z.webp
- Open Graph image: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/5bbf548acd0c78ebf45b694b29a7b708e643c26b1b08dcaf91e8c410c7072bc8/og_image-6ee42775-2026-10-08T01-46-18-420Z.webp
- Full-page video: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/4643f219c1402ddde6afcd70ca6e8d84208bc5516e7cf4571f9194142d03f16b/motion-1791425397573.mp4
- Video poster: https://pub-4ea77d2e205a435d8873fdff4115da85.r2.dev/library/1ac0426a81023ce4b9c78cdcf294edbac4872ac0cc3353241ea5c9d747cf3459/motion-poster-1791425397573.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

- Announcement Bar
- Navigation Bar
- Hero
- Floating Product Card
- Feature Card
- Testimonial Card
- Carousel
- Primary Button
- Outline Button
- Badge
- Newsletter Form
- Footer
- Interactive Feature Graphic
- Scrolling Tag Marquee

## Quality rubric

Overall: 56.35/100 (Competent)
Evidence coverage: 100%
Judge tier: Competent
Verdict: A cleanly built, highly legible B2B SaaS homepage with a disciplined single-typeface system, a restrained neutral-plus-accent palette, and a consistent card-based layout system repeated coherently across a long page. The one piece of genuine invention — green squares converging into and dispersing from a circle on scroll — gives the brand a memorable beat, but it sits inside an otherwise highly conventional SaaS template (floating-card hero, security badge grid, testimonial carousel, mega-footer) that could be re-skinned for many competitors with minimal change. Execution within that familiar idiom is solid and purposeful rather than distinctive, placing the overall result at competent.

- Typography (15%): 63 — A single typeface (Phonic) is deployed across an unusually wide weight/size range (130px display down to 12px uppercase labels) with consistent negative tracking that scales with size (-11.7px at 130px, -0.3px at 17px), producing a legible, considered hierarchy. The light (300) weight used even at huge display sizes gives a calm, airy tone that matches the neutral palette. However, the hierarchy itself (giant hero line, section headline, body paragraph, uppercase eyebrow label) is a standard SaaS pattern rather than a distinctive typographic idea, and there is no secondary/contrast typeface or expressive treatment beyond scale and tracking.
- Color (10%): 58 — The palette is restrained and legible: near-black text (#1C1C1C) on white/off-white (#F5F4F0) backgrounds, with a single lime accent (#DBF570/#92B116) reserved for the brand motif, badges, and CTAs, plus occasional pastel section backgrounds (mint #ADEEDA, purple). This is a coherent, purposeful neutral+accent strategy common to the current B2B SaaS genre, executed cleanly but without a distinctive chromatic idea of its own.
- Layout (20%): 64 — The page shows a consistent compositional system: generous vertical rhythm between sections, a repeated card motif (floating product cards in hero, feature cards, security cards, testimonial cards), alternating background treatments to segment content, and a comprehensive footer. The structure is legible and repeats recognizably across the ~9800px length, which is more than a single strong hero. Yet the individual section types (hero with floating UI cards, tabbed feature showcase, logo bar, security grid, testimonial carousel, CTA+footer) are all familiar SaaS layout conventions assembled competently rather than reinvented.
- Motion (20%): 58 — Observed scroll-triggered motion includes a branded particle effect (scattered green squares converging into a filled circle, reversing on scroll-up) and a horizontally auto-scrolling tag marquee, plus a testimonial carousel with dot indicators. The converging-circle effect is the one piece of motion with some conceptual tie to the brand (assembling disparate data into one answer) and is observed reversing correctly on scroll-up, which indicates a built, not just CSS-fade, interaction. No evidence establishes smoothness, frame rate, or easing quality, and the rest of the motion vocabulary (marquee, carousel) is standard scroll-triggered fare.
- Originality (25%): 42 — Beyond the green-square convergence motif, the page follows an extremely common current B2B SaaS template: dark announcement bar, mega-nav with dropdowns, hero with floating UI mockup cards, logo bar, tabbed feature showcase, security badge grid, testimonial carousel, colored CTA band, and a large wordmark footer with newsletter signup. Nearly every component (pill buttons, uppercase eyebrow labels, rounded feature cards, 'New' badges) matches conventions seen across dozens of funded SaaS sites. The circle/square motif is the single hard-to-substitute idea; everything else could be swapped onto another company's site with minimal change.
- Content (10%): 62 — Visuals are reasonably tied to the product's subject matter: the custom 'Baseline / Monitor / Surface / Research / Decide' wheel diagram illustrates the research lifecycle, feature tags (Card sorting, Tree testing, MCP server) are domain-specific, and the security grid addresses concrete enterprise concerns (SSO, GDPR, data center security) rather than generic trust blurbs. The report CTA and customer-outcome stats (75% cost reduction, 2x capacity) are integrated with real-looking metrics tied to named customers (HqO, Homebase, Hopper), giving the content section specific grounding rather than filler.

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
- [x] Functional palette
- [x] Normalized sections
- [x] Reusable components
- [x] Typography roles

## Curator notes

A massive oversized headline sits beside a grid of small product screenshots and real user photos, giving a quick preview of surveys, interviews and dashboards without overwhelming text. Bright lime green circles and bands break the long page into clear chapters, while a dark panel midway adds contrast and signals a shift to security and trust content.

## 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.