agent-validation / index.html
Agenten's picture
Upload 2 files
1f8040f verified
Raw
History Blame Contribute Delete
14.3 kB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Agent Validation</title>
<meta name="description" content="Validate AI agents across task completion, tool use, planning, recovery, permissions, and production reliability." />
<style>
:root{
--bg:#f6fbff;--panel:#fff;--text:#102235;--muted:#617286;--line:#dfeaf3;
--a:#1685ff;--b:#17ba9c;--soft:#edf8ff;--good:#eefcf6;--warn:#fff8e9;
--shadow:0 16px 42px rgba(28,77,117,.10)
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#f9fdff,#eef8ff);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}
.container{max-width:1180px;margin:auto;padding:26px 18px 60px}
.hero{padding:34px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,#fff 0%,#effaff 58%,#eef8ff 100%);box-shadow:var(--shadow)}
.eyebrow{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#2878c5}
h1{font-size:clamp(34px,5vw,60px);line-height:1.03;letter-spacing:-.04em;margin:9px 0 14px}
.lead{font-size:18px;line-height:1.65;color:#40546a;max-width:900px}
.badges{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.badge{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13px;font-weight:750;color:#39536b}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:24px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:0 10px 28px rgba(31,79,121,.07)}
.card h2{font-size:22px;margin:0 0 8px}
.card p{color:var(--muted);line-height:1.6}
label{display:block;font-weight:750;margin:17px 0 7px}
select{width:100%;padding:13px 14px;border:1px solid #cddce8;border-radius:13px;background:#fff;color:var(--text);font-size:15px}
button{margin-top:22px;border:0;border-radius:14px;padding:14px 17px;background:linear-gradient(135deg,var(--a),var(--b));color:#fff;font-weight:800;font-size:15px;cursor:pointer;box-shadow:0 8px 18px rgba(30,136,255,.18)}
button:hover{transform:translateY(-1px)}
.result-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:16px}
.score{min-width:94px;text-align:center;padding:10px;border:1px solid #caecdf;background:var(--good);border-radius:16px}
.score strong{font-size:28px;display:block}
.small{font-size:13px;color:var(--muted)}
.section{margin-top:20px}
.section h3{font-size:18px;margin:0 0 10px}
.checks{display:grid;gap:10px}
.check{padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:#fbfdff}
.check b{display:block;margin-bottom:4px}
.check span{color:var(--muted);font-size:14px;line-height:1.5}
.matrix{margin-top:26px;overflow:auto;border:1px solid var(--line);border-radius:18px;background:#fff}
table{width:100%;border-collapse:collapse;min-width:820px}
th,td{padding:13px 15px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#f3f9ff;font-size:13px;color:#486177}
td{font-size:14px;line-height:1.45}
.info{margin-top:24px;padding:20px 22px;border:1px solid #d8ebff;border-radius:18px;background:var(--soft);color:#34526c;line-height:1.65}
.footer{margin-top:34px;color:#6b7b8c;font-size:13px;line-height:1.6}
a{color:#0f71da}
@media(max-width:800px){.grid{grid-template-columns:1fr}.hero{padding:26px}.container{padding:16px 13px 45px}}
</style>
</head>
<body>
<div class="container">
<section class="hero">
<div class="eyebrow">Validation · Agent Assurance</div>
<h1>Agent Validation</h1>
<p class="lead">Validate autonomous and semi-autonomous AI agents across task completion, tool use, planning, permissions, recovery, observability, and production reliability.</p>
<div class="badges">
<span class="badge">Task Success</span><span class="badge">Tool Use</span><span class="badge">Planning</span>
<span class="badge">Recovery</span><span class="badge">Permissions</span><span class="badge">Observability</span>
</div>
</section>
<div class="grid">
<section class="card">
<h2>Build an agent validation plan</h2>
<p>Select the agent profile and operating context. The tool will suggest the most important validation dimensions.</p>
<label for="agentType">Agent type</label>
<select id="agentType">
<option value="assistant">Assistant / knowledge agent</option>
<option value="tool">Tool-using workflow agent</option>
<option value="coding">Coding / computer-use agent</option>
<option value="multi">Multi-agent system</option>
<option value="autonomous">Autonomous action agent</option>
</select>
<label for="impact">Action impact</label>
<select id="impact">
<option value="low">Low — advisory only</option>
<option value="medium" selected>Medium — business workflow actions</option>
<option value="high">High — external or irreversible actions</option>
</select>
<label for="stage">Deployment stage</label>
<select id="stage">
<option value="dev">Development</option>
<option value="pre">Pre-production</option>
<option value="prod">Production</option>
</select>
<button onclick="buildPlan()">Generate agent validation plan</button>
<p class="small">Planning aid only; not a certification or compliance opinion.</p>
</section>
<section class="card">
<div class="result-head">
<div>
<h2>Your agent validation plan</h2>
<p id="summary">Generate a plan to see recommended validation dimensions.</p>
</div>
<div class="score"><span>Coverage</span><strong id="score">—</strong><span class="small">dimensions</span></div>
</div>
<div id="content" class="small">The plan will cover behavior, evidence, and revalidation triggers.</div>
</section>
</div>
<section class="card" style="margin-top:24px">
<h2>Core agent validation matrix</h2>
<p>A useful validation program checks not only the final answer, but also the path the agent takes to get there.</p>
<div class="matrix">
<table>
<thead><tr><th>Dimension</th><th>Question</th><th>Evidence</th><th>Typical failure</th></tr></thead>
<tbody>
<tr><td>Task completion</td><td>Did the agent actually finish the requested task?</td><td>Task-success rate, human review, end-state checks</td><td>Plausible response without completing the task</td></tr>
<tr><td>Tool selection</td><td>Did it choose the right tool?</td><td>Tool-choice accuracy, tool-call traces</td><td>Using a valid but inappropriate tool</td></tr>
<tr><td>Arguments</td><td>Were tool parameters correct?</td><td>Schema checks, argument validation</td><td>Wrong or unsafe parameter values</td></tr>
<tr><td>Trajectory</td><td>Was the execution path reasonable?</td><td>Step count, trace review, action sequence</td><td>Correct result through unsafe or wasteful steps</td></tr>
<tr><td>Recovery</td><td>Can the agent handle failures?</td><td>Injected errors, retry tests, fallback tests</td><td>Repeated failure loops or silent abandonment</td></tr>
<tr><td>Permissions</td><td>Does it remain within authorization?</td><td>Access-control tests, approval-gate tests</td><td>Unauthorized external action</td></tr>
<tr><td>Escalation</td><td>Does it stop when it should?</td><td>Uncertainty cases, approval scenarios</td><td>Continuing despite missing authority or context</td></tr>
<tr><td>Observability</td><td>Can behavior be reconstructed?</td><td>Traces, model/tool versions, event logs</td><td>Unexplained actions with incomplete evidence</td></tr>
<tr><td>Repeatability</td><td>Is behavior acceptably consistent?</td><td>Repeated runs, variance analysis</td><td>Unstable behavior under equivalent inputs</td></tr>
</tbody>
</table>
</div>
</section>
<div class="info">
<strong>Working definition:</strong> Agent validation is the process of establishing evidence that an AI agent completes intended tasks, uses tools appropriately, respects constraints and permissions, handles failures, and remains observable and controllable under realistic operating conditions.
</div>
<div class="footer">
Open technical resource by the <strong>Validation</strong> organization on Hugging Face.<br>
Research & industry collaborations: <a href="mailto:agenten@magenta.de">agenten@magenta.de</a>
</div>
</div>
<script>
const profiles = {
assistant: [
["Task correctness","Validate whether the agent produces the intended outcome, not only fluent text."],
["Grounding","Check whether claims are supported by approved evidence or sources."],
["Uncertainty handling","Test whether the agent recognizes missing information and ambiguity."],
["Escalation","Verify that the agent asks for clarification or human input when needed."]
],
tool: [
["Tool selection","Measure whether the correct tool is selected for each task."],
["Argument validity","Validate required parameters, types, ranges, and schema conformance."],
["Tool-output handling","Check whether tool responses are verified before downstream use."],
["Recovery behavior","Inject failed tool calls, timeouts, and invalid responses."],
["Execution efficiency","Measure unnecessary tool calls, loops, and retries."]
],
coding: [
["Environment safety","Isolate code execution and restrict unsafe system access."],
["Change correctness","Validate whether code changes solve the intended problem without regressions."],
["Tool and file boundaries","Verify which files, repositories, and commands the agent may access."],
["Test discipline","Check whether the agent runs appropriate tests before declaring success."],
["Rollback readiness","Ensure failed or harmful changes can be identified and reversed."]
],
multi: [
["Role clarity","Validate whether agents understand responsibilities and handoff boundaries."],
["Message integrity","Check whether context and structured data survive agent-to-agent transfer."],
["Coordination quality","Measure duplicated work, conflicting actions, and deadlocks."],
["Failure propagation","Test what happens when one agent produces an error or becomes unavailable."],
["Shared-state consistency","Validate memory, task state, and artifact consistency across agents."]
],
autonomous: [
["Objective adherence","Verify that actions remain aligned with the defined task and operating constraints."],
["Permission boundaries","Test authorization, approval gates, and forbidden actions."],
["Safe stop","Confirm the system can pause, stop, or hand control to a human."],
["Long-horizon reliability","Validate behavior across many sequential decisions and changing conditions."],
["Unexpected-event recovery","Test environment changes, missing resources, and external failures."],
["Human override","Verify intervention and control mechanisms under realistic conditions."]
]
};
const impactAdds = {
low: [],
medium: [
["Operational acceptance criteria","Define measurable task-success, error, recovery, and escalation thresholds."]
],
high: [
["Independent review","Add secondary validation or human review for critical requirements."],
["Adversarial testing","Test misuse, manipulation, boundary conditions, and failure cascades."],
["Approval controls","Gate irreversible or high-impact actions behind explicit authorization."]
]
};
const stageAdds = {
dev: [["Reproducibility","Version prompts, models, tools, data, and environment for repeatable tests."]],
pre: [["Release gate","Define pass/fail criteria before production access."],["Failure injection","Test tool outages, invalid responses, latency, and partial system failure."]],
prod: [["Continuous validation","Use traces, incidents, user corrections, and drift signals as validation evidence."],["Revalidation triggers","Define which changes require a new validation cycle."]]
};
function buildPlan(){
const t=document.getElementById("agentType").value;
const i=document.getElementById("impact").value;
const s=document.getElementById("stage").value;
const list=[...profiles[t],...impactAdds[i],...stageAdds[s]];
const names={assistant:"assistant / knowledge agent",tool:"tool-using workflow agent",coding:"coding / computer-use agent",multi:"multi-agent system",autonomous:"autonomous action agent"};
document.getElementById("summary").textContent=`Recommended validation coverage for a ${names[t]}.`;
document.getElementById("score").textContent=list.length;
document.getElementById("content").innerHTML=`
<div class="section"><h3>Recommended dimensions</h3><div class="checks">
${list.map(x=>`<div class="check"><b>${x[0]}</b><span>${x[1]}</span></div>`).join("")}
</div></div>
<div class="section"><h3>Evidence to preserve</h3><div class="checks">
<div class="check"><b>Execution traces</b><span>Prompts, model version, tool calls, arguments, outputs, retries, approvals, timestamps, and final state.</span></div>
<div class="check"><b>Failure evidence</b><span>Record not only successes but also failure classes, severity, recovery behavior, and unresolved limitations.</span></div>
<div class="check"><b>Decision criteria</b><span>Document the thresholds that determine pass, fail, restricted deployment, or human review.</span></div>
</div></div>
<div class="section"><h3>Revalidate when</h3><div class="checks">
<div class="check"><b>Model or prompt changes</b><span>Behavior may shift even when tools and application code remain unchanged.</span></div>
<div class="check"><b>Tool or permission changes</b><span>New tools, schemas, credentials, or access levels alter the agent's action space.</span></div>
<div class="check"><b>Production evidence changes</b><span>New failure patterns, increased human corrections, drift, or incidents should trigger review.</span></div>
</div></div>`;
}
buildPlan();
</script>
</body>
</html>