Skip to content

README.md

Latest commit

 

History

History
79 lines (66 loc) · 3.63 KB

README.md

File metadata and controls

79 lines (66 loc) · 3.63 KB
Raw

The Agentic Interface Framework — website

A three-page static site for the framework Eight primitives for the layer where humans meet agentic software. No build step, no runtime dependencies. Geist (the only typeface, via Google Fonts), monochrome palette, sharp corners, inline Phosphor icons.

Pages

  • Home (index.html) — hero, "the interface is the unsolved half" intro with a CTA into the test, the eight primitives as exclusive accordions (one-liner, description, feature cards with image placeholders), contributors, and a contribute CTA that opens a mail-app form.
  • Test (quicktest.html) — The Agentic Interface Test: Quick test (16 questions) and Deep dive (48 questions) as switchable modes, all questions on one page with a sticky "Generate score" bar; results open in a modal with a level stepper (Chatbot → Fully Agentic), a radar chart of the eight primitives, and a numbered gap list. Runs entirely client-side; deep-dive answers persist in localStorage. Result permalinks (#r=…) are parsed if present and open a read-only scorecard; the site does not generate them itself. Dev sanity asserts run with ?aitdev.
  • Resources (resources.html) — placeholder, intentionally blank for now.

Structure

  • index.html, quicktest.html, resources.html — one file per page.
  • Dark mode — a data-theme="dark" token override in styles.css; a light / system / dark switch in the footer persists the choice in localStorage and an inline head script applies it pre-paint ("system" follows prefers-color-scheme, live).
  • components.js — shared chrome as native custom elements: <site-header active="…">, <site-footer>, and <ph-icon name size> backed by a single Phosphor path registry (also exposed to page scripts as window.AIF.iconSVG).
  • styles.css — design tokens (:root: palette, type scale, layout, z-scale, motion) and shared components (.btn, .numbox, .input, page-header band), plus all Home styles.
  • ait.css — test-page styles, all ait- prefixed.
  • script.js — Home interactions: contribute form (opens the visitor's mail app addressed to parikshit@thesys.dev), animated exclusive accordions, scroll reveals. Home remains fully readable with JavaScript disabled.
  • ait-questions.js — test data (window.AIT_DATA): 8 primitives, 16 + 48 questions with tooltips and fixes, 5 maturity levels.
  • ait.js — test app: rendering, scoring, results modal.
  • shader-bg.js — footer background (all pages): a dependency-free WebGL port of the saved "Untitled" shader (aurora field + cursor ripples + ordered dither). Static frame under prefers-reduced-motion; absent without WebGL; dot color follows the theme tokens.
  • serve.py — dev server (loopback only, no-cache headers).

Dev-only artifacts not needed on a host: serve.py, .claude/, .agents/, skills-lock.json, this README.

Placeholders to replace

  • Feature images: every <figure class="ph">…</figure> in the accordion feature cards — swap for real illustrations (the Composer card shows the intended style).
  • Contributor names: the .contrib-names list on Home.
  • og:url / og:image metadata once the site has a canonical host.

Run locally

python3 serve.py            # http://localhost:4173

serve.py sends Cache-Control: no-cache so edits show up on plain reload. That is for development only — production hosting should serve these files with normal caching.

Deploy

No build step. Upload the three HTML files plus styles.css, ait.css, components.js, script.js, shader-bg.js, ait.js, and ait-questions.js to any static host.