This Dang Site

Challenge

More than a decade ago, I decided that maintaining a professional website wasn’t a priority. I was happily employed, knew I wouldn’t publish new material regularly, and eventually let my domain disappear into the internet ether. So it goes.

When I recently began looking for a new opportunity, the obvious became unavoidable: Yep – I needed an online destination.

Building another portfolio from scratch wasn’t especially appealing. Beyond organizing and writing the case studies, I would need to choose a technical approach, establish hosting, and work through all the small details required to make the site feel complete.

That made it a useful design challenge: Could I use AI to move quickly from an empty folder to a finished site while still maintaining control over the content, experience, and visual direction?

My Role

I served as the product designer, content strategist, creative director, and highly opinionated client.

I defined the site’s structure and visual direction, wrote and edited the content, evaluated each implementation, identified usability and accessibility issues, and directed the work through launch. ChatGPT Codex acted as an implementation partner, helping translate that direction into a working site.

I gave myself one day to see how far I could get with the first version, followed by additional rounds of refinement and content development.

Approach

I began with a deliberately simple prompt describing the essential experience:

• An introduction, capabilities section, and collection of case studies.
• Straightforward navigation between case studies.
• A professional, light, and uncluttered visual style.
• Slab-serif typography with a little personality.
• Responsive behavior and an experience that felt effortless to use.
• A practical path to establishing a domain and hosting the finished site.

The prompt was intentionally incomplete. I wanted to learn what the tool could establish independently and then respond to something tangible rather than attempting to specify every detail upfront.

The first iteration was more complete than I expected. The structure, responsive layout, typography, and general level of “doneness” were already there. Honestly, it was a bit of a banger.

More importantly, it changed the nature of the work. Instead of worrying about syntax or how to construct each component, I could concentrate on evaluating the experience:

• Does the hierarchy make sense?
• Is the content easy to scan?
• Does this still sound like me?
• What feels generic or unnecessary?
• What happens on a phone?
• Can someone use it comfortably with a keyboard?
• Does the implementation hold up when the content changes?

From there, the process became conversational and iterative. I could test a direction, assess the result, refine it, or say, “Nope — let’s go back.”

Key Decisions

Keep the experience focused

I resisted adding portfolio features simply because other sites had them. The final structure remained intentionally compact: an introduction, capabilities, selected work, and a direct way to get in touch.

The case studies follow a consistent framework so hiring managers can understand the challenge, my approach, and the result without learning a new layout on every page.

Let personality live in the details

AI-generated work can become polished but strangely anonymous. I wanted the site to feel professional without sanding away every trace of personality.

The slab-serif typography, warm palette, conversational writing, and occasional “Howdy” or “This Dang Site” help the experience feel like it belongs to an actual person rather than a portfolio-generating machine.

Treat responsive behavior as part of the design

Desktop grids became focused card carousels on smaller screens. The carousel containers adjust to the height of the active card so the content below moves naturally rather than leaving large areas of empty space.

These details required several iterations. Spacing and pagination were often surprisingly difficult to communicate through subjective feedback alone. I learned to begin with design intent, review the result, and then provide increasingly specific constraints when necessary.

Sweat the small usability details

One example came from selecting and copying the Capabilities section. When pasted into a text editor, the content originally lost its structure and became a jumble of flat text.

I wasn’t sure whether the browser’s copy behavior could be customized, but it could. The finished experience preserves headings, summaries, bullets, project references, and spacing in plain text while retaining clickable links in rich-text editors.

It is a small enhancement, but it reflects the kind of detail I enjoy finding and improving.

Make pragmatic technical tradeoffs

To keep the first version inexpensive and easy to host, I chose static HTML pages rather than creating a data-driven publishing system. That reduced the initial technical complexity, but it also means shared layout changes must be applied and verified across multiple pages.

It is not the architecture I would recommend for a larger or continuously published site. For this project’s scope, however, it was a conscious and acceptable tradeoff.

What AI Contributed

Codex accelerated the path from design direction to working software. It established the initial implementation, helped refine responsive behavior, and handled details I might otherwise have postponed, including:

• Sitemap and robots files.
• Redirects and canonical URLs.
• Metadata and social-sharing content.
• Favicons and other launch requirements.
• Contact-form processing.
• Initial keyboard and mobile interactions.
• Customized copy-and-paste formatting.

It surfaced possibilities I hadn't yet considered. That made the relationship feel less like submitting commands to a tool and more like working with a collaborator capable of suggesting the next useful question.

There were limitations. Some visual adjustments took more rounds than expected, and a technically valid solution did not always produce the experience I intended. The work still required careful review, clear feedback, testing, and a willingness to discard directions that were not working.

I also would not treat AI-generated code as a substitute for engineering expertise. On a product team, I would continue to rely on developers to assess architecture, maintainability, performance, security, and production readiness. This project helped me communicate with implementation more directly; it did not convince me that those disciplines are interchangeable.

Result

Within a day, I had moved from having no portfolio to launching a complete, responsive site containing:

• A clear professional introduction and capabilities story.
• Nine case studies spanning enterprise, consumer, and service experiences.
• Responsive desktop and mobile layouts.
• Light and dark themes.
• Accessible navigation and interaction details.
• A working contact experience.
• Search and social-sharing foundations.
• A live domain and maintainable hosting setup.

The most important result was not that AI could generate a website. I already assumed it could.

The useful lesson was that AI made implementation fast enough for me to treat code as a design medium again. I could move between content, interaction, visual design, and working software without waiting for every idea to be translated through a separate production step.

The tool supplied speed and technical reach. My role remained the same: establish intent, recognize what was working, challenge what wasn’t, make tradeoffs, and keep refining until the experience felt right.

That part still requires a designer.