Personal Portfolio Website

A neo-brutalist portfolio built with Astro, Tailwind CSS, and AI-assisted development — rebuilt from the ground up using the StoryBrand framework.

Project Overview

Every creative who works with clients knows the process: define the outcome, establish what “done” looks like, and build in room to iterate. The hard part is applying that same discipline to yourself. This site was that project — a full rebrand and rebuild that traded a constrained Squarespace template for a fast, opinionated, fully custom stack that actually feels like me.

The trigger was a convergence of things. The old site was limiting. The brand needed a refresh — more creative, less corporate, more pops of color and personality. And there was a new StoryBrand framework to build around. It was the right moment to start clean.

The Challenge

Squarespace made the old site a constant negotiation. Every design decision that pushed past the template required custom code blocks, workarounds, and compromises. It wasn’t built for the kind of creative flexibility the rebrand needed.

Beyond the technical constraints, the bigger challenge was approaching your own work like a client project. Working for yourself as a creative is genuinely hard — there’s no brief, no deadline, no one holding you accountable. The solution was to treat it exactly like client work: define the desired results upfront, decide what “done” looks like, and accept that iteration is part of the process, not a failure of it.

The other challenge was the tech stack. The experience to design and build the site was there, but Astro’s syntax and conventions were new territory.

The Solution

The build started with the StoryBrand framework — new copy, new positioning, a clearer story. Then the best pieces of the old site (past works, existing content) were carried forward and reformatted to fit the new direction. The design refresh leaned into neo-brutalism: bold, quirky, unapologetically creative.

For the development side, Cursor AI changed the equation entirely. The approach was to design first, define clear goals for each session, then build one focused session at a time. Short, precise prompts. Clear context. A project PRD, defined rules, and skills set up ahead of time to keep the AI from going off the rails and to keep token usage efficient.

What would have taken weeks compressed into a few days of build sessions. The design and research time stayed the same — that work doesn’t shortcut — but the actual build time dropped dramatically. The result is a static site that’s fast, mobile-friendly, and deployable to Netlify in seconds.

Tech Stack

• Astro — Static site generator. Fast by default, flexible by design.
• Tailwind CSS — Utility-first styling with enough guardrails to stay consistent without getting trapped.
• TypeScript — Type safety across the project.
• Cursor AI — AI-assisted development used as a true co-pilot. Handled syntax, scaffolding, and problem-solving while keeping creative and architectural decisions human-led.
• Netlify — Deployment and hosting. Push a change, it’s live. The iterative workflow depended on this.

Results

The site launched with a Works section, Blog, About, Contact, and a Now page — all live. It’s fast, it’s static, and it actually reflects the brand. Most importantly, it’s built in a way that’s easy to iterate on. Nothing is locked. Changes can be made and deployed quickly, which means the site can grow alongside the work without another full rebuild.

Key Learnings

Vibe coding has real leverage — but it has rules. The biggest lesson was discipline around prompting: shorter prompts with clearly defined goals outperform long, sprawling ones every time. Setting up a project PRD, coding rules, and AI “skills” upfront keeps the context window tight and the output on track.

When something breaks or a prompt isn’t working, the instinct is to keep pushing and refining. The better move is to stop — either start a fresh chat for a clean context window, or approach the problem from a completely different angle. Lateral thinking isn’t just a creative tool, it’s a debugging strategy.

The other takeaway: AI-assisted development doesn’t replace the hard parts. The design thinking, the research, the strategic decisions — those still take the time they take. What it changes is the gap between a decision and seeing it built.