Cover photo

The 5-Day Build: Day 4 - Creating a Brand Image and Marketing Site

Day four of the Five-Day Build to use AI to quickly generate a faux sitcom about my very real life... today I generate a brand image and frontend website for my show

Bethany Crystal

Bethany Crystal

The Five Day Build: This is the fourth post in a week-long series about how to use AI in a progressive, multi-dimensional way to build more creative projects and outcomes. This week, I'm using AI to progressively build out a pilot concept for a sitcom based on a faux-real version of my life. You can read day one, day two, and day three posts here.

Welcome to Day 4 of the Five Day Build.

I woke up this morning excited to start to link together many of the disparate pieces of work that I've done on my sitcom into one aggregated place.

Building upon my work of having a fully formed script, characters, and the beginnings of a front-end interface, I decide to use today to add a bit more brand assets to my faux-sitcom, Bad Ideas Only.

I decided to come up with a cover poster image for my show, a theme song, and a website to house all of the assets I made thus far.

I time-boxed myself to an AI Power Hour of 60 minutes. Here's what happened.


The Process

Time Spent: 60 minutes

Artifacts Created:

  • Cover poster art for my show

  • A theme song based on the show's theme

  • A 12-week episode story arc for season one

  • Fully functioning front-end website to display the script, the character cards, the cover art, the song, and the 12-episode summary

Tools Used

  • Claude (to write the 12-episode story arc and the song lyrics)

  • ChatGPT (for the cover poster art)

  • Suno (for the theme song)

  • Replit (to build the front-end interface)

I started off bright and early this morning with full intent to thread multiple AI context windows at once. I immediately pulled up two instances of my Claude project (one to generate song lyrics, and a second to generate a 12-episode story arc), and one instance of ChatGPT (to generate cover art).

While the AI iterated on those versions, I primed Replit with a new prompt on my same script-reader view that I built yesterday and asked it to refactor the site that featured a marketing-first splash with links to the artifacts I was generating in real time.

I progressively toggled between different tabs as I spent the first 20 minutes iterating on all three. Whenever I completed one artifact, I pulled it into Replit and started to add them to a better frontend interface.


The Result: One Front-End Marketing Website for My New Show, "Bad Ideas Only"

The big reveal for today was coming up with a fully functioning splash page for my faux-sitcom show, featuring all of the fun little bits that I created along the way for the past few days.

Here's how it turned out.

post image

The site features clickable links that call out to the different creative components that I built, including the full script-reader for the full-length pilot episode yesterday.

post image

Once Claude generated a full episode guide for season 1, I pulled that into Replit and asked it to incorporate in a more visually interesting way.

post image
You can see the episode guide at: https://bad-ideas-only-script-reader.replit.app/episodes
post image
I also pulled in screenshots of the character cards to transform the Claude artifact into a cleaner front-end to match: https://bad-ideas-only-script-reader.replit.app/characters

The Readout

Today was a great reminder that putting in the time to make a bunch of micro-modules, then linking them all up together for a bigger completed project in an excellent way to strategically use AI tools.

Creating a sitcom pilot is not a one-shot prompt kind of job (at least not now), but the progressive build of a little bit every day and in creating a more visually appearing way of displaying that information is an instant upgrade.

What the AI Did Well:

  • Multi-Threaded Conversations - Thanks to the work I pulled into creating a Claude project earlier this week, I was able to move quickly with limited new context today when I was ready to generate a full on 12-episode season lineup and the lyrics for the theme song.

  • On-Theme Music and Images - To generate the faux Netflix poster I just fed ChatGPT the full script, a short description, and had it generate 10 ideas for poster concepts. From there, we iterated on one repeatedly until I got it to a place where I liked it. Similarly, I went through about 10 iterations of Suno songs until I got to one that felt good enough to keep going.

  • Pulling in an instant front-end - I was impressed by Replit's ability to immediate refactor the site (which yesterday, was just a script-reader) into a fully functioning marketing front-end with many other pages of content and branded elements. It read my mind.

What the AI Could Have Done Better

  • Suggested Easter Egg Elements - Today felt pretty linearly delivered to me, but I didn't get a lot of surprising outputs. I would have liked a little more nudging along from the AI about how else I could move forward on this project. Interestingly, because I used AIs across so many platforms, no single AI has all of the context about the project (just my human brain), so the information did get a little splintered out.

  • Auto-Optimization for Mobile - As one friend pointed out, my marketing front-end from Replit looks terrible on mobile. This has been an issue for some time with a lot of no-code tools. I imagine one day it'll be possible for these tools to auto-correct on mobile without the user needing to re-prompt, but we aren't there yet.

This morning, right after I vibe coded the front-end site, I showed it to a group of 80 student interns for a half-day workshop I taught on AI fluency and vibe coding. I wanted to share it as an example of what's possible when you spend a lot of time learning about a lot of tools. But I also wanted to share it as a warning of not to get too caught up in the front-end interfaces.

In total, I've spent about 90% of the time on this project using AI to iterate on the disparate content pieces and only 10% on the front-end itself. Too often I see people jump into vibe coding without fully thinking through the problem, the best inputs to share, or what's currently available. That's part of why I'm sharing this process incrementally. It's a progressive build.

Overall this continues to be a fun way of demonstrating the power of an incremental, micro-build in action. For day 5, tomorrow, I'm going to see what else I can get across the finish line to wrap this up. Let's see how it goes...!

Bethany CrystalFarcaster
Bethany Crystal
Commented 1 week ago

It's day 4 of the 5-day build, where I set out to get as far as I can on a new creative project with AI-supercharged resources in just 5 days This week I decided to launch a faux-sitcom about my very real life called "Bad Ideas Only" Today I built the marketing front-end for the website with Replit, Claude, Suno, and ChatGPT Read more about the progress and how it's going here https://hardmodefirst.xyz/the-5-day-build-day-4-defining-a-brand-image-and-marketing-site

The 5-Day Build: Day 4 - Creating a Brand Image and Marketing Site