Colophon
This website is also a case study.
I designed the positioning, information architecture, content model, visual direction, interaction rules, quality bar, and implementation constraints for this portfolio. AI-assisted development helped me move those decisions into a working product, while the system judgment, validation, and final acceptance remained mine.
Product ownership
The decisions I owned
- Positioning and audience strategy
- Information architecture and content hierarchy
- Typed case-study model and evidence boundaries
- Visual direction and design-system constraints
- Interaction, motion, accessibility, and performance requirements
- Acceptance criteria, QA, deployment, and rollback decisions
Implementation model
AI-assisted, human-directed
Codex and other AI-assisted tools were used as implementation partners. I directed the system, reviewed the output, corrected architectural and design drift, tested the experience, and owned the final result.
AI accelerated production. It did not decide the audience, positioning, information hierarchy, source-of-truth model, evidence boundaries, quality bar, or what was safe and honest to publish.
Inspectable visual system
A restrained palette with real jobs.
Navy establishes authority; pale blue and cream create editorial breathing room; brass is reserved for edges, evidence, and small moments of emphasis. Purple, neon, and rainbow status coding are intentionally absent.
- Oxford blue
--oxford-blue#0D1E3B - Navy
--navy#0F2A44 - Space cadet
--space-cadet#203565 - Cobalt blue
--cobalt-blue#365194 - Deep teal
--deep-teal#4B687C - Sky blue
--sky-blue#ADD8E7 - Pale blue
--pale-blue#D8E6F2 - Floral white
--floral-white#F4F0E8 - Warm cream
--warm-cream#F2EDE5 - Antique brass
--antique-brass#C5A28C - Antique gold
--antique-gold#B08A44 - Charcoal
--charcoal#2A2D31
--gradient-deep-blue--gradient-navy-slate--gradient-sky-cream--gradient-cream-sand--gradient-blue-brass-edgeTechnical architecture
A portable, content-led web product
Built with Next.js 16 · TypeScript · GitHub · Cloudflare Workers. The application uses React 19 on a Vinext / Vite build path and is rendered from semantic components with permanent routes for the work, approach, experience, résumé, colophon, lab, and contact.
Case-study content lives in a typed data model rather than inside six unrelated page implementations. Static route generation and page metadata use that same source, which keeps public status, confidentiality, metrics, and decisions consistent.
Decision log
Why the system looks like this.
The site’s visual confidence comes from hierarchy and evidence, not a dashboard aesthetic, decorative statistics, or an unqualified claim of technical ownership.
Content is modeled, not copied between pagesInspect the rationale behind this choice.
Six case studies share one typed schema for status, confidentiality, systems, metrics, decisions, guardrails, outcomes, and evidence. The index and permanent case routes read from the same source.
Maturity is part of the contentInspect the rationale behind this choice.
Live systems, delivered work, structured demos, sanitized reconstructions, and in-development work are labeled separately so presentation never implies a maturity level the evidence cannot support.
Decisions matter more than tool badgesInspect the rationale behind this choice.
Every case explains what owned truth, why boundaries were chosen, how uncertainty fails safely, and what evidence was sufficient. Technology appears in context rather than as a logo cloud.
The public case layer is deliberately sanitizedInspect the rationale behind this choice.
Borrower information, credentials, internal URLs, account identifiers, private repositories, and proprietary records do not belong in a portfolio. Evidence descriptions are useful only when they can be published responsibly.
External image hotlinks are not a content strategyInspect the rationale behind this choice.
Screenshots and diagrams must enter a controlled asset pipeline, remain legible, include explanatory captions, and pass a redaction check. Missing evidence receives an honest register entry—not a fabricated dashboard.
Hierarchy—not type novelty—creates editorial qualityInspect the rationale behind this choice.
Inter Variable carries headlines, body copy, navigation, labels, metrics, forms, and diagrams. Scale, weight, spacing, and composition create the editorial character; monospace is reserved for genuine code and technical identifiers.
Static-first fits the productInspect the rationale behind this choice.
The portfolio is content-heavy, read-mostly, and SEO-sensitive. Permanent routes are generated from typed content, with client-side behavior reserved for interactions that genuinely need it.
Quality is a product requirementInspect the rationale behind this choice.
Responsive behavior, keyboard access, semantic structure, broken links, performance, and deployment recovery are evaluated before publication—not added as a post-launch polish pass.
Quality evidence
Measured after the full system exists.
No audit score appears here until it has been produced by the final deployed build. Pending is more useful than invented.
- Production build
- Verified · July 29, 2026The Vinext production build completed and the rendered route, typography, evidence, schema, asset, contact, and interaction tests passed.
- Accessibility review
- Reviewed · follow-up scheduledKeyboard behavior, focus management, landmarks, headings, labels, and reduced-motion support were reviewed in-browser. A third-party automated audit remains a pre-launch follow-up.
- Broken-link audit
- Verified · July 29, 2026All permanent routes, internal links, evidence anchors, and the downloadable résumé passed the rendered-site audit.
- Responsive review
- Mobile, tablet, laptop, and wide-screen verifiedRepresentative routes were reviewed from phone through 1,920 px layouts, including the interactive proof, system-boundary, filter, table, and navigation states, without horizontal overflow or broken media.
The result
The portfolio practices what the cases argue.
Define truth. Separate maturity. Make evidence inspectable. Keep customer and client risk out of the public layer. Use automation and AI to accelerate work without giving away judgment.
View the case-study system