Bootwitch Portfolio: UI Evolution
A visual case study of AI-assisted portfolio design and implementation.
How a terminal-style portfolio became a place that feels like mine.
Jennifer Naomi Nguyen · interface work · Live and evolving · September 2026 · built with ChatGPT, Codex, Claude, Claude Code, Gemini, and Grok
What I built
View interface source on GitHub · v0.1.0 release
I wanted a portfolio people could explore: files on the left, a terminal in the middle, and a reader on the right. Projects, background, and field notes could live together in a workspace with a little personality.
The basic structure came first. Then came the illustrated portrait, oversized orange wordmark, angular borders, and wand — and the work of turning that visual direction into something usable on the site.
See it take shape
Watch the 17-second progression · Visit the live portfolio
The walkthrough includes the early interface, the visual reference, two vector attempts, the branded implementation, and a wand adjustment after launch. The short looping video sequences those artifacts; the still images give you room to look at each step.
Building with AI
I built this site with ChatGPT and Codex from OpenAI, Claude and Claude Code from Anthropic, Gemini from Google, and Grok from xAI. Together we turned the visual reference into editable artwork and a functioning interface. The first vector attempt had the pieces, but it lost some of the character. So I asked for another pass that followed the portrait and lettering more closely. Later, a small change to the wand's SVG frame made the whole illustration fit inside its button.
That's the process I wanted to keep visible here: an idea becoming an interface through a series of concrete adjustments.
Technology stack
- Application: React, TypeScript, Vinext, Vite, Tailwind CSS, and Node.js
- Development and source control: npm, Git, GitHub, VS Code, and GitHub Copilot
- Hosting and infrastructure: Cloudflare Workers, Wrangler, D1, Workers KV, and R2
- AI implementation and review: ChatGPT, Codex, Claude, Claude Code, Gemini, and Grok
- Portfolio guide: OpenAI Responses API
Where this fits
The public Bootwitch Interface shows the visitor-facing local demo as a standalone browser build. The Worker-backed assistant is not published as separate source; this live portfolio is where the two come together with the project content.
The three-pane structure and visual progression are shown here, with the original frames preserved in the source repository.
Bootwitch CLI Scaffold is the local developer tool. Bootwitch Lab is the private AI workspace. This project is the portfolio interface that brings the work together.