Ui-Medium-Admin-User-Table

The model receives the prompt (and optional system message). The run uses scorer singlefile_html_visual_judged with the JSON configuration below. Pass/fail and partial credit are determined entirely by that scorer against the model output; no human grading.

Create a complete single-file HTML document for a responsive admin user management UI. Return only the HTML document, without Markdown fences or explanations. The UI must include a dashboard-style header, a search field, a role filter, a user table on desktop, and a card-based layout on mobile. Each user must show name, email, role, status, and actions. Include at least five realistic sample users. Use status badges for Active, Invited, and Blocked users. The search and role filter should work using vanilla JavaScript inside the same HTML file. The UI should be polished, accessible, responsive, and suitable for a modern SaaS admin panel.

{
  "min_chars": 4000,
  "requires_style": true,
  "requires_script": true,
  "forbidden_contains": [
    "```",
    "TODO",
    "lorem ipsum",
    "placeholder text"
  ],
  "allowed_cdn_hosts": [
    "cdn.jsdelivr.net",
    "cdnjs.cloudflare.com",
    "unpkg.com"
  ],
  "playwright_enabled": true,
  "judge_enabled": true,
  "render_wait_ms": 700,
  "viewports": [
    {
      "name": "desktop",
      "width": 1440,
      "height": 900
    },
    {
      "name": "mobile",
      "width": 390,
      "height": 844
    }
  ],
  "required_selectors": [
    "input",
    "select",
    "button"
  ],
  "required_text_groups": [
    [
      "Users",
      "User Management",
      "Benutzer"
    ],
    [
      "Search",
      "Suche",
      "Filter"
    ],
    [
      "Admin",
      "Manager",
      "Member"
    ],
    [
      "Active",
      "Aktiv"
    ],
    [
      "Invited",
      "Eingeladen"
    ],
    [
      "Blocked",
      "Gesperrt",
      "Locked"
    ]
  ],
  "ui_requirements": [
    {
      "id": "search_field",
      "type": "selector",
      "selector": "input",
      "points": 10
    },
    {
      "id": "role_filter",
      "type": "selector",
      "selector": "select",
      "points": 10
    },
    {
      "id": "user_identity",
      "type": "text",
      "text": [
        "@",
        "email",
        "example.com"
      ],
      "points": 10
    },
    {
      "id": "status_active",
      "type": "text",
      "text": [
        "Active",
        "Aktiv"
      ],
      "points": 6
    },
    {
      "id": "status_invited",
      "type": "text",
      "text": [
        "Invited",
        "Eingeladen"
      ],
      "points": 6
    },
    {
      "id": "status_blocked",
      "type": "text",
      "text": [
        "Blocked",
        "Gesperrt",
        "Locked"
      ],
      "points": 6
    },
    {
      "id": "actions",
      "type": "text",
      "text": [
        "Edit",
        "Bearbeiten",
        "View",
        "Details",
        "Remove",
        "Delete",
        "Löschen"
      ],
      "points": 7
    }
  ],
  "interaction_checks": [
    {
      "id": "search_filters_users",
      "viewport": "desktop",
      "action": {
        "type": "fill_first_input",
        "value": "admin"
      },
      "expect_visible_text": [
        "Admin",
        "admin"
      ],
      "points": 10
    },
    {
      "id": "role_filter_is_usable",
      "viewport": "desktop",
      "action": {
        "type": "select_first_select_option_by_index",
        "index": 1
      },
      "expect_no_page_error": true,
      "points": 10
    }
  ],
  "score_weights": {
    "static": 0.15,
    "render": 0.2,
    "requirements": 0.25,
    "interaction": 0.1,
    "accessibility": 0.1,
    "animation": 0,
    "judge": 0.2
  },
  "pass_threshold": 0.65
}