👋🏼 Hey there! Welcome to another roundup edition of Offload, a newsletter for professionals to learn how to build products and automate work with AI and no-code tools.

Hey, don’t keep us a secret → share the Offload newsletter with friends

In this issue, you'll find:

• How to vibe code a Chrome extension

• A prompt to write better prompts

• What's a transformer

• Two articles on how data is still the oil in the AI era

• Fun with new Claude artifacts

-Offload This-

Vibe coding a Chrome extension

If “vibe coding” is something new for you, this is what you need to know:

You start with an idea and talk to an AI, like Claude or GPT-4, to help you write the code.

It’s more casual than traditional development. You’re not writing long documents or planning sprints. You’re just figuring it out as you go, one step at a time.

The name “vibe” is unfortunate, in my opinion, because it implies low commitment or sloppy software.

You still need to know what you want to build. But instead of spending weeks planning, you can create something simple in a weekend.

It’s a way for people to create useful tools or test ideas fast.

Vibe coding is part of a bigger trend

Vibe coding is getting a lot of attention these days with tools like Lovable and V0, but to me, it is part of a way bigger trend, much more impactful to our work life:

→ The cost and barriers of software development are decreasing.

What people are realizing is that you don’t need a (huge) team. You don’t need a computer science degree. If you have a clear idea and a few hours, you can build something that works.

This is new.

A few years ago, you’d need to hire developers or learn to code yourself. And the cost of hiring a junior-level engineer was ridiculous.

Now, tools like Claude and GPT-4 can help you build step-by-step.

You still need to think and make decisions. But the hard parts, like writing code, fixing errors, and figuring out what to do next, are getting easier.

That’s what vibe coding represents to me. It’s what happens when building things stops being so hard.

Look at this quote from Sam Altman's blog:

Well, this is the whole point of this newsletter.

Building things will be so much easier that knowledge professionals will be able to build things (things = software).

To prove that, I had to do it myself.

Building a Chrome extension

In a single weekend, I created a Chrome extension.

I named it Promptastic, and it works as a prompt manager where I save all my prompts.

If you are a Chrome user, you can download it here and use it too.

Why a Chrome extension: It is easier and, in this example, doesn't require authentication or a database.

How I built it

I downloaded Cursor for the first time, opened up Claude, and started asking questions.

Here is how I started:

In my opinion, that is the appropriate way to start a project: making a plan.

Some people go to Lovable or V0 and make prompts like this:

That is useless.

You have to treat these tools like a skilled mid-level engineer: incredibly competent, but only if you give them clear context and direction.

The right way to prompt

This is how it continued:

The most important aspect of this prompt is “break it down into very small features”.

Claude then made an 8-phase plan for me that I'm fully sharing here with you (excerpt below).

But, the thing is, it was still not simple enough for me, and I wanted to learn why it was suggesting each one of the steps.

So, I took a step further and asked:

The result was perfect: a simple step-by-step instruction to follow for a small feature, and Claude had the context of the next features to develop once this one was finished.

Take a look at the screenshot below of one of the instructions it made:

• The first feature is just a button that prints “hello world” → super small

• The instructions are really simple; click here, go there etc. → noob proof

• There is an explanation of why in the end → learning opportunity

Creating each feature

With the plan in hand, I just needed to input the prompt Claude suggested into Cursor agent development and see it working alone.

It was amazing to see how it works; Cursor's agent implemented every single line of code of the extension!

For non-technical professionals, I know that looking at these dark pages full of code may seem scary. But having both Claude and Cursor agents at your side made everything much easier.

The development process

The development of the extension became a series of Q&As while implementing each feature, and when everything worked as expected, I just asked for the next feature.

Context window and debugging

During the process, some things didn't work as expected.

Cursor makes mistakes, as most AIs do.

Generally, these mistakes were due to a lack of context: the agent made some changes to the code but didn't consider the impact on other places.

To address them, pasting screenshots of the problem into Cursor agent or Claude and discussing potential solutions worked.

When the app is something small like this simple Chrome extension, you can even paste the entire code into Claude so it can understand the whole application first.

In the screenshot below, you can see there is a screenshot of the problem and every file of the project as a context for Claude to read.

My takeaway

This is what vibe coding means: using AI and modern tools to go from idea to working product with as little friction as possible. It’s playful, fast, and shockingly effective.

It produced something real and useful for me, potentially for others too.

Doing a project like this feels empowering. I strongly recommend you try building a simple extension like this.

Even if you don't publish it online, the effort of creating something and trying new tools will change your mind about coding.

Need an idea?

Here are a couple of simple extension ideas to try for yourself:

1. Highlight Saver
   Let users highlight text on any page and save it to a list inside the extension popup. Store data locally. Add tags if you want to go a bit further.
   

2. Focus Timer Overlay
   A small, floating Pomodoro timer that sits on top of any webpage. Helps you stay on task without switching tabs.

-Prompt Template-

A prompt to write better prompts

I don't know if you know, but you can ask an AI to give you a better prompt instead of throwing scattered thoughts into it 😃 .

It took me a while to start doing this. Now, pretty much every conversation I start is asking ChatGPT to prepare a prompt for me to use in other platforms, or even in ChatGPT.

This way, you spend less time arguing with the AI and getting more from one efficient prompt.

Below is the template I use to generate better prompts. Save it in Promptastic 😉 

Important tip:

I usually make the ROLE more detailed, breaking the quality of the role into two:

-Learn AI-

Transformers: the “T” in GPT

You know ChatGPT. You've probably used it to write an email, debug code, or settle debates about whether a hot dog is a sandwich (it's not)

But what you might not know is that the “T” in GPT stands for transformer.

Yes, but not like Optimus Prime transformer, something way cooler (if you’re the kind of person who enjoys neural networks more than explosions).

Today, we dive into the most important and perhaps most underappreciated letter in modern AI.

What is a Transformer?

A transformer is a neural network architecture; basically, a blueprint for building AI models.

It was introduced by Google researchers in 2017 in a paper with the most mic-drop title in academic history: "attention is all you need."

Think of it this way: if you wanted to build a house, you'd need blueprints showing where the kitchen goes, how the plumbing connects, and why the bathroom shouldn't be next to the dining room.

Similarly, a transformer is the blueprint that tells you how to build a language-understanding machine.

The actual model (like chatgpt) is the house you get after following those blueprints, gathering materials (training data), and doing the construction work (training).

    [ Massive Text Data ]
      (books, web, code)
               |
               v
   +----------------------+
   |  Transformer Recipe  |   <-- Architecture
   |   (self-attention,   |
   |   layers, etc.)      |
   +----------------------+
               |
               v
   +----------------------+
   |  Model Training      |   <-- Learn from patterns
   |  (adjust weights)    |
   +----------------------+
               |
               v
   +----------------------+
   | Pretrained LLM Model |   <-- The cake
   |  (billions of params)|
   +----------------------+
               |
               v
   +----------------------+
   | Fine-tuning (optional) |
   |  (chat, safety, tasks) |
   +----------------------+

What’s so cool about this recipe, then?

Before transformers, AI models read text like a person with severe tunnel vision: one word at a time, in strict order, constantly forgetting what they'd just read.

Imagine trying to understand this sentence by only looking at one word at a time, left to right, while immediately forgetting the previous word. By the time you got to "sentence," you'd have no idea what "this" referred to. That's basically how old AI models worked, and it was about as effective as it sounds.

Transformers changed that.

They changed everything with a mechanism called self-attention. Instead of reading word by word like an anxious student, transformers look at the entire sentence at once and figure out which words are most important to each other.

Example: when a transformer sees the word "it" in a sentence, it doesn't just blindly move on. It looks back at all the previous words and calculates which one "it" most likely refers to.

The transformer figures this out by analyzing patterns it learned from billions of text examples

Why do transformers matter so much?

Here’s what it unlocked:

• Better comprehension: models that understand nuance, ambiguity, and context

• Scalability: parallel processing means training can go faster and bigger

• Generative superpowers: once trained, transformers can generate surprisingly fluent, coherent text

Without transformers, there is no ChatGPT. No Claude. No Gemini.

The transformer architecture is the foundation that made the current AI revolution possible. It's the reason your AI assistant can remember what you asked three messages ago and write coherent paragraphs.

The next time someone mentions GPT, remember that little "T" at the end.

It represents one of the most elegant solutions in computer science: the idea that to understand language, you need to pay attention to everything at once, to get the nuances, just like humans do.

Cool right? I thought you would think so.

Here are two of the best resources if you want to go deeper:

• this amazing youtube video explaining what is going on inside a transformer

• this excellent dynamic article shows it in action with visuals and real examples (some of which we used here)

-Reading list- 

1. MIT - Five Trends in AI and Data Science for 2025

What I think is interesting about this MIT trends review is that it focuses on business trends, not technology trends.

Most of the news out there tends to focus on what kind of technologies will be launched and their capabilities. But technology is nothing without adoption; this is why I find this report useful.

It focuses on trends related to how businesses are valuing/getting value from AI. And the reality is: value is still locked.

Two main things for me come out of it:

• People, culture, and the development of “technical” skills will continue to be the major barrier to value

• Data quality is more valuable than ever, and this relates to the next reading article

2. Tomasz Tunguz - Why Data is more Valuable than Code

Tomasz has always published some interesting articles. He's making a super important realization:

• SaaS companies with well-structured, clean, and labeled data are in the best position to build valuable AI features.

• AI performance is closely tied to the quality of the underlying data.

• Without good data, AI features can be weak, unreliable, or even harmful to the user experience.

We are back to the “data is the new oil”, as AI is only as good as the data it learns from.

Clean, structured data unlocks value. Messy data limits what AI can do.

-Fun with AI-

Creating small applications with Claude Artifacts

In the spirit of vibe coding of today’s edition, let's take a look at the new artifacts from Anthropic, released last week:

You can now create and publish mini AI apps directly from Claude.

This is awesome!

You can create pretty much anything (simple) that comes to mind.

1. Go to Claude

2. Go to Artifacts

3. Prompt the app you want to create

Here is one I did:

It’s a simple app that explains concepts using ASCII art to diagram ideas.

You can make the app public. Check mine here.

Below, an example of it explaining photosynthesis.

People are going crazy with ideas.

One that I liked is this drum beat machine.

This is it! Thanks for reading today's edition. Don't forget to review it below.

-Any feedback-

Before you go, I’d love to know what you thought of today's newsletter so I can improve it for you. 🙃