How I Monetized Free Content Through T-Shirt Sales

Why T-Shirts?

The big advantage of T-shirts over adst or sponsored links is that they let the community support us directly: the better of a job we do with the data, the more people hear about the survey, and the more sales we can expect. There's really something to be said about this kind of very direct feedback loop.

Of course, T-shirts are also fun to design and wear. Nothing would make me prouder than attending a tech conference and seeing someone wearing a shirt I designed myself! In fact this whole thing originally got started when I designed a T-shirt for the dotJS conference last year.

Finally, shirts also offer a path to long-term monetization: assuming we manage to release a new shirt for every new survey, we can imagine having enough past designs down the road to set up an online shop that keeps bringing in a little cash over time.

The Shirt

If you've taken the survey and then checked out the results, you might have noticed that the color schemes for both sites are a little different. That's because midway through the project, I realized that the previous color palette just didn't work for a T-shirt design. The colors felt too weak and washed out, and just didn't "pop" when applied to the charts.

So after a lot of trial and error, I came up both with the new 80s-style, synthwave-inspired color scheme, as well as the new logo and T-shirt design.

I knew from the start that I wanted the shirt to be more than a pretty design. I love shirts that have "Easter eggs" or extra info that can serve as conversation starters. At the same time, it's easy to overdo it and veer into cheesiness territory.

So I made a big list of all the CSS techniques I knew, and then looked for a couple more (the "blob" technique was certainly new to me), and applied them to various geometrical elements before adding annotations to explain each of them.

Note that I "cheated" in a way, as the actual image used for printing is a vector render made with Figma. The logo on the site, on the other hand, is 100% rendered with CSS, and the result is fairly identical.

Printing & Shipping

I also knew from the start that I didn't want to handle logistics myself. I live in Japan in a tiny apartment, and I had no intention of dealing with stacks of cardboard boxes for months (not to mention the cost of shipping worldwide from Japan).

Thankfully there are quite a few services that will not only print your shirt, but also ship it to an address of your choice. I picked Printful because they had the best mix of price, shirt variety, fast support, and good dashboard UI.

They also had a ready-made integration with Gumroad, which made accepting payment for the shirts pretty easy (although I do wish Printful would offer their own shopping cart system to simplify the process even more).

The Process

Here's what actually happens when you order a shirt:

1. You pay Gumroad $24 plus shipping.
2. Printful receives the order and prints the shirt, charging my PayPal account anywhere from $15 to $18 depending on shirt size, as well as $5-$10 for shipping depending on country, and also $4 for VAT in some cases.
3. At the end of the week, Gumroad transfers all earnings to my PayPal account.

A few things to point out here. First, while Printful charges my account immediately for every order that comes in, Gumroad only transfers the money at the end of the week. Which means that if you're not careful and get a large amount of orders, you might end up depleting your account completely, being unable to pay for further orders — or even buy groceries!

Also, I was caught completely by surprise by the VAT that applies to purchases shipped inside the EU. Thankfully we set our per-shirt margin to a large enough amount that we don't lose money on EU orders...although in some cases we barely break even!

The Numbers

Here's the part you've been waiting for. As of June 26, we sold 263 shirts, for a total of $7,690 in revenue.

We won't get all the money into our PayPal account though, as Gumroad takes a 3.5% fee plus $0.30 per sale, for a total of $348.

This gives us $7,342, but of course we need to pay for the actual shirts, and that expense amounts to $6,083.

So when all is said and done, our benefits amount to $1,259 or an average of $4.78 per shirt (we also gave away a few freebies to friends, which drags the average down).

This is not huge by any means, and if we were charging consulting rates it would barely pay for a day of work for both of us. But that's not really the point. What's important is having successfully tested out a new monetization channel that doesn't require tracking, retargeting, or generally annoying our readers, and that is also fun to put in place!

Sponsored Links

In the interest of transparency, I should mention that we also have sponsored links at the bottom of some pages. Sponsored links are like ads, with two important distinctions:

1. We handpick the advertisers to try and feature links relevant to the topic at hand (courses, tools, resources, etc.).
2. Those links are purely static HTML links, and include no tracking beyond standard "utm_source" tags.

I'm not going to go into a per-link breakdown, but overall our sponsored links for State of CSS have brought in about $2,200.

This is a lot more than the t-shirt for far less work, but it's also not quite as creative… In any case I'm a big believer in diversifying revenue sources, so we'll keep experimenting as we go!

And if you're keeping score at home, this means a total of about $3,400 in income overall for the whole project, or $1,700 per person since there's two of us. Now the only question left is Ferrari or Porsche...

Nerdy Zapier Stuff

A little extra for the road: because Gumroad doesn't forward customer info to Printful, Printful had no way of notifying them of their tracking number once their shirt was shipped.

Thankfully, it turns out we can solve that with the always-awesome Zapier!

The process involved setting up two zaps (a Zapier workflow). The first one is fairly simple, and just exports every Gumroad order (in this case, just the name and email fields) to a Google Sheets document.

The second zap includes the following steps:

1. A Printful order is fulfilled
2. Zapier takes the order name (which Printful does have, unlike the email) and looks up the corresponding email in the spreadsheet.
3. Zapier takes the tracking info (which Printful thankfully also communicates to Zapier) and uses it to fill in an email template, which then gets automatically sent to the email address looked up in step 2.

I could probably get rid of this extra workflow (and save on that 3.5% Gumroad fee) by setting up a simple Stripe-integrated front-end for Printful, but for now this system works great.

Conclusion

In conclusion, let me leave you with these three brilliant takeaways:

• Making T-shirts is fun.
• Monetizing stuff you're giving away for free is hard.
• More revenue sources = more better.

So we're not getting rich any time soon, but at the end of the day it doesn't matter. Although, if you want to put in an order for a few thousands CSS-themed shirts, we won't say no. 😉