Today, I want to share my six-step process to design and build Tastemaker, a website for sharing your favorite movies, TV shows, and games.

You’ll learn how to define the problem, create a design.md, prototype in Claude Design, draft an interactive HTML spec, and build the app with AI.

Watch my 25-minute tutorial to see me cover all six steps live, or keep reading below.

Timestamps:

• (00:00) My six-step AI-native design process

• (00:50) Step 1: Define the user problem before building

• (02:25) Step 2: Get inspired and create a design.md

• (05:00) Step 3: Prototype key screens in Claude Design

• (12:59) Step 4: Create an HTML spec for product, design, and tech

• (17:02) Step 5: Design the core flows, default states, and edge cases

• (20:42) Step 6: Build the app with Claude Code

• (23:07) Recap: Why planning should take at least half your time

I’m proud to partner with Replit

Replit is now available inside Claude Design, so you can design beautiful apps and send them directly to Replit to build. To try it, simply select Share in Claude Design, open the Send to… menu, and choose Replit. Get 3 months of Replit free with code PYANG26 at checkout.

Get Replit for 3 Months Free

1. Define the user problem

I’ve watched thousands of movies and TV shows and played hundreds of video games over the years. But IMDb isn’t a great interface and Letterboxd doesn’t support games.

That’s why I decided to build Tastemaker to share my favorite movies, shows, and games all on one page. To kick off the project, I asked Claude Code to research and define the user problem with this prompt:

Here’s the problem statement Claude came up with:

Note how Claude used my spec skill to find real evidence that other people share the same problem. Of course, if I wanted to turn this into a real business, I would spend more time upfront talking to users to validate the opportunity. But since I’m building this as a personal app, let’s move on to step 2.

Get my /spec skill by upgrading to a paid membership

The last skill that I open-sourced, /no-ai-slop, went viral with 3.1K GitHub stars. I’m just as proud of my /spec skill that I use throughout this tutorial. It creates an HTML spec with the product, design, and tech requirements all in one place. Get it, along with 12+ other hand-crafted skills, by upgrading to a paid membership.

2. Get inspired and create a design.md

A design.md is simply a text file with guidelines for color, typography, spacing, and more. It’s a necessary step to avoid AI generating designs that have that recognizable Claude look.

To create a design.md, I like to start by finding inspiration. Recently, I came across a beautiful app called Monogram and love how it uses color to focus people on the content instead of the UI:

I copied a few of Monogram’s screens into Claude along with this prompt to create the design.md for Tastemaker:

Claude will then create a design.md like this:

For more inspiration, you can also check out Mobbin for app screenshots and designmd.sh for design.md files for popular products.

Quick note: Getting inspiration is different from straight-up copying an app.

I feel comfortable borrowing a little from Monogram’s design because Tastemaker is in a completely different product category.

With the design.md ready, let’s move to Claude Design to prototype the product.

3. Prototype key screens in Claude Design

Claude Design is my favorite AI-native design tool because it feels more like working with a design partner than using a tool.

Tip: You don’t need Fable to prototype with Claude Design. I found Opus perfectly up to the task if you want to save tokens.

Here’s the prompt, along with the design.md, to kick off the Claude Design project:

Read more

Get instant access

Dear subscribers,

I now use ChatGPT Work and GPT-5.6 for almost everything I do on my computer, and I’m going to show you my full setup in this video and written guide.

You’ll learn how to choose the right GPT-5.6 model, connect your apps, manage email and calendar, automate recurring work, build Sites, and more.

Watch my tutorial now for the full 28 min walkthrough, or keep reading below.

Timestamps:

• (00:00) How I use ChatGPT Work for almost everything

• (01:04) Chat vs. Work vs. Codex: What’s the difference?

• (02:22) Which GPT-5.6 model and effort to use

• (03:18) Personalizing ChatGPT Work’s custom instructions

• (06:23) Connect your apps and organize your Work threads

• (09:30) Let ChatGPT manage email and draft replies in your voice

• (13:47) Schedule events and prep for meetings automatically

• (17:19) Automate recurring work with scheduled tasks

• (19:23) Continue your Work tasks from your phone

• (21:01) Publish travel guides, games, and product plans as Sites

I’m proud to partner with Wispr Flow

I use Wispr Flow to dictate first drafts much faster than I can type. It helps me get my ideas down while they’re still fresh, so I can focus on editing. I use it all the time in ChatGPT Work and Codex, and it’s been a huge time saver. Try it for free with my link.

Try WisprFlow for Free

Chat vs. Work vs. Codex: What’s the difference?

Here’s the simplest way to think about the three modes:

1. Chat is the regular ChatGPT we’re all familiar with.

2. Work lets ChatGPT take action in your favorite apps.

3. Codex adds features designed for coding and developers.

Honestly, I’m not a fan of Work and Codex existing as separate modes. As far as I can tell, there are only small differences in the UI and how responses are presented. For example, Codex adds a Pull Request tab that developers can use to review each other’s code.

So I don’t think it makes much difference whether you use Work or Codex. My recommendation is simple:

Use the ChatGPT desktop app which is far more capable than ChatGPT for the web.

Which GPT-5.6 model and effort should you use?

GPT-5.6 comes in three variants (Sol, Terra, and Luna), each with five effort levels from Low to Ultra. So which model and effort should you default to?

Here’s a chart that shows intelligence vs. output tokens for the various options:

Based on this chart and my experience, I recommend that you:

Use GPT-5.6 Sol (medium) for the best balance of intelligence and token use.

I sometimes use Sol (high) for planning, but overall I haven’t noticed much of a difference between that and medium. I almost never use Terra or Luna.

Personalize your ChatGPT Custom Instructions

On a fresh install, I go to Settings → Personalization and set my Custom Instructions to:

1. Teach me technical concepts without using jargon.

2. Challenge my thinking instead of agreeing with every prompt.

3. Remove AI slop phrases and patterns.

Here are my exact custom instructions if you want to copy my setup:

Install plugins to let ChatGPT use your favorite apps

Plugins connect ChatGPT Work and Codex to the apps you use every day.

The screenshot above shows some of the plugins I have installed. I think the bare minimum set is:

• Gmail

• Google Calendar

• Documents, Presentations, Spreadsheets, and Google Drive

Other useful plugins include the PDF plugin for editing PDFs, Slack for messages, Notion for wiki articles, Figma for design, and Granola for meeting transcripts.

Install plugins for any app that you want ChatGPT to use. This is the key setup step that makes ChatGPT Work and Codex your everything app.

Use long-running threads for each type of work

As you use ChatGPT Work more, you may get overwhelmed by all your active projects and threads. To avoid this:

Keep one long-running thread for each type of work.

For example, in my Personal OS project, my threads include:

1. Newsletter to edit all newsletter posts.

2. Social for drafting and making posts for social networks.

3. Podcast to prep and do post-production for interviews.

ChatGPT Work and Codex are very good at compacting long conversations, so you can keep chatting in the same thread without worrying about GPT getting confused.

I also pin my most-used threads, such as my Advisor thread for strategy and business advice and my Chief of Staff thread for email, calendar, and more.

Set up a chief of staff thread for email and calendar

These days, I manage my email and calendar almost entirely through ChatGPT Work and Codex instead of opening Gmail or Google Calendar. Let me walk through how I:

1. Find forgotten follow-ups and subscriptions to cancel

2. Draft email replies that sound like you

3. Manage your calendar and avoid meeting conflicts

4. Get briefed on upcoming meetings

1. Find forgotten follow-ups and subscriptions to cancel

Read more

OpenAI just made GPT 5.6 available to everyone and I’m here to answer your most burning question:

Is GPT 5.6 better than Claude Fable 5?

The answer is, it depends. 😅

Watch my tutorial to see me test both models head-to-head for building a travel website, 3D Star Fox game, mobile app, and more.

Timestamps:

1. (00:00) GPT-5.6 vs Claude Fable 5 compared

2. (01:45) Build an interactive travel website

3. (05:44) Create a 3D Star Fox-style game

4. (09:39) Edit and publish short videos with browser use

5. (15:10) Plan and build a mobile app feature

6. (19:34) Get personalized life and business advice

7. (22:17) Improve and clean up a personal AI OS

8. (24:37) My takeaway on each model’s strengths and weaknesses

I’m proud to partner with Riverside

Right now, most creators spend 20% of their time creating, and 80% on editing and distribution. Riverside just launched 2.0 to make it easy for me and other creators to turn a single recording into a fully produced content engine across all my channels.

After recording, Riverside uses a team of agents to create clips, schedule social posts, and more. Riverside is trusted by teams like Spotify, Microsoft, and Vercel, and you can try it for one month free at creators.riverside.com/PeterYang with code PeterYang.

Try Riverside for 1 Month Free

GPT 5.6 vs. Fable benchmark and cost comparison

GPT 5.6 comes in three models: Sol, Terra, and Luna.

Sol is the flagship model and based on TerminalBench it actually performs slightly better than Claude Fable 5 at coding:

But I think OpenAI’s biggest advantage is model efficiency and cost. GPT 5.6 Sol is 50% cheaper than Claude Fable 5 at API prices:

That’s a big deal because enterprises are increasingly looking for the most cost-effective model. However, benchmarks only tell half the story, let me show you how both models perform on the 6 use cases below:

1. Build an interactive travel website

GPT has historically lagged behind Claude on front-end design so I wanted to see if GPT 5.6 has closed that gap. I’m planning a trip to Japan in December so I gave both models my Google Doc itinerary and the prompt below:

Tip: Ask AI to “add a 3D WebGL element to the hero banner” if you want to create websites with beautiful animated 3D graphics

I ran the same prompt through GPT 5.5, GPT 5.6, and Fable:

1. GPT 5.5 created a functional website but botched the 3D hero image.

2. GPT 5.6 created an animated torii gate and found more relevant photos.

3. Fable 5 created beautiful animated snowflakes in a winter scene.

Watch my video to see how all 3 websites look.

Verdict: Tied because GPT 5.6 has really closed the gap with Fable on frontend design.

P.S. We’ve started hosting regular live workshops in my Slack community for AI builders. Upcoming workshops include:

1. July 17 - AI native design (design.md, components, etc) with Julie Xu

2. July 24 - Building production apps with Colin Matthews

3. August - Deep dive on AI evals with Hamel Husain

All workshop recordings will be shared here for paid subscribers.

Subscribe for Full Access

2. Create a 3D Star Fox style game

Growing up, Star Fox was one of my favorite games on the Super Nintendo. So naturally, I had to ask both GPT 5.6 and Claude Fable 5 to build a fully playable Star Fox level complete with enemies, power-ups, and even a boss battle.

Both produced incredibly impressive results:

Here’s the exact prompt that I used to build these games in one shot:

Read more

Today I’m excited to launch my beginner-friendly Hermes course with 17 opinionated lessons to set up my favorite AI chief of staff in a single afternoon.

This course covers everything from installation to integrations (e.g., email, calendar, Google Workspace) to cron jobs (e.g., morning briefing, health check).

Watch my free 45-minute walkthrough on YouTube. If you want the written version with all 17 lessons and copy-paste skills, consider upgrading to paid at behindthecraft.com.

What the course covers:

• (00:00) Why Hermes is the best 24/7 AI chief of staff

• (01:16) Where and how to install Hermes safely

• (02:55) The best AI model to pick for Hermes

• (05:04) Connect to Telegram for mobile chats

• (11:08) How Hermes uses tools, memory, and skills

• (12:39) How to personalize Hermes by editing its user and soul files

• (15:49) Two best ways to troubleshoot Hermes

• (18:15) Set up Hermes to respond via voice

• (22:47) Connect Gmail, Calendar, Docs, Drive, and Sheets step by step

• (38:25) Create routines like morning briefing, health check, and more

Why Hermes and what’s inside the course?

Hermes is, in my opinion, the best AI chief of staff available today. It’s reliable, free to use (you just need a $20 ChatGPT subscription), and very powerful.

That’s why I spent 20+ hours writing 17 opinionated lessons covering three tracks:

1. Quickstart: Get Hermes running in less than 30 minutes.

2. Integrations: Let Hermes work in your favorite apps (e.g., email, calendar, docs).

3. Cron jobs: Set up morning briefings, health checks, business reports, and more.

Upgrade to Get My Full Hermes Course

Here’s what each track covers.

Quickstart: Get Hermes running in less than 30 minutes

Learn how to install Hermes safely, connect it to your phone via Telegram, and personalize it to be yours by editing its user and soul files.

This track covers:

1. Where to install: Set up Hermes on your laptop, Mac Mini, or virtual server.

2. Install Hermes: Download the desktop app and pick your AI model.

3. Connect Telegram: Create your bot and chat with Hermes from your phone.

4. How Hermes works: A beginner-friendly guide to memory, tools, and more.

5. Personalize Hermes: Edit its user and soul files to make it genuinely useful.

6. Troubleshooting: My two favorite ways to fix Hermes if you get stuck.

Integrations: Connect the apps you already use

Integrations are what make Hermes more useful than a chatbot. Start with voice replies and Google Workspace, which I think are must-haves. Then consider linking Granola for meetings, GitHub for backups, YouTube for research, and more.

This track covers:

7. Voice replies: Talk to Hermes while on the go.

8. Google Workspace: Connect Gmail, Calendar, Docs, Sheets, and Drive.

9. WhatsApp: Use Hermes from WhatsApp with a second phone number.

10. Slack: Add Hermes to Slack for threaded discussions.

11. Granola: Let Hermes analyze your meeting notes.

12. GitHub: Back up Hermes and let it work with your repos.

13. YouTube: Let Hermes summarize videos and research for you.

Cron jobs: make Hermes proactive

Last but not least, cron jobs (or scheduled routines) let Hermes do work for you proactively. I cover how to set up my favorite cron jobs including:

14. Weekend planner: Find fun, time-sensitive family activities for the weekend.

15. Morning briefing: A daily check of your email, calendar, and more.

16. Business review: A weekly insights email with your financials and more.

17. Health check: A weekly review with your weight, workouts, and more.

My goal is to create the most practical AI membership online

With today’s update, paid subscribers can now access all of the following on the Behind the Craft membership portal:

1. 12+ skills and 20+ prompts handcrafted for personal, product, and creator work.

2. 17 lessons on setting up your AI chief of staff with Hermes.

3. Full Codex and Claude Code courses coming later this year.

We’ve also started hosting monthly expert-led live AI workshops in our AI Slack community, starting with my walkthrough of my Codex setup last Friday.

Again, I’ve made the full 45-minute walkthrough free on YouTube to make it easy for you to set up Hermes. If you’d like the written course, my AI skills, live workshops, and upcoming Codex and Claude Code courses, consider upgrading to paid.

Thanks!
Peter

Today, I want to show you how to build an AI advisor that helps you think through important life and career decisions.

This is my favorite AI skill because it knows my goals, gives me useful feedback, and gets better the more I talk to it.

Watch my tutorial now to see how my /advisor skill works and how you can build your own in 13 minutes.

Timestamps:

• (00:00) Why I built a personal AI advisor

• (02:09) skill.md: How to define the advisor’s behavior

• (03:31) plan.md: The context file with goals, principles, energy, and life details

• (07:54) learnings.md: How the advisor remembers patterns over time

• (09:22) eval.md: What AI checks before giving me advice

• (10:15) Demo: Using Anthropic's Fable for deeper advice

• (11:31) How to build your own advisor skill now

I’m proud to partner with Wispr Flow

There are many AI voice dictation tools out there, but Wispr Flow has been the most accurate one I’ve used. My kids also love using it to dictate prompts to Codex and Claude Code so they can build games and apps. Try it out with my free link below.

Try Wispr Flow for Free

How my AI advisor helps me make decisions

I recently made a video sharing why I decided to leave my job to bet on myself.

What I didn’t share is that I talked to my AI advisor for over 3 months leading up to that decision. It gave me advice like:

“Your decision is psychological and about letting go of the person you spent a decade becoming.”

“Your kids are eight and four and will grow up fast. Your goal isn’t to maximize income, it’s to make enough so you can spend more time with them.”

My /advisor skill has been so useful because it has context about my goals, family, work, financials, and energy to help me think more clearly.

The whole setup is basically a folder with a few text files:

Let’s walk through each file and how you can build your own version.

1. Skill: How you want the AI to give you advice

Your skill.md should not contain a bunch of personal information about yourself.

Instead, it should tell AI what role to play, what context to read, how to advise you, and what to remember over time. Here’s the full skill.md for my AI advisor:

This file defines the advisor’s behavior. The next file gives it your personal context.

2. Plan: Important context about your work and life

Paid subscribers can keep reading for the full /advisor setup, including my plan.md structure, learnings.md examples, eval.md checklist, and more.

Read more

Today, I want to show you how to build Claude Skills that catch their own mistakes and get better the more you use them.

I’ve become completely AI-skill pilled. I love encoding my knowledge and taste into skills and then reusing them to save time every week.

Watch my video now to see me build a skill from scratch in 5 steps complete with an eval loop and memory.

Timestamps:

• (00:00) What an AI skill is and the 5 steps

• (01:56) Step 1: Give AI your personal context and examples

• (05:00) Step 2: Edit the description to trigger the skill reliably

• (05:59) Step 3: Build an eval loop to have AI fix its own mistakes

• (11:54) Step 4: Add memory so the skill improves itself over time

• (13:40) Step 5: Build a skill editor to improve all your skills

• (17:44) Where human taste still plays a role

I’m proud to partner with Linear

As teams ship faster with AI agents, the bottleneck shifts from building to deciding what to build.

Linear’s new Agent understands your full workspace context: roadmap, issues, customer requests, and code. Ask it to surface patterns across feedback, scope out a spec, or catch you up on team progress.

Try Linear for Free

A quick recap of AI skills

As I shared before, a skill is just a folder with instructions that AI can trigger for a given task. In this tutorial, I’m going to build an /edit-post skill that can edit any newsletter or long-form piece. Here’s what the skill folder will look like at the end:

edit-post/
├ skill.md
├ example-tutorial.md
├ example-personal.md
├ example-product.md
├ evals.md
├ memory.md

1. skill.md tells AI what the skill does and when to trigger it.

2. The example files include my best posts so the skill can learn my writing style.

3. evals.md will have pass/fail checks the skill uses to grade its own output.

4. memory.md will log lessons from past chats so the skill gets better over time.

Now let’s build these files in 5 steps.

1. Create the skill using your examples and personal context

My newsletter has three types of posts: tutorials like this one, personal essays on career and life, and deep dives on AI trends and concepts. I saved my best posts for each type in separate md (text) files below:

Then I gave Claude Code all three example files and this prompt:

The most important thing here is to give AI as much personal context and examples of good output as you can. You should also keep these context files separate from the main skill.md for two reasons:

1. It keeps the skill.md lean because AI can decide which example posts to load (e.g., tutorial vs. personal post) based on your draft.

2. It lets you share the skill more easily without revealing your personal posts or information.

2. Be explicit about when AI should trigger the skill

When you ask AI a question, it doesn’t load the whole skill by default. Instead, it only reads the name and description to decide whether to load the full skill:

So it’s very important to include explicit “Use when…” instructions so AI knows when to trigger the skill automatically. You can always trigger it by hand too (type /edit-post).

3. Test the skill manually, then build an evals.md loop

Once you have a skill drafted, test it manually a few times.

For example, I ran /edit-post on a real draft, then gave it feedback to improve. After a few manual iterations, tell AI:

An eval is just written instructions that asks the AI to check its own work. I prefer pass/fail over scoring evals (like 4/5) because AI can’t reliably tell a 3/5 from a 4/5. Here’s a snippet of the evals that it generated for me:

Before we run the evals, give AI one more prompt:

This sets up the evals loop where one agent edits the post, a second agent grades it, and because the grader has a clean context window, it isn’t biased by the first agent’s work. If anything fails, the two will keep working until everything passes:

When I ran the loop on a newsletter draft, it took five rounds between the two agents to pass all the evals. AI stripped every em dash and “X, not Y” phrase along the way.

I think setting up this evals loop makes a big difference in leveling up your skills. You can just kick it off, go get coffee, and come back to a cleaner draft. You should still review and edit the final output manually of course.

4. Give the skill a memory.md so it improves over time

Evals improve the skill’s output and memory improves the skill itself.

To set it up, ask AI:

A memory.md is just a text file with a reverse-chronological log of what the skill learned from your past chats. Here’s an example:

Setting this up is optional, but I’ve found it useful for feedback that doesn’t fit a clean pass/fail check, like “make the voice more authentic.” Make sure skill.md references both evals.md and memory.md.

5. Build a skill that builds skills

I’ve been skillmaxxing for days, and I do worry that relying on AI to write skills could lead to a mess of slop that drags down the model’s response quality.

That’s why I built /skill-editor and /no-ai-slop skills to make all my skills concise and strip AI slop like em dashes, “X, not Y” phrasing, and duplicate instructions. Here’s a snapshot of my /no-ai-slop skill:

When I ran these skills on the /edit-post skill we just built, it caught a few em dashes, removed some redundant formatting, and made the skill more concise.

Quick plug: I’ve made this full post free, but if you want to copy my /skill-editor and /no-ai-slop skills, along with a dozen other handcrafted skills, consider becoming a paid subscriber to unlock all my skills and prompts at behindthecraft.com.

Follow these 5 steps to build skills that improve themselves

Here’s how you put this guide into practice. First, reflect on your past week and brainstorm with AI workflows that you can streamline with skills. Then create each skill by following these 5 steps:

1. Give AI your personal context and best-in-class examples to draft the skill.

2. Trigger the skill reliably by including “use when XYZ” in the description.

3. Build an evals.md with pass/fail checks so AI can loop to improve its own output.

4. Add a memory.md with lessons from your chats so the skill improves over time.

5. Build (or copy) a /skill-editor skill to keep all your skills clean and concise.

Watch the video now and subscribe to my channel if you enjoyed this tutorial. Let me know if you have any questions in the comments!

Today, I want to show you how to build beautiful slide decks with Claude Code.

Instead of making PowerPoint and Google Slides manually, I built a /slides skill that turns a rough outline into a fully animated HTML deck in minutes.

Just install the skill and type “/slides (your rough outline)” to generate a beautiful slide deck. Watch my tutorial now for the complete walkthrough.

Timestamps:

• (0:00) Why building slides with AI is better than PowerPoint

• (1:30) My /slides skill: 12 formats and 3 templates

• (4:20) The 6 steps that make the skill actually work

• (5:16) Watch me generate a full deck in 3 minutes

• (8:13) What's actually inside my /slides skill file

• (11:57) The one lesson that matters when building with AI

I’m proud to partner with Oceans Talent

I hired Char through Oceans a few months back to help with podcast production. What I didn’t expect was how quickly he’d take it further. He’s now creating clips and picking up Claude Code and Codex on his own to deliver more every week.

Oceans Talent places operators, not assistants. Their talent is AI-fluent and delivers what a senior US hire would at 3-5x less cost. If you need help with marketing, ops, finance, or an EA, book a call at oceanstalent.com/peter.

Get Started for Free

Why you should build slides in HTML

Getting AI to generate slides in HTML has many advantages, including being able to:

1. Go from 0 to draft deck in minutes with a rough outline.

2. Create live, interactive charts with Chart.js.

3. Drop in images and have AI automatically resize them.

4. Add subtle motion to capture attention.

5. Run a visual QA loop where the AI polishes the slide for you.

6. Ship with zero dependencies since all slides render in a single HTML file.

12 beautiful slide formats and 3 templates

My /slides skill comes with 12 ready-to-go formats (cover, agenda, two-column, stat grid, feature bento, comparison, timeline, chart, and more) and three visual templates:

1. Default: Editorial and warm with a sharp red accent.

2. Dark: Bold and contemporary with a black background and yellow accents.

3. Light: Apple-style clean and minimal.

Here’s an example chart slide generated using the dark template:

How to start using the /slides skill now

You have two options:

1. Copy and start using the skill right away by visiting behindthecraft.com to unlock it and 10 other handcrafted skills.

Upgrade to Get Instant Access

2. Keep reading to understand how I built the skill in 6 steps.

How I built the skill in 6 steps

Here's how the skill works under the hood in 6 steps:

1. Read skill.md and styles.md to understand the guidelines and slide formats.

2. Clarify the topic by asking the user questions about what the contents should be.

3. Research online to supplement what the user provided.

4. Generate the deck as a single HTML file.

5. Run a visual QA loop to take screenshots of each slide and fix layout issues.

6. Deliver the final deck that you can present in your browser.

To build this skill yourself, follow my tutorial and iterate with AI on the steps above.

With AI, you have to build the system first

If you remember just one thing from this tutorial, make it this:

With AI, build the system once instead of doing the work every time.

Creating my /slides skill took me longer than making a deck from scratch. But now that it’s up and running, I can use it to save time on every deck I make from here on out. The same idea applies to any workflow or routine you do more than once.

Watch my tutorial now and let me know if you have any questions in the comments or get a Behind the Craft membership to unlock the skill now.

OpenAI vs. Anthropic gets all the attention these days, but Google Labs is quietly shipping some of the most interesting AI products right now.

Pomelli for marketing, Stitch for design, Flow for videos, and more — these tools are better than most people realize.

Watch the tutorial now to see me review all five tools live and share where each product excels and where they fall short.

Timestamps:

• (0:00) Why Google’s most underrated AI products are in Labs

• (0:39) Pomelli: Generate marketing assets from any URL

• (4:37) Stitch: Create web and mobile designs from scratch

• (7:27) Genie: Walk through AI-generated 3D worlds

• (9:11) Flow: The best tool for making AI videos and images

• (11:49) NotebookLM: Turn any source into video, slides, and infographics

• (14:27) 3 takeaways on Google’s AI strategy

I’m proud to partner with Granola

The world’s best product teams including Ramp, Linear, Replit, and more all use Granola to take notes and focus more in meetings. I’ve tried many meeting notes apps myself but keep coming back to Granola. It’s just that good.

Try Granola for Free

A review of 5 Google Labs tools and their pros/cons

1. Pomelli: Generate marketing assets from a link

Pomelli generates beautiful marketing assets and your brand DNA (colors, fonts, images, logo), all from a link to your website.

For example, I gave Pomelli a link to my favorite local Asian bakery, Simply Cake. It pulled the brand’s logo, fonts, colors, and images in under 20 seconds:

Once Pomelli has your brand’s DNA, it’ll generate 3 marketing campaigns for you to review. Here’s a Mother’s Day campaign it made for Simply Cake:

Pomelli’s Photoshoot feature is also worth trying. Upload a basic photo of an egg tart and it creates marketing-ready assets with Nano Banana:

Next, I tried Pomelli on my newsletter to see how it handles a content business. Unfortunately, it didn’t work as well. Content brands like mine don't have great product photography to extract from, so Pomelli has less to work with:

My verdict: Pomelli is incredible if you run a physical or e-commerce store with a strong visual library. My one gripe is that you can’t edit the text and images manually — you have to re-prompt the AI every time.

2. Stitch: Create beautiful product designs

Stitch is Google's answer to Claude Design. I gave it a simple prompt to "design a mobile fitness app." Stitch first generated a design system, then produced the screens:

One great thing about Stitch is that it’ll use Nano Banana to fill in images, which makes the screens look more realistic. There’s also a fun feature that shows a predictive heat map of where users might click.

But Stitch has one flaw compared to Claude Design — it didn’t ask me a single clarifying question before making the app. Compare that to how Claude Design handles the same prompt:

Read more

Today, I want to share a review of Claude Design, Anthropic’s new AI design tool.

In the tutorial below, I ran through 5 real demos live using Claude Design to create videos, slides, websites, apps, and even a design system.

Watch my tutoral now for the complete walkthrough.

Timestamps:

• (0:00) Why Anthropic is coming for the full knowledge work stack

• (1:12) Turn any post into an animated video

• (4:17) Pro tip for creating beautiful slide decks

• (7:27) Recreate any landing page in one prompt

• (9:21) Build a 3D rotating globe and text particle effects

• (10:53) One-shot a mobile fitness app with play testing built in

• (12:46) Generate an Apple Liquid Glass design system

• (14:28) 3 takeaways on where AI design is headed

I’m proud to partner with Granola

I have Granola’s MCP connected to Claude and use it as a weekly coach. Every Friday, I ask it to recap my meetings and pull out next steps to follow up on.

The better prompts are the reflective ones: “What themes keep coming up across my 1:1s?” or “Where did I talk too much and listen too little?” Your meeting notes know you better than you do. Granola makes that context easy to use.

Try Granola for Free

Anthropic is eating the knowledge worker stack

Anthropic is quietly building an AI native version of the entire knowledge worker stack. They have:

1. Claude Code for coding

2. Claude Design for design

3. Claude Cowork for documents and more

The common thread across all three products is simple:

Code is the universal medium for all knowledge work.

Videos, slides, websites, apps, and animations — they’re all just code under the hood. And code is now free, or at least very cheap.

This means Claude now competes with both incumbents like Figma and Microsoft Office and AI startups like Replit, Lovable, and Gamma.

But how good is Claude Design? Let’s run through 5 real use cases: animated videos, pitch decks, landing pages, mobile apps, and design systems.

1. Animated video

Let’s start with video. Open a new project in Claude Design and paste in this prompt:

Make an animated video for Claude Design featuring this content: (Paste in the Claude Design announcement post or any text you want)

Claude will ask you clarifying questions first — how long the video should be, what tone and aspect ratio you want, and more — before making the video. It’s the same behavior as Claude Code when you ask it to build something:

Here’s the video Claude Design made in one shot:

This would’ve taken hours or days to do manually but Claude did it in just a few minutes. Because the video is just code, you can also manually tweak the color palette and even turn captions on or off.

The only flaw is that you can’t export the file as a video yet, so I had to use Mac’s screen recording to save it.

2. Slide deck

Now, let’s try using Claude Design to make a slide deck. When using AI to make a deck, I like to use regular Claude to iterate on the copy for each slide first:

Next, I went to Claude Design, selected Slide Deck, and prompted it:

Make a slide deck with this copy: (TEXT)

Here’s an example slide that it made:

This looks OK but the overall deck feels too static and boring compared to the video we just made. So my pro tip for creating beautiful animated slides is:

Read more

Today, I want to show you how to build a beautiful mobile app to track your workouts.

Building a mobile app used to require a team of engineers. But AI tools like Claude Code and Pencil have made it easy for you to ship a beautiful app by yourself even if you don’t know how to code.

Watch my tutorial to see me walk through how to do this in just 16 minutes.

Timestamps:

• (0:00) What we'll build: A beautiful mobile app to track your workouts

• (2:01) Step 1: Define requirements with Claude

• (6:11) Step 2: Create designs with Pencil

• (8:56) Step 3: Build the app with Claude Code

• (14:21) Getting the app on the App Store

• (15:19) Recap of all 3 steps

Watch now on YouTube or read the written guide below.

I’m proud to partner with…Granola

Granola just launched Spaces — a new way for your team to organize and share meeting notes with each other. For example, you can create a “User Calls” space with your interviews to let anyone ask questions about user needs. You can even ask questions directly in Claude, ChatGPT, or Gemini with Granola’s new APIs and MCP.

Try Granola for Free

What we’ll build: A mobile app to track your workouts

We live in a time where it’s easier to vibe code your own mobile app than to find an existing one that you like. So let’s build an app that can:

1. Create workouts by selecting an exercise and then the number of sets and reps.

2. Track workouts live by tapping each exercise set to complete it.

3. Measure progress via a calendar and charts for each exercise.

I’ll walk you through how to build it in 3 steps below.

1. Define the requirements with Claude

Let’s start by pasting this prompt into Claude:

Let’s work together on requirements for a mobile fitness app. I want three screens:

1. Add/edit workouts: Create workouts and add exercises with sets and reps

2. Workout session: Track workouts in real-time, tap to complete sets

3. Calendar: See which days you worked out and view workout details

This is the basics, but let’s work on the spec together. I want you to stay crisp on the requirements, and if you have any questions, ask them in a numbered list.

The most important part of this prompt is

I always include this line when discussing requirements with Claude so that it can ask me questions to make the spec better. Here are a few example questions and answers:

1. Claude: Do you want a rest timer?
   Me: Yes, also let me customize it in settings.

2. Claude: Do you want automatic deload after failed sets?
   Me: No, let’s keep it simple.

After Claude gets the spec to a state that you’re happy with, ask it to:

Include the last line because Pencil (our AI designer) is better at design than Claude. 🙂 Let’s cover that next.

2. Design the mobile screens with Pencil

This is where the magic happens. Here’s how to use Pencil to create beautifully crafted mobile screens instead of AI slop:

Read more

Today, I want to share 5 real use cases for Gemini inside Google Workspace.

If you’re like me, you probably do most of your work in Google Sheets, Docs, Slides, and Drive. And for a long time, Gemini in Workspace just wasn’t great.

So when Google announced a big Workspace update recently, I was skeptical. Well, I’m happy to report that Gemini in Google Workspace is now much better.

Watch my tutorial to see what’s great and what still needs work across 5 use cases.

Timestamps:

• (00:00) Why Gemini in Workspace is actually useful now

• (00:51) Sheets: Researching kid summer camps

• (03:26) Sheets: Building a Bay Area family budget

• (07:04) Docs: Planning our next vacation destination

• (09:08) Docs: Writing a script for an upcoming talk

• (12:04) Slides: Generating beautiful slides from the script

• (15:54) Honest rankings: Gemini in Sheets, Docs, Slides, and Drive

• (17:44) Why Google has golden opportunity that might close soon

Watch now on YouTube or read the written guide below.

I’m proud to partner with Replit

Replit's new Agent 4 can one-shot beautiful slide decks. For example, Karpathy published new data on which industries and jobs are most likely to be disrupted by AI.

I pasted the cloned GitHub into Replit and it made this beautiful slide deck (spoiler: according to this dataset, lawyers are most likely to get disrupted outside of tech).

Replit is my go-to tool for generating slide decks because it has genuine design taste and can generate images too. Try it by selecting “Slides” and sharing your prompt.

Try Replit for Free

1. Sheets: Researching Bay Area summer camps

Let’s start with Gemini in Google Sheets.

If you’re a parent in the Bay Area, you know that finding summer camps for your kids is basically the Hunger Games. You’re competing with every other parent to find and register before spots fill up.

Let’s open a new Google Sheet and ask Gemini to:

Create a sheet of the top 10 summer camps in the Bay Area for my 7 year old. Include columns for: name, location, age range, type (sports, STEM, arts, nature, etc.), dates, and a short description.

Gemini will create a plan first for you to review. Approve the plan and let it build. After a few minutes, you should get a spreadsheet like this:

Now there’s one very important column that’s missing: the price. Add a new column called “Weekly Cost” and type this formula:

=ai(”Get the weekly price for this camp”)

Gemini will search the web and fill in real price data. Now here’s the magical part: drag that cell down to fill the rest of the rows. Gemini will run a separate web search for each camp and fill in the prices automatically.

One thing I wish it did by default is show where it’s pulling the data from. You can fix this by updating the formula to include sources:

=ai(”Get the weekly price for this camp and include a source link”)

2. Sheets: Building a Bay Area family budget

Since we’re already in Sheets, let’s find out how much it really costs to live as a family of four in the Bay Area. Here’s the prompt:

Create a monthly budget for a family of four in the Bay Area in 2026. Include typical tech income (two working parents) and expenses: mortgage, childcare, groceries, transportation, healthcare, insurance, utilities, dining out, travel, and more. Add columns for category, estimated monthly cost, and your notes.

Gemini will make a plan again. Approve it and wait for the sheet to generate. Here’s the family budget that it made for me:

Read more

Replit just launched Agent 4, and I got early access over the weekend.

In this tutorial, I’ll show you how to plan, design, and build a habit-tracking app live using Agent 4’s new infinite canvas and parallel agents.

I’ll also show you how to generate presentations and animations from code, all in just 10 minutes. Watch now on YouTube or read the written guide below.

Timestamps:

• (00:00) Three new features in Replit Agent 4

• (00:34) Step 1: Design a habit tracker app with the infinite canvas

• (03:39) Step 2: Build faster with parallel agents

• (05:52) Step 3: Publish a full-stack app in one click

• (07:11) Step 4: Generate a slide deck and animation from code

• (08:58) Honest take: where Replit fits in the AI coding market

What we’ll build

I’ve always wanted an app where I can check off habits on a calendar and track streaks to stay motivated. So let’s build it now. 🔥

1. Design the habit tracking app with canvas

Let’s start by trying out Replit’s new infinite canvas with this prompt:

Build a mobile habit tracker app (max 3 habits). Two tabs: Calendar (default) and Habits (create/edit).

Calendar tab: Monthly view. Show a progress in each date ring that fills as habits are completed. Tap a date to open a bottom sheet with toggle cards for each habit.

Habits tab: Create and edit habits. Name field, color assignment. Clean and minimal.

Let’s start by exploring 4 design variants for the calendar tab on canvas:

1. Glassmorphic — dark, frosted-glass cards, soft glows, premium feel

2. RPG Quest — pixel art, XP bars, streak flames, gamified

3. Botanical — living garden metaphor, streaks grow plants, calm and earthy

4. You surprise me

Note how I asked Replit to generate four different designs. Behind the scenes, it spins up four separate agents to do the work. Here are the first three designs it generated:

Since I’m a gamer at heart, I’ll go with the RPG quest design. Now let’s edit the designs visually using the canvas. You can:

1. Generate additional screens. Hit the + button for the RPG design and ask it to: “Generate the quest screen.”

2. Make precise edits. Click the inspect icon and change text or colors manually.

Now that we have a calendar and quest view that we like, let’s get Replit to build them.

2. Build faster with parallel agents

Instead of building with one agent at a time, let’s have two agents work in parallel.

In Replit, you can now spin up separate threads to work on different parts of the app. Here are the prompts I gave each agent:

Calendar view: Build the monthly view, swipe to scroll between months, today is highlighted. Date cells show progress rings that fill as habits are completed (1/3, 2/3, 3/3). Tap a date to see bottom tray where I can toggle 3 habits on/off.

Habits view: Create and edit up to 3 habits with name and color. Each habit displays its current streak count. Editing a habit resets its streak to zero.

After kicking off two threads, you can now sit back and watch the agents work. There’s this cool Trello-style board view where you can see tasks move through three stages: Drafts, Active, and Ready. Drafts are plans waiting for approval, active means the agent is building, and ready means the work is done and ready for review:

This is where I think AI coding agents are heading. Instead of pair programming with one agent, you’re managing a team of agents. You give them instructions, step away, and come back to review the work.

Once the agents finish, you can review each one and click “Apply changes to the main version” to merge it in. You’re still in control of what ships. If something looks off, you can ask for edits before merging.

Once the app is built, you can deploy it in one click by hitting Publish. One advantage of Replit is that it’s vertically integrated, with frontend, backend, database, and security scanning all built in.

3. Generate a slide deck and animation with code

Now let’s have some more fun. Lately I’ve realized that:

Code is the foundation of all knowledge work.

With code, you can generate not just apps, but also slide decks, animations, documents, and more. For example, I pasted this full newsletter post into Replit and generated these assets:

1. Slide deck. The Agent generated 10 slides covering how you can use Agent 4 to plan, design, and build the habit tracker.

2. Animation. The Agent generated a beautiful animation complete with custom graphics and more.

Slides, animations, and documents are all just code under the hood. If an agent can write and iterate on code, it can generate almost any knowledge artifact.

Honest take: Where Replit’s Agent 4 fits in the AI coding market

I think the AI coding market has split into two segments — tools for professional developers and tools for everyone else.

For developers, I think it’s a two-horse race between Claude Code and OpenAI’s Codex. These tools are powerful, fast, and deeply integrated into model and developer workflows.

For everyone else — and this is the larger market — Replit is making two bets with Agent 4:

1. Non-technical people will collaborate directly with AI agents. Designers will use AI to generate designs on a canvas instead of doing them manually. PMs will manage agents through a Trello-style board to get work done.

2. Code is the foundation of knowledge work. If an agent can write code, it can generate apps, presentations, animations, and more. Just think about how many people use Microsoft Office, Google Workspace, and traditional design or animation tools. That’s the market Replit is chasing.

I think Agent 4 is a real step forward on both fronts. The canvas could use a bit more polish, but the direction is clear. We’re going to work with AI agents to build all kinds of things in the future, not just apps.

Watch my tutorial to see it in action and go try Agent 4 yourself.

Google just dropped Gemini 3.1 and updated AI Studio to be full stack. Together, I think they make the best free AI prototyping and vibe coding tool in the market.

I’ve been prototyping with AI Studio for 6 months now and it’s completely changed how I build products at work.

Instead of starting with specs and designs, I now start with prototypes that I can validate with stakeholders and real users in hours.

Watch my tutorial to see how I prototype new features with AI Studio in 5 steps.

Timestamps:

• (00:00) Waterfall vs. prototype-first product development

• (01:33) What Google AI Studio can build (poker, image gen, games)

• (03:08) Step 1: Build a base template for your existing product

• (05:43) Step 2: Work with your AI design partner to add a new feature

• (10:32) Step 3: Iterate with AI to refine your feature

• (13:08) Step 4: Collaborate with others on the prototype

• (15:05) Step 5: Turn your prototype into a real product

• (16:12) Recap: How to master AI prototyping

Watch now on YouTube or read the written guide below.

I’m proud to partner with…Linear

I’ve been talking to many AI-native companies and the way they build is just completely different. Instead of doing manual work, their best employees focus on delegating work to AI agents by giving them the right context and feedback loops.

Linear is built for the best teams to onboard and work with AI agents. It provides transparency on what agents like Cursor and Codex are working on and gives them context automatically from Slack, support tickets, and your codebase.

Try Linear for Free

P.S., I’m hiring a Senior PM for Creator Hub at Roblox — the platform millions of creators use to build and grow their games. If you have 7+ years of PM experience (especially in creator/gaming) and a “get shit done” mindset, apply here.

Why prototypes > waterfalls

Here’s the difference between waterfall and prototype-led development:

• Waterfall is when you start with a spec, the designer makes a design, and then you hand everything off to engineering. By the time you get feedback, you’ve already invested weeks.

• Prototype-led is when you start with a prototype that you iterate on with your team and real users. Once you validate your idea with the prototype, then you create the spec and design.

The key difference is:

One caveat: I said prototype-led, not prototype-only. For complex products, you should still create a PRD and design to capture the milestones and edge cases. For simpler features, you can go straight from prototype to real product.

Let me show you how.

What we’ll build

For this tutorial, let’s be meta and prototype a new feature for Google AI Studio itself.

I love Google AI Studio because it's fast, free, and integrates with Google APIs like Nano Banana directly.

However, I think AI Studio’s interface is way too busy. There are too many buttons and toggles. So let’s prototype a simplified AI Studio by following the 5 steps below.

1. Build the base template

Let’s start by taking some screenshots of Google AI Studio’s Home and Build screens and asking AI:

Replicate these screens as closely as possible. Try to match the styles and colors and make it interactive.

Google AI Studio will now build a working replica of its own interface. Save it as “Google AI Studio template” and clone it before making changes.

This way, you can easily start over from what’s live in the product today if things go wrong. Anyone on your team can also clone the prototype off the same base.

2. Prototype the feature

Now let’s simplify Google AI Studio’s UX. First, we need to decide what to simplify.

Let’s create a Gemini Gem called “UX designer” and set it up as follows:

1. Ask AI: “Give me a prompt to make you an experienced UX designer. I want you to work with me to simplify the UX for Google AI Studio.”

2. Paste the prompt that AI generates into the Gem and share some screenshots of Google AI Studio.

Now, let’s ask the Gem:

I want to redesign Google AI Studio’s interface to be much simpler. Check out the attached images and list the top 5 things to simplify. Ask me any questions first.

Gemini will ask you a few questions and come up with a list. I also did some research on Reddit and the top request is to have project folders just like Codex.

With this research in hand, let’s ask AI to update our prototype with this prompt:

Read more

Today, I want to show you how to use OpenClaw to manage your calendar, edit your documents, send yourself personalized briefings, and much more.

Ever since I set up my bot, I’ve barely touched my other AI apps. It’s just so much easier to text my AI employee to do things while on the go.

Watch my tutorial to see me demo 5 use cases, Google Workspace setup, and more.

Timestamps:

• (00:00) Why OpenClaw is my favorite AI bot

• (00:54) How to set up your bot safely in 5 steps

• (03:01) Use case 1: Manage Google calendar

• (05:40) Use case 2: Edit Google Docs and Sheets

• (08:31) Use case 3: Give your bot a voice

• (11:15) Use case 4: Get personalized briefings

• (13:50) Use case 5: Get weekly insight reports

• (15:48) How to connect to Google Workspace

• (21:47) How to personalize your bot’s memory and soul

Watch now on YouTube or read the written guide.

I’m proud to partner with…Linear

My newsletter is called Behind the Craft and few companies exemplify craft like Linear. They’ve built the best platform for teams to work with AI agents. You can:

1. Assign bugs and tickets to coding agents

2. Pull in context from Slack, your support tickets, and your code base

3. Turn that context into specs and plans automatically without manual work

I’m managing my creator business with Linear and you should try it too. Use the link below to get 6 months free to Linear Business now.

Try Linear for Free

Recap: How to set up OpenClaw safely

Let’s first recap how to set up OpenClaw safely so that you don’t get compromised:

1. Run it on a dedicated computer. I installed my bot on a Mac Mini but any old MacBook will do. Keep your Mac on 24/7 using a free app called Amphetamine.

2. Give it its own credentials. My bot (I call her Zoe) has her own Apple and Gmail ID.

3. Run OpenClaw’s security audit. In terminal, type “clawdbot security audit --deep” and then follow its instructions to make it more secure.

4. Give it read access to your main account and write access to select files. For example, Zoe can read my calendar and edit select Google Docs and Sheets but can’t access my entire Google Drive.

5. Never share your bot with anyone else. Don’t add it to any group chats or websites. Zoe can only talk to me.

5 everyday tasks I’ve delegated to my bot

When I talk about OpenClaw, I get questions like:

1. “Why can’t you just vibe code an app for this?”

2. “Is this really better than Claude Code?”

Using my bot doesn’t feel like using an app. It feels like onboarding an AI employee that I can train to do whatever I want her to do.

Here are 5 tasks that I’ve delegated to Zoe:

1. Managing calendar invites

Zoe has view access to my calendar, so I can simply text her to schedule things for me.

For example, I recently texted Zoe to send me a calendar invite for a family trip to SF. It’s way easier than navigating the Google Calendar app:

2. Editing Google documents

Zoe can edit select Google Docs and Sheets that I’ve shared with her.

For example, I asked Zoe to draft a plan for my weekend visit to the city in a Google Doc. She included Caltrain schedules and lunch options at the Ferry Building:

Zoe can also edit specific Google Sheet cells and Google slides just through texting. I demo this in my video tutorial.

3. Reply via voice

Zoe is more fun to talk to when she can reply with voice. To set this up, just ask:

I want to let you reply to me with voice. What are some options to do this?

She found a few voices in Microsoft’s Edge TTS service, which is free to use. I ended up giving her a soothing British voice to tell me corny dad jokes:

4. Daily morning briefs

One of Zoe’s most useful capabilities is that she can schedule recurring tasks that run at a set date and time (also known as cron jobs).

Every morning at 6:30 AM, Zoe sends me a personalized briefing with weather, calendar events, priority tasks, trending AI tweets, and a personalized thought to start my day. She pulls from this info from Google Calendar, Linear, X, and her memory.

Her personalized thought is my favorite. Here’s what Zoe shared with me recently:

5. Weekly insight report

Zoe can also send me emails from her dedicated Gmail account.

Every Friday, she sends me an email with stats for my latest YouTube videos and Substack articles:

1. For YouTube, she uses yt-dlp (free) to pull public video data for me and similar channels.

2. For Substack, there’s no public API access. So I added Zoe as an admin to my Substack and she just uses the browser to pull stats for me!

Here’s what the report looks like:

To try this, just ask your bot:

I want you to send me a weekly email that includes (fill this in).

You probably see where I’m going with this. Zoe (OpenClaw) is the first AI product that I’ve used where it feels like I can just ask her to do anything.

That’s a remarkable feeling.

Setting up your bot with Google Workspace

If you’re like me, you probably run your life using Google Workspace. I’ve been waiting for Google to launch an AI that can send me emails, manage my calendar, edit my Google Docs, and more for years.

It turns out that you can set up your OpenClaw bot to do all this in 10 minutes.

Let me walk you through exactly how in 3 steps:

Read more

Today, I want to show you how to set up OpenClaw (formerly called Clawd), the most impressive AI product I’ve tried since Claude Code.

OpenClaw is an AI employee that you can text at any time to manage emails, edit documents, push code, and so much more on command.

Watch my tutorial now to see my top 5 use cases and learn how to set up OpenClaw safely.

Timestamps:

• (00:00) What is OpenClaw and why everyone's losing their minds

• (02:30) Live demo: Using OpenClaw to send emails, read docs, push code

• (09:27) Do you actually need a Mac Mini to run OpenClaw?

• (10:26) How to set up OpenClaw to run safely (important!)

• (12:41) Step 1: Run the install script and setup wizard

• (13:26) Step 2: Connect OpenClaw and your messaging apps

• (16:10) Step 3: Give OpenClaw access to GitHub, X, and Google Workspace

Watch now on YouTube or read the written guide below.

P.S. I recently interviewed Peter Steinberger, the developer who built Molt, so subscribe to get our exclusive interview this Sunday. 🙏

This post is brought to you by Granola, Replit, and Linear

I’ve partnered with 3 of my favorite AI tools for the next few months:

1. Granola lets me customize exactly how I want to share my meeting notes.

2. Replit is my go-to tool for beautiful prototypes and full stack apps.

3. Linear is quickly evolving into a platform for orchestrating AI agents.

It feels great to promote tools I actually love and you can now unlock 3 months free to Granola + Replit and 6 months free to Linear by becoming a paid subscriber.

Upgrade to Get Instant Access

What is OpenClaw and what can it do?

OpenClaw is a free, open-source AI assistant that lives in your messaging apps.

It's like having a really smart employee that you can text and assign tasks to. You just need to give it your Claude subscription and install it on a computer for it to work.

I’ll walk through how to set up OpenClaw safely later. First, here’s what it can do:

1. Read X/Twitter timeline

I asked OpenClaw to check my X timeline and it pulled the best tweets from people I follow along with the hot topics of the day.

2. Read, draft, and send emails

I asked OpenClaw to email me a summary of the setup process from its point of view. It wrote the email and sent it to my Gmail in a few seconds.

3. Send me personalized weekly briefings

I asked OpenClaw to look at my Gmail, Google Calendar, and Google Drive to send me a briefing for the upcoming week. It pulled together a briefing with important meetings, emails that need attention, key focus areas, and more.

4. Build and deploy a website

I asked OpenClaw to build and deploy a website covering our interactions so far. It deployed the website in under a minute from a chat message. 🔥

5. Remember context about me

Finally, I asked OpenClaw to read my Google Drive to update its memory based on my Plan and Health documents. Now when I ask OpenClaw questions, it knows my goals, my health priorities, and what I’m working on. Onboarding my new AI employee is complete 😉

How other people are using OpenClaw

I’ve only been playing with OpenClaw for a few days and it’s already blown my mind, but others have customized it to do much more:

1. Health tracking. Connect OpenClaw to Whoop to get daily fitness summaries.

2. Flight check-in. Get OpenClaw to use your browser to check in to flights for you.

3. Smart home control. Control your lights and home appliances with OpenClaw.

One person even set it up to control their smart oven although I have some serious hesitations about doing this. You don’t want AI to burn your house down. 😅

Step by step guide to install OpenClaw in 20 minutes

First things first, you can run OpenClaw on any of the following:

1. Your regular laptop. Your old MacBook works fine to start. Just make sure it stays plugged in and on (no sleep mode) or OpenClaw will go silent.

2. A virtual private server (VPS). Services like Hetzner cost $5-10/month and keep OpenClaw running 24/7 without leaving a computer on at home.

3. Mac Mini. It costs $500 to buy one. The advantage here is that you can just leave your Mac Mini plugged in as a dedicated home for OpenClaw.

I made this guide just running OpenClaw on my old Macbook Pro, so start with that before you decide to invest in new hardware.

How to install OpenClaw safely

If you want to run OpenClaw safely, here’s what I recommend:

1. Run it on a dedicated computer. This can be a Mac Mini that’s powered on 24/7 or just an old laptop. You can try it on your main machine, but I definitely recommend switching to a dedicated computer as soon as possible.

   Give it its own credentials. I set up my Mac Mini with its own Apple ID, Gmail, and Google ID. This way OpenClaw doesn’t have access to my main accounts. Instead, I’ve shared specific Google Docs, Sheets, and Drive files for it to read and edit.

Again, OpenClaw is still early software. You don’t want it to read a malicious email that has a prompt injection to delete all your files. That’s why I recommend doing the above.

Now let’s walk through the install process step by step:

Read more

Today, I want to show you how to build a super fun retro game using Claude Code.

Building games with my 7-year-old and Claude Code is one of my favorite weekend activities and I want you to learn how to do this too.

Here are some games we’ve built together:

• An underwater shooter where you play a swimmer fighting off sharks.

• An animal hospital game where you treat different animals (using Nano Banana).

• And today’s tutorial: A retro space shooter with wave-based enemies, power-ups, and epic boss fights.

Watch my tutorial to learn how to build the space shooter in 5 steps.

Timestamps:

• (00:00) Why I love vibe coding games with my kid

• (01:19) Step 1: Set up the project

• (02:56) Step 2: Find free pixel art assets

• (05:33) Step 3: Draft the spec with Claude's AskUserQuestion tool

• (08:56) Step 4: Build the MVP and iterate

• (13:06) Step 4.5: Debug the epic boss battle

• (15:24) Step 5: Ship your game with GitHub and Vercel

Watch now on YouTube or read the written guide below.

This post is brought to you by…Replit

Now that I know how to build retro games on the web, I’m excited to start shipping them as native mobile apps. Replit is the easiest way to do this because it builds with real native components and handles App Store submission for me.

Try it yourself by going to Replit, selecting “Mobile app” in the dropdown, and then building your idea. It’s as simple as that.

Try Replit for Free Now

What we’ll build: A retro 2D space shooter

We’ll build a classic vertical-scrolling space shooter with wave-based enemies, power-ups, and epic boss battles at the end. A note before we get started:

This game might look intimidating to build, but it really just comes down to chatting with AI just like you chat with ChatGPT or Claude.

If my 7-year-old can do it, you can too. Let’s dive in!

1. Set up the project

Start by creating and opening an empty folder in Cursor called “space-shooter-game” and then installing Claude Code in Cursor’s terminal (follow this quick start guide if you need help). Then, type in terminal:

claude --dangerously-skip-permissions

This sounds dangerous, but all it does is let Claude work in your new folder without having to ask you for permissions each time. This makes vibe coding way more fun, and Claude is smart enough not to screw up your files.

By the way, if you’re kids don’t know how to type yet, just use Wispr Flow to encourage them to dictate commands to Claude directly.

2. Find game assets

Now let’s find some pixel art for our game. Claude has web search built in, so you can simply prompt:

I want to build a retro 2D space shooter. Where can I find free pixel art assets?

It’ll likely find pixel art on websites like Open Game Art and itch.io. But to make this much easier, I’ve already found an amazing pixel pack for building shooters, platformers, and more that’s 100% free. Here’s the download link:

Download the Legacy Pixel Collection

After you download the pack, open it and drag the entire folder into your space shooter folder. Then, ask Claude:

I just added some pixel art, list the ones that we can use for our space shooter.

Claude will identify the relevant pixel art for your player ship, enemies, projectiles, power-ups, and backgrounds automatically.

3. Draft the spec

Next, let’s ask Claude to draft the spec for our space shooter. Whenever I want AI to draft a spec, I always like to include 3 specific instructions in the prompt:

Read more

Today, I want to show you how to build a Claude Skill to write better.

Skills have the potential to be the biggest AI productivity unlock since Projects.

Think of a skill as expertise that AI can trigger from any conversation. But the product is still early and you have to know how to get AI to trigger the skill reliably.

Watch my tutorial to build a new skill to avoid AI slop writing forever and trigger it reliably from any conversation.

Timestamps:

• (00:00) What exactly are Claude Skills?

• (01:51) Skills vs Projects: When to use each of them

• (02:46) Building a writing style skill to avoid AI slop forever

• (06:26) My hack to get Claude Skills to trigger reliably

• (11:04) Building a strategy doc template for our writing skill

• (13:46) How to get started with Claude Skills now

Watch now on YouTube or read the written guide below.

This post is brought to you by…Radiant

Most meeting tools stop at notes and summaries. Radiant goes further.

It’s an AI meeting assistant and workspace that turns your conversations into ready-to-send emails, briefs, updates, and tasks. You review, refine, and send. No annoying bots joining your calls, and no copying meeting notes into ChatGPT.

Try Radiant for Free on Mac

What is a skill?

A skill is just a folder with instructions that AI can trigger based on a given task.

For example, the skill in the image above applies Anthropic’s brand guidelines to any artifact. Here’s a breakdown of each file:

1. Skill.md (required). Tells AI what the skill does (e.g., main colors = #141413). Be sure to write a clear description that AI will use to decide when to trigger the skill.

2. Reference (e.g., slide-decks.md). Templates that AI can pull in if needed.

3. Scripts (e.g., apply_template.py). Code that AI can execute to apply the skill.

Here’s a snapshot of the contents of each file:

When to use Skills vs. Projects

Skills complement Projects well:

1. Use Projects to upload materials for a specific work stream.

2. Use Skills to train AI to follow your instructions across all relevant conversations.

Here’s a simple comparison table:

To me, the core value of skills is that AI is supposed to know when to trigger it based on your conversation. But in practice, this doesn’t work reliably yet. I’ll share a hack in the steps below to fix this problem.

What we’ll build: A skill to write better and avoid slop

Let’s build a writing skill that:

1. Improves your writing and avoids AI slop.

2. Knows how to create a great strategy doc using my personal template.

1. Create the writing-style skill

Nobody likes walls of text, so I keep my writing simple, short, and specific. I use short paragraphs mixed with numbered lists that have bold stems for easy scanning. I also avoid the telltale signs of AI slop:

• AI phrases. e.g., “It’s worth noting,” “importantly,” “overall”

• AI words. e.g., Delve, foster, underscore.

• AI styles. e.g., “Not only X, but also Y,” “question? answer”, too many em dashes.

a) Prompt AI to create the writing-style skill

Here’s the exact prompt to get Claude to create a skill that’ll permanently improve your writing and avoid AI slop:

Read more

Today, I want to show you how to set up your own AI health and fitness coach.

A few months ago, I got a DEXA scan that was a wake-up call — I had 25%+ body fat and low muscle mass despite working out 3x a week.

I was clearly doing something wrong, so I decided to work with my friend Dan Go to get serious about my health. I also hired another coach that’s (you guessed it) AI.

If you don’t want to pay thousands for a professional coach, AI can give you surprisingly personalized health advice if you give it the right context.

So let’s cover how to:

1. Start with the fundamentals

2. Create a personal health plan

3. Set up your AI health coach

4. Example prompts to ask your coach

5. How to check-in regularly for advice

1. Start with the fundamentals

If you don’t know Dan Go, he’s a fellow middle-aged Asian dad who reaches millions of people and has helped thousands of founders and tech professionals get fit. Here’s his basic advice and how I’ve adjusted my lifestyle:

1. Sleep 7-8 hours. I’m trying harder not to bring my phone to the bedroom. If I’m being honest, I succeed maybe 50% of the time (Dan, don’t judge me!).

2. Get 0.8g protein per pound of bodyweight. I get my protein from salmon, mahi mahi, beef, and chicken that I eat on top of salads for dinner. I also drink a protein shake in the afternoon and have largely cut out alcohol, refined carbs (goodbye rice 🥲), and late-night snacking.

3. Walk 8-10k steps daily. I go on walks around the neighborhood between meetings and use AI to voice dictate my thoughts like a crazy person.

4. Lift weights 3-4x a week. I’m pushing myself harder and started focusing on my legs more (the biggest muscle group).

This stuff isn’t rocket science, but staying consistent is hard. If you can’t afford someone like Dan to keep you honest, here’s how to set up AI as the next best thing.

2. Create a personal health plan

Create a Google Doc called “Health” and add the following:

1. Status. Your current weight, body fat percentage, lean mass, and visceral fat. You can get this from a smart scale or a DEXA scan.

2. Goal with milestones. Set a specific target like “reach 20% body fat by March 1” and get AI to set monthly milestones based on your current status.

3. Life context. Your schedule, job demands, family situation, and constraints. I tell AI I work from home Mon/Fri, have two young kids, and don’t have much time.

4. Diet. Your daily protein target and typical meals. I split mine by home vs. office days since my eating patterns differ.

5. Exercise. Your workout split, exercises, sets, reps, and weights. Include both strength and cardio workouts.

6. Sleep. When you go to bed, wake up, and any sleep issues. Sleep is the foundation for everything else.

7. Challenges. Be honest about what you struggle with. For example, I had a terrible late night snacking habit.

In addition to your health plan, consider getting a:

1. DEXA scan. DEXA costs ~$80 and gives you an accurate body fat number. This might be your wake up call too — my DEXA body fat was 8% higher than my scale.

2. Blood work. Upload your annual blood test results. AI can interpret markers and flag areas of concern.

3. Set up your AI health project and prompt

Now let’s bring AI into the picture. Create an AI project called “Health” and attach your health plan document. For your convenience, I’ve included:

1. My health plan template that you can fill in and attach to the project.

2. My health coach prompt to get AI to give you objective, personal advice.

Here are the links:

Read more

Today, I want to show you how to prompt Gemini’s Nano Banana model to create beautiful infographics that match your brand every time.

Here’s the problem: If you just ask Nano Banana Pro to “create an infographic” it’ll create a cluttered mess full of generic clip-art and text.

Watch my tutorial to create infographics that match your brand in 5 steps.

Timestamps:

• (00:00) Why most AI infographics look terrible

• (01:03) Step 1: Use regular Gemini (to save money)

• (02:18) Step 2: Work with AI to create a style guide

• (05:55) Step 3: Prompt Nano Banana in two steps

• (07:23) Step 4: Customize the prompt for your brand

• (09:17) Step 5: Iterate with AI and save your prompt

Watch now on YouTube or read the written guide below.

This post is brought to you by…Framer

Framer recently launched Design Pages to become much more than a “website builder”. Design pages lets you sketch, refine, and create everything from websites to social assets, campaign visuals, icons, and more.

The real power comes from how seamlessly Design Pages connect to the rest of Framer. Any design can become a live, production-ready website with one click. No Figma imports. No HTML pastes. No extra tools.‍‍‍‌‍ Start creating for free here, and use code PETERYANG2025 for a free month of Framer Pro.

Try Framer for Free

What we’ll build: A prompt to create beautiful infographics that match your brand every time

Below’s a comparison of two infographics for my recent So What’s Going to Happen to Product Management Anyway? post:

1. Left: I just wrote “Create an infographic for this: (paste post).”

2. Right: I used a prompt that I created by following the 5 steps below.

You can see the difference between the AI slop on the left and an infographic that you’ll actually want to share on the right. Let me show you how I did this below.

1. Use regular Gemini (to save money)

There are three ways to access Nano Banana:

1. Gemini: Free to try and lets you chat with AI to iterate. Images have a small Gemini watermark at the bottom right that you can easily remove later.

2. NotebookLM: Free to try but doesn’t let you iterate after generating the image which is a deal breaker for me.

3. AI Studio: Gives you the most control and doesn’t have the Gemini watermark. However, you have to pay (it’s $0.13-0.24 per image).

Since I’m cheap and I want all of you to try this, let’s just stick with regular Gemini. Just be sure to prompt “use Nano Banana Pro” so that it uses the latest Gemini model.

2. Work with AI to create a style guide

This is the key step. Your style guide should include all of the following:

1. Aspect ratio. Choose 9:16 (vertical), 16:9 (horizontal), or square. I prefer 9:16.

2. Resolution. Choose at least 1K resolution. You can also go for 2K or 4K.

3. Colors. Choose a primary color, 2-3 secondary colors, and a background color.

4. Typography. Choose your desired font style and size for title and body text.

5. Layout. Choose your ideal layout (e.g., a grid with generous whitespace).

6. Illustration. Choose the illustration style. You can also refer to an existing style (e.g., illustrations should look like New Yorker or HBR cartoons).

It’s really important to describe all this in detail to get infographics that match your brand. For the illustration style, try uploading a few infographics that you like and asking AI to create the style, texture, concept, palette and more.

Below’s my detailed AI prompt to create infographics that have a beautiful hand-drawn illustration style (I’ve also added it to my prompt library for paid subscribers):

Create a 9:16 infographic (1K resolution) with Nano Banana Pro using the text that I’ll share with you next.

ILLUSTRATION

Read more

Gemini 3 and Replit Design Mode combined is the best AI designer I’ve ever seen.

Instead of purple AI slop, you can now finally build beautiful websites and apps complete with stunning AI videos in just 2 minutes each.

In the tutorial below, I share the exact prompts that I used to build a stunning travel catalog, a retro personal OS, a poker game, a music sequencer, and more.

Watch the tutorial and follow along to build 10 beautiful websites in 12 minutes.

Timestamps:

• (00:00) Why Replit and Gemini 3 are a game changer for AI design

• (00:37) Step by step: Build a stunning travel catalog with AI-generated videos

• (03:21) Create a retro Windows 95 personal website with my favorite games

• (05:37) Generate a multiplayer poker game that actually works

• (07:08) Build a luxury Ferrari showroom with dramatic video reveals

• (09:39) Design a personal journal app with late-night café aesthetics

• (10:40) Demo of my satirical Bay Area real estate website that went viral

P.S. You can get 3 months free Replit, Wispr Flow, and Granola ($153 value) and my AI prompt library + AI community by upgrading to an annual subscription.

This post is brought to you by…Reforge

Most prototyping tools make you start from scratch each time and produce the same purple looking AI slop. Reforge Build learns from your design guidelines to generate prototypes that actually look like your product.

You can even create several variants to compare side by side and collaborate with your team. Try Reforge Build and use the code “Build” for one month free.

Try Reforge Build for Free

Let’s build a stunning travel catalog website (link)

Here’s my travel catalog website complete with AI videos highlighting the top 5 countries that I’ve visited. You can build the same thing by following the steps below.

Build and show it to your relatives during the holidays — I’m sure they’ll be blown away 🙂 Watch me build it live here.

1. List and describe videos highlighting top 5 countries

Start by listing the top 5 countries you’ve visited and describing the video you want for each. I worked with AI to come up with these 1-liner video descriptions:

• Japan: Slow zoom on Himeji Castle framed by drifting cherry blossoms

• Portugal: Golden hour drone glide over Lisbon’s terracotta rooftops

• Italy: Positano’s pastel homes cascading to sea in golden hour light

• Spain: Slow dolly through the Alhambra’s intricate Moorish archways

• France: Cinematic reveal of Eze village perched over the Mediterranean

2. Work with AI to write a prompt to build the website

Now let’s ask ChatGPT, Claude or Gemini to create an AI prompt to build the website. I’ve included my full prompt below for your convenience. Just replace the bold section:

Build a high-end, cinematic travel catalog website with beautiful fonts. The site must use a full-screen vertical scroll-snap layout where every section is 100vh.

Structure & Content:

1. Landing Section:

• Background video: Cinematic slow-motion waves crashing on a dark sand beach at sunset, moody and atmospheric.

• Layout: Split screen or heavy typography focus.

• Headline: “My top 5 favorite countries” in massive, tracking-tight white typography (Inter or Helvetica).

• Interactive List: A numbered list (01-05) of destinations below. Hovering a destination shifts the text right and reveals an arrow. Clicking smoothly scrolls to that section.

2. Destination Sections:

• Each section must have a unique full-screen background video, centered white text with a dark overlay for readability, and entrance animations (fade up). You should use AI to generate the videos based on the descriptions below.

• Japan: Slow zoom on Himeji Castle framed by drifting cherry blossoms

• Portugal: Golden hour drone glide over Lisbon’s terracotta rooftops

• Italy: Positano’s pastel homes cascading to sea in golden hour light

• Spain: Slow dolly through the Alhambra’s intricate Moorish archways

• France: Cinematic reveal of Eze village perched over the Mediterranean

Tech stack and style:

• React + Tailwind CSS + Framer Motion.

• Use scroll-snap-type: y mandatory for the container.

• Typography: Clean sans-serif (Inter), white text on dark backgrounds.

• Videos: Use high-quality, muted, autoplaying loops for all sections.

3. Paste the prompt into Replit Design Mode to build

Now go to Replit, select Design Mode, and paste in your prompt. The whole process takes about 2 minutes. Grab a coffee while it generates your site.

Sometimes, the prompt above generates static images instead of videos. If that happens, just ask it nicely: “No, I want full looping videos for each background.” If you want to edit copy, just be specific about what you want changed.

There’s no need to read or touch code in any part of this process 🙂

When you’re finished, hit Publish on the top right to take your site live. It’s that simple, and the design is night and day from the typical purple AI slop.

10 beautiful websites and apps to build next

I spent a few hours on the weekend finding the best websites and apps that people have created with Replit and Gemini 3. Below, I’ve included all the actual prompts and instructions to make it easy for you to build and personalize these yourself.

Remember that you can get Replit Core for free to try these prompts by upgrading to my annual plan. My 20% off offer is also valid for another 5 days.

Upgrade Now to Get Instant Access

1. The nostalgic retro desktop I wish I still had (link)

This one’s my favorite. Imagine a full Windows 95 desktop with boot sequence, draggable windows, start menu, and even a Memories folder with screenshots from my favorite games: Starcraft, Red Alert 2, Commander Keen, and more.

Create a retro personal portfolio designed as a Windows 95-style operating system. Include bootup sequence with loading bar, desktop with draggable windows for About, Projects, Skills, and Contact, working taskbar with clock, and classic UI elements like beveled buttons. Use system fonts and a teal/gray palette. Make windows draggable and resizable with smooth animations.

2. A poker game that deals, bets, and actually works (link)

This prompt creates a complete poker game with card dealing animations, chip stacks, and a betting interface that actually works.

Create a beautiful multiplayer poker game with card dealing animations. Include chip stacks for each player, betting interface with raise/call/fold buttons, and smooth card flip animations. Use clean typography and a felt green table background. Make it functional with proper poker rules.

3. An AI workflow and agent builder interface (link)

This prompt generates a workflow builder for creating and connecting AI agents.

Create a high-quality interface for building AI agents, similar to Zapier. Include drag-and-drop workflow builder with node connections, trigger and action blocks, settings panel, and testing interface. Clean modern design with good information hierarchy and intuitive flow between components.

4. A Ferrari showroom for “Dubai luxury” (link)

This prompt generates a luxury car landing page with full-screen videos and dramatic reveals.

Build a landing page for a Ferrari showroom in Dubai. Include: hero section with full-screen video background, featured models grid with specs and images, virtual tour CTA section, and elegant contact form. Use Ferrari’s red and black color scheme with sophisticated typography. Make it feel premium.

5. A beautiful music sequencer that plays beats (link)

This prompt creates a fully functional music creation interface inspired by Teenage Engineering’s minimalist design.

Create a digital step sequencer inspired by Teenage Engineering. Include 16-step grid, multiple instrument tracks, playback controls, and tempo adjustment. Use minimalist design with cream background and colorful buttons. Make it functional with Web Audio API. Clean interface with proper spacing and typography.

6. A cyberpunk portfolio site for a creative director (link)

This prompt builds a cyberpunk-style portfolio with real-time particle effects and case studies. It looks a bit too much like a crypto site to me, but maybe you’ll like it.

Create a portfolio site for a creative director at a gaming studio. Aesthetic: cyberpunk command center meets sleek product design. Hero section with real-time particle system that reacts to mouse movement. Case studies designed like unlocking game levels with progress bars and video trailers that expand on click. Use dark purple and electric blue color scheme with neon accents.

7. An audio product page with buttery smooth parallax (link)

This prompt creates a minimalist product page with smooth parallax scrolling and moody product videos.

Build a product page for a high-end audio hardware company. Style: Teenage Engineering meets Bang & Olufsen. Include sections with buttery smooth parallax effects, looping videos showing the product in cinematic environments, technical specs in clean typography, and generous white space throughout. Minimalist color palette.

8. A beautiful motion design portfolio (link)

This prompt generates a portfolio site with 60fps animations and transitions that showcase motion design craft.

Build a motion design portfolio with high-end car commercial aesthetics. Include smooth 60fps animations throughout, dramatic lighting effects, dark sophisticated color palette, and transitions that demonstrate craft. Featured work should display video reels that play on hover. Navigation should feel fluid and premium.

9. A cozy journal app for late-night thoughts (link)

This prompt creates a warm, inviting journaling interface that encourages reflection and daily writing.

Design a personal journal app with late-night café aesthetics. Include soft amber lighting effects, comfortable rounded UI elements, gentle transitions, and a welcoming interface. Features: calendar view, mood tracking, rich text editor with formatting options, and daily writing streaks. Color palette should feel warm and inviting.

10. The most honest Bay Area real estate agency (link)

Last but not least, I used this prompt to create a satirical site for a Bay Area real estate agency. You can buy a “brilliant starter home” for only $3.2 million and “take just 90 minutes to commute 12 miles in Bay Area traffic.” 😅

Build a satirical luxury real estate site: 5 full-screen scroll-snap sections with video backgrounds (SF Aerial, Old Ranch, Street, Traffic, Sale Sign). Design: High-end editorial, white serif text, dark gradients. Copy highlights: Dream, Reality ($3.2M fixer starter home), Schools (insanely pricy private schools), Commute (90 min to drive 12 miles), Opportunity (bidding war). Add smooth scroll animations.

The holidays are a perfect time to build

If you ever get tired of talking to your relatives, here’s what I recommend:

1. Download Replit Mobile

2. Get 3 months free by upgrading to my annual plan (offer expires in 5 days)

3. Copy one of my prompts above into Replit and watch the magic 🙂

To be honest, I built some of the websites above while waiting in line for boba tea. This is the world that we live in now.

Watch the video tutorial if you need more help and subscribe to my YouTube if you enjoyed this guide.