Developer marketing examples

How to write a "What is {MY CORE KEYWORD}" article that gets to the top of HackerNews? 👇

First of all, almost no one succeeds at that as you write those articles for SEO distribution, not HN distribution.

To get an SEO-first article on HN your content quality bar needs to be super high.

But you can do it.

PlanetScale managed to get their "What is database sharding and how does it work?" on the orange page (kudos to Justin Gage!).

Here is what was interesting about that article:

𝗦𝘂𝗽𝗲𝗿 𝘁𝗼 𝘁𝗵𝗲 𝗽𝗼𝗶𝗻𝘁 𝗶𝗻𝘁𝗿𝗼.

• ❌ No "In today's fast-paced data-driven world enterprises work with data" stuff.
• ✅ Just  "Learn what database sharding is, how sharding works, and some common sharding frameworks and tools."

𝗛𝗶𝘁𝘁𝗶𝗻𝗴 𝗸𝗲𝘆𝘄𝗼𝗿𝗱𝘀 𝘄𝗵𝗶𝗹𝗲 𝗯𝘂𝗶𝗹𝗱𝗶𝗻𝗴 𝗿𝗮𝗽𝗽𝗼𝗿𝘁 𝘄𝗶𝘁𝗵 𝘁𝗵𝗲 𝗱𝗲𝘃 𝗿𝗲𝗮𝗱𝗲𝗿.

💚 Speaking peer to peer, not authority-student:

• "You’ve probably seen this table before, about how scaling out helps you take this users table, all stored on a single server:"
• "And turn it into this users table, stored across 2 (or 1,000) servers:"
• "But that’s only one type of sharding (row level, or horizontal). "

𝗨𝘀𝗶𝗻𝗴 𝗷𝗮𝗿𝗴𝗼𝗻 𝗮𝗻𝗱 𝘂𝗻𝗱𝗲𝗿𝘀𝘁𝗮𝗻𝗱𝗶𝗻𝗴 𝘆𝗼𝘂𝗿 𝗮𝘂𝗱𝗶𝗲𝗻𝗰𝗲

Things like:

• "Partitioning has existed – especially in OLAP setups"
• "Sifting through HDFS partitions to find the missing snapshot "

𝗔𝗰𝘁𝘂𝗮𝗹𝗹𝘆 𝗲𝘅𝗽𝗹𝗮𝗶𝗻𝗶𝗻𝗴 𝘁𝗲𝗰𝗵𝗻𝗶𝗰𝗮𝗹𝗹𝘆 𝗵𝗼𝘄 𝘁𝗵𝗶𝗻𝗴𝘀 𝘄𝗼𝗿𝗸

🔥 Look at the section "How database sharding works under the hood" with subsections:

• Sharding schemes and algorithms
• Deciding on what servers to use
• Routing your sharded queries to the right databases
• Planning and executing your migration to a sharded solution

🎁 𝗕𝗼𝗻𝘂𝘀: 𝗽𝗹𝘂𝗴 𝗶𝗻 𝘆𝗼𝘂𝗿 𝗽𝗿𝗼𝗱𝘂𝗰𝘁 𝗴𝗲𝗻𝘁𝗹𝘆

Section "Sharding frameworks and tools" shares open-source tools (every dev, but HN devs in particular like OS projects).

And there as an info box, you have the info that Planetscale comes with one of those OS projects deployed.

Just a beautifully executed piece of content marketing.

Simple yet powerful CTA in the navbar resources section.

The resources section in the navbar is mostly navigational. Well, the entire navbar is ;)

But you always have that one action that is more impactful than others.  

💚 And I think that a Plauground  is a great option. You get people to see how your product works. You let people play with it and see for themselves.

Not many next actions can be as impactful as getting people to experience the product.

Especially if you are a heavier infra tool that people cannot really test out in that first session. I mean, you won't really create a realistic example of your core database in 15 minutes to see how that new tool that you just saw works.

🔥 Making this CTA "big and shiny" and showing a glimpse of what will happen after clicking is great too.

🤔 2 changes I'd test out:

• Making the copy more descriptive performs better.  Like "Launch playground", "Play with Sandbox", or something around "Run an example project/app/environment".

• Showing something more exciting about the product (or playground/tour) on that visual

But the core idea behind making the playground your core navbar resource section CTA is just great.

This is a cool story coming from the GOAT of all docs. They added a signup button to their header and the conversions and revenue followed.

All they did was added a "Create Account" button and saw a huge jump in conversions.

Interestingly, Peggy shared that when they added it to Apollo GraphQL docs, signups went up by 20%.

It sounds like a good thing to try out.

How to do a dev-focused brand video and get 10M+ views?

Making a memorable brand video is hard.

Doing that for a boring tech product is harder.

Doing that to the developer audience is next level.

Postman managed to create not one but three of those brand videos that got from 4M to 10M youtube views.

The videos I am talking about are:

• "I am gonna push some buttons"
• "Together"
• "We did this"

So what did they do right?

• They are all short playful stories touching on values coming from a centralized API platform.
• They hint at the motif of space which is a clear part of Postman's branding
• They do show the actual UI of the product

Honestly, I am not exactly sure what special sauce they added but those are just great videos that you watch.

And I definitely remember them and the company which is exactly what you want to achieve with brand ads.

Scrolling through many feature/capability sections of a dev tool website mostly sucks. But dropping things to make it shorter can suck even more.

This is a cool design pattern that deals with that problem.  

Single section that switches subsections on scroll. And folks over at @Graphite did a great job with that on their homepage.

It works like this:

• as you scroll the progress bar moves to make it clear what is happening right away
• eventually, as you scroll down, the subsection switches to the next one
• each subsections has a headline + one-liner description + call to action + a visual

Also, I saw variants of this that also looked great:

• without the one-liner or Learn more
• auto progress/section switch if you don't act

What this design helps you achieve is:‍

• you get to show many features/capabilities (Graphite showed 5)
• the site feels shorter than it is and you don't feel as tired/lost as you scroll
• because it is all interactive it is easier to drive your attention to a section header

I really like this pattern and I have already recommended it to some folks working on their sites recently.

One of the best types of developer content is a debugging story.

"What is X" or "How to solve Y" work in some situations, especially when you focus on SEO distribution. But a good debugging story is something that even senior devs want to read.

This is an old article from the GitLab and is such a good example of thos format:

• Set the scene: Say what happened, what results you managed to get, and introduce the problem. Skip the fluffy intro and invite devs into the story
• Go deep into the problem: show what happened and go into technical details. Address the obvious solution that unfortunately didn't solve the problem. Showing profilers, charts, UIs. Make the problem more concrete.
• The journey: explain what you tried, how it failed, and what you learned, go technical and detailed. Take people on that journey
• Close the loop: Close with a win, show the improvements/results, summarize what you learned

The downside of using this format is the same as with most good developer content. You need a real situation, explained by an actual dev in a technical language.

Explain a concept clearly.‍

Good visual with concrete numbers makes this example easy to understand.

Because it is beautifuly explained people want to share this with their network to be perceived as helpful (and smart).

There are a lot of boring vendor t-shirts at conferences.

And they get boring results.

I like this bold design from GitGuardian:

• they go for anime which is loved by many devs
• it feels and looks like an anime t-shirt, not a vendor t-shirt
• they use their core message "Keep secrets out of your source code"

Nice.

One of the top-performing conversion flows in dev-focused articles.

"Aside CTA" in the "How to do {jobs to be done}" article.

You know the drill:

• Explain how to X without your tool
• Add an "Aside" CTA showing that it can be done with your tool

And Export SDK executes it (almost) perfectly:

• They subtly move you from article to CTA but show that the article ended
• They explain what the tool does and what the offer is
• They show a visual of how the tool solves it
• And they give you a clear link to click

One thing that could be tested and changed is putting this "Aside CTA" mid-article and not at the end (tip from Martin Gontovnikas).

A good thing to try if you are running the "How to do {jbtd}" article strategy.

The problem with presenting API is that it is hidden. It gets the job done in the background.

So it is not "attractive" in the way some other dev tools can be.

But you can:

• show the end result and how it gets the job done.
• show how easy it is to use.
• let people play with something interactive to make it real.

That is how Mux, video API, solves it.

Found this awesome crossover on their homepage.

They give you:

• devvy language that just says what it does without high-level fluff
• code, input/outputs
• end result of your API call, to make it real
• demo to get the feel real-time

Love it!

It's a nice template for ads on socials.

So you have:

• Value
• Testimonial about the value/benefit
• Person
• CTA

Ideally, I'd make it dark to stand out in the feed and make the CTA about that value as well.

But still, great ad imho.

Testimonial ads are a format that helps you move people from "I know what you are doing" to "I trust you enough to do business with you".

Video testimonials are even better.

You see the person who has a similar role that you do saying things about the product you are considering.

CircleCI did a solid job here.

And so if you are running remarketing to people who went to pricing but didn't sign up, or signed up to a free trial but haven't converted yet this is a good format candidate.

Just watch it.

I like those sidebar CTAs from Auth0.

They go with a sticky Table of Contents which gives a better reading experience.

They put two CTAs below that TOC:

• "See docs" presented in a very subtle, very developer-friendly way
• They put a more aggressive banner but it is still on the tasteful side.

Solid job.

Make a {X} cry in 5 words or less.

Great Linkedin (or Twitter) post format.

This is one of those fantastic self-selecting mechanisms as well.

People who understand the joke are the people you are looking for.

You may get the exact people you want to follow your profile.

With a nicely targeted joke.

Love it.

A great example of a dev-focused Linkedin post format from Khuyen Tran 👇

What I like about this:

• It stands out in the feed with a pink background
• It is helpful and visual. Shows the code and result of the code in one view.
• I know right away what the post is about and why I should "... see more"
• It is a format that can be reused for many scenarios

Just great job!

Simple and powerful messaging.

They say what they do. Zero fluff.

They make it easy for devs by explaining how they are different than (obvious) competitors.

They add a little developer-focused social proof.

Well done templates gallery from Vercel.

For developer-focused products, having an examples/templates/code samples gallery can be a powerful growth lever.

✅ It helps people:

• understand what you do
• see if anyone did what they want
• get started with something real-life(ish)
• get a feel for a product without committing to it yet

Just a great touchpoint in the developer journey.

💚 And Vercel does this one really well IMHO.

They start with an easy-to-find CTA in the navbar resources section. Bonus points for adding one-liner descriptions that make it clear what is on the other side of the click.

On the templates library page, they give you solid use case navigation with tags. And each template tile has a result thumbnail and a one-liner description. The beauty of this is in the simplicity and what they didn't put in here.

Each template page shows the result, gives you a tutorial on how to use this, and clear CTAs to either see this live or deploy yourself. Bonus points for the "Deploy" action copy (instead of "Sign up").

Kudos to the Vercel team. They are one of my favorite inspirations.

How to get people to sign up for your office hours?

Why not put it on your docs homepage?

Btw, I really like the concept of office hours.

• You give people the option to "get a demo" and answer their questions
• But you don't make them schedule anything, they can just come (or not)

You get your devrels or product to do those weekly and then you just have to figure out how to get people there.

Classic options are to put info in onboarding sequences, in the app, or on the website hello bar.

But Flatfile had another idea. They put it in their docs homepage header.

I find this idea brilliant as many people who browse your docs (especially for the first time) are in that evaluation mode and would actually want to do that.

Plus calls to action in the docs get more respect by design ;)

Algolia gets over 80% of referral traffic from a single free tool they created called Search Hacker News.

But why does it work so well for them?

Hacker News doesn't really have a native search experience.

Algolia gives devs an amazing search experience out of the box.

So folks from Algolia created their own website where you can search Hackernews... with Algolia search engine.

Of course, when you click on "Search by Algolia" you get directed to the website and can learn how to set up a similar search, which you have just used yourself.

What I love about this:

• solves a real problem for the audience Algolia is after (many software devs read hacker news)
• it shows rather than tells how Algolia's search works. And it works amazingly.
• it feels almost like an extension of HackerNews with the same brand colors and design.

And looking at the results it delivers.

"How fast do you ship?"

Not many dev tools answer that on their homepage. PostHog does.

In a typical (enterprise) sales process, people often ask:

• what is on your roadmap?
• how fast do you deliver new features?
• what has your product progress been like last year?

And you show them the roadmap or get someone from the product on the next call.

But I haven't yet seen dev tools talk about it on their homepage.

But why not?

Devs who want to buy self-serve want to know it almost just as much.

After all, they won't be able to twist your arm to build that custom feature cause "we are your biggest client and we need it".

I like it, it builds trust, it shows me you are transparent,

And it shows me that those features I can see on the public roadmap will come true.

VS competitor ads are hard to pull off with devs. Not impossible though. 👇

So the problem is that:

• You want to list problems people have with the competing tool.
• But you don't want to come off as too negative and aggressive.
• And you want people to not think those are just "some bs claims to sell your tool"

@Convex does it really nicely here:

• They start positively by acknowledging that some people do "Love Firebase"
• They tag the competitor to build trust in the claims they are making
• They list problems people have with the competitor explicitly in voice of customer: "request waterfalls", "weak react support", "managing end-to-end consistency"
• And they link to a deeper vs competitor page for details

And even though this is by a "aggressive" competitor marketing hundreds of devs liked/bookmarked this tweet.

Good job!

This is a nice little touch in the last step of the signup process.

Linear asks you to do two things:

• Subscribe to the newsletter with updates
• Follow-up on their main social channel

The beauty of it is while this is an ask it is done so gracefully:

• balances promotion with value for the user
• It is explicit in what it asks for and explains each ask with a one-liner
• makes the ask small enough that it makes sense to be an "impulse buy"
• the CTAs are clear -> not only "follow us on Twitter" but also gives you their handle

Nice and simple and I am sure it gets some folks to subscribe/follow.

This is a solid swag copy template that resonates with devs.

"I did X and all I got was this lousy Y"

Why this works imho is:

• it is snarky
• it is a little self-deprecating
• it brags a bit about the work/expertise

Very solid start if you run out of ideas.

This is how you write dev tool JTBD blog posts.

Masterclass of writing this type of content from @WorkOS imho.

Deep 2000 word guide that explains how to add webhooks the your application.

Goes into examples, best practices, everything.

One thing it doesn't do?

It doesn't push the product left right and center.

In fact, the only CTA is hidden in the very last sentence of the very last section.

Why?

Because most likely, the reader's intent is around understanding the problem at this point.

They want to understand what adding webhooks to their app really means from the practitioner's standpoint.

And they did that beautifully.

Could you have pushed the product a bit more? Sure.

But by answering the actual questions devs came here for they managed to build trust.

And I am sure got their fair share of click-throughs and signups anyway.

I like the simplicity of this announcement.

What: "Vercel Edge Middleware"

Why: "Start delivering dynamic, personalized content without sacrificing end-user performance."

Visual supports this but is super minimal.

Not sure how to find developers for audience research interviews?

Sometimes all you need is ask.

I really liked what the founders of this startup did:

• Found relevant subreddits where folks working in MLOps/DevOps and ML are (for example r/mlops)
• Clearly explained why they wanted it: building a startup and doing exploratory analysis
• Clearly explained what they wanted: interviews with mlops/devop/data scientists
• Clearly explained what they will give for it: cash, as simple as that

Sometimes you don't need to overthink it and can just ask.

Share an idea about a new concept.

Explain the concept in simple terms.
Back it up with a visualization.

I like the "hand-written" style of this viz that makes it less formal.

‍

‍

‍

Why not highlight your free plan?

Most companies highlight their middle paid plan saying it is "most popular".

First thing, yeah, sure it is your most popular plan.

But more importantly, most visitors will not convert to your paid plans right away.

So why not try and capture as many devs as possible on the free plan?

If they like your dev tool there are many things you can do to convert some of them to paid plans.

But if they leave that pricing page and go with some other free tool, you are not converting anyone.

@CircleCI highlights free and they are in the mature, competitive market of CI CD tools.

Idk, it really does make a lot of sense to me.

If people need more advanced features they will choose higher plans anyway.

But if they want to get things started with the basic plans they will choose free or go elsewhere.

I'd rather have them choose free than none.  

Devs have a love/hate relationship with "Book a demo" call to action.

Mostly hate though.

Especially if what they want is:

• know what they will be paying for your tool
• just see a golden path of how this thing works

Let's just say that sitting through an hour demo call with a salesperson just to get the pricing is not what most devs love to do with their time.

But there are moments in the buyer journey when devs do want to have that live session:

• they tried it, went through the golden path, and have deeper questions
• they know they have specific needs and are unsure/couldn't find it in your docs/website.
• they want to customize the pricing plan to their needs.

Then, having a live session/demo is the fastest way to move forward.

@PostHog handles this dev journey reality nicely with:

• recorded, ungated product demo -> if you want a generic demo just watch it
• transparent pricing and a free plan -> don't need to sit through the demo to ask for price
• if you want a custom demo or just talk to a human -> just schedule a call

This approach solves both scenarios really nicely.  

Using memes in the product release.

If you understand your ICP (in this case open-source backend devs) it may be a great idea.

An additional benefit is that people may share a meme... that actually has a link to your announcement.

People want to be valued by their tribe.

One of the ways to do that is by being helpful.

So they want to share things that have a "smell" of insight.

Tool stack/workflow/pipeline chart makes them feel that way.

‍

What to put in the header when your dev tool does a lot?

I like how Appsmith approaches it.

In their case, they have multiple use cases they want to showcase.

But you could use the same idea for many features or products.

Show multiple clickable tabs:

• It invites the user to click and see.
• It hints at all of those different use cases
• It doesn't overwhelm your audience with too much info

A bonus idea is the "Try cloud" | "Self-hosted" CTA.

It communicates right away that you can deploy that dev tool anywhere.

If the self-hosted deployment is important to your customers let them know.

You don't want them to look for it and drop from the page trying to find the FAQ.

Sometimes your pricing is just complex. But you can still make it work.

If you want devs to convert, make it possible for them to estimate the cost.

@Mux does it nicely with a calculator:

• They give sliders for dimensions that are obvious to the dev
• They give (pre) select boxes for things that are a bit less obvious
• They show additional costs
• They give you a clear final price estimate

What is crucial is that the calculator dimensions need to be understandable and familiar to the reader.:

• If you use expected industry concepts (view count, upload, users) you should be fine.
• If you use weird obscure concepts the best calculator will not help.

The goal of this is to make it possible for a person to get an estimate right here right now.

Not have to setup a meeting with half the team to figure your pricing out.

In a mature category, it is safe to assume that people know about other tools.

Especially devs.

I love how Axiom owns its unique selling point and how it stands out from the competition.

• They explicitly say how much more scalable they are vs well-known brands like DataDog, Splunk, SumoLogic, and others.
• They don't pretend to be the only company in the observability space.
• They just own their unique selling point and make it easy for people to understand why choose them not others.

Takes guts but I love it.

I love this video ad format from Hygraph.

They are reading and reacting to bad reviews.

I saw this in B2C but not in the dev tool B2B. Love it!

So basically how they did that campaign is:

• The marketing team finds bad product reviews.
• Most of the reviews are technical and speak about some features.
• Their employees (at least some devs in there) read them out loud on their phones.
• They react to the reviews, typically explaining what the product does and why.
• They serve it as YouTube short ads and link to the whole 5-minute video on their channel.

Through all that, you get entertained and learn something about their product. This is such a fun format to test out!

Handing #1 dev obstacle: "We can do it ourselves".

Check it out from second 0:35:

‍"I bet you're like
We can do it ourselves, it's not that hard.
We know what we're doing.

First, I hear you.
Second, are you sure?"

This is mastery.
Pointing out ignorance without alienating people.

Make it about belonging.‍

Something some people can deeply connect with.
Nostalgia is a very strong emotion.

It feels good to be a part of something as well.

Thinking about your next conference giveaway idea?

‍How about a coconut? Datafold did just that!

Coconut + logo burned on it + a person who can open them up

=

A memorable, shareable, fresh (literally), and wholesome conference experience.

And I bet it didn't cost an arm and a leg too.

It goes to show how creativity matters when planning those things.

Thinking about doing a similar thing in Poland... with potatoes of course ;)

Good format of the tweet copy.

Start with the hook.

Then validate it with more story.

Then open a knowledge gap with a thread.

Gonto shared an interesting play that they tried at Auth0 when he was running growth there.

So the story goes like this:

• They wanted to increase brand awareness of Auth0.
• They found influencers who were maintainers of open-source frameworks that had landing pages.
• They went to them and offered to redesign these landing pages for free.
• The trick is they redesigned it in the same branding (colors, patterns, layout) as the product (Auth0).
• That made people think those are related (even though they weren't) which increased the brand perception of Auth0.
• They also asked the influencers/maintainers if they could add retargeting pixel to the redesigned site.
• Which helped them serve relevant ads to visitors of those open-source frameworks.

I think that doing just the sponsorship for the retargeting pixel could work.

But when you add that branding consistency between the sponsored site and the product the CTR is better.

Interesting one for sure.

If you want to get your post to do well on HackerNews you may want to break some "marketing rules" you'd expect to work elsewhere when it comes to titles.

And the titles are really important on HN.

People will start a discussion and fight viciously on both sides of the argument without even reading the article.

I even tested it one time by putting an article "Why people on Hacker News comment without reading" on HN. It went to the first spot in 5min and got a few people talking before it got flagged ;) The article obviously had nothing in it. Just an ask for people who clicked out not to comment saying it was empty.

The point stands though. Titles are crucial imho. They set the tone. Good titles give you a better chance.

And no, in this case, Karma didn't play a role here:

• ssivark 5804 Karma got 2 upvotes
• gregsadetsky 5625 Karma got 3 upvotes
• stefanpie 1223 Karma got 219 upvotes

What I think mattered was the titles. Very similar theme but a vastly different vibe.

• "Your Paper Is an Ad" is punchy, authoritative
• "How to Get Your Paper Accepted" is actionable, authoritative
• "Getting a paper accepted" is understated, builds curiosity, it feels like a story

Imho this is what happened here. The Hacker News crowd lives on good hacker life stories, on feeding curiosity. On titles that don't feel like a marketer would post.

So when in doubt go understated.

btw I have a good story of helping an infra startup get to the top of HN Show if you are interested. Added a bunch of links to resources/learnings in there too: https://www.markepear.dev/case-studies/glassflow

Funny and memorable competitive billboard ad from @Statsig 👇

You have a big incumbent, everyone knows them. Use it to anchor your brand.

And tell the story of how you do things differently.

👀 But first, make people see you. And remember you in the next conversation when the big known brand or a category comes up.

And being funny is one of the best ways of getting attention and being remembered.

💚 I love how folks from Statsig did it here. Such a playful pun on the feature flag category incumbent Launch Darkly. Job well done.

Btw, this was shared by Oleksii Klochai in the Developer Marketing Community (you joined yet?).

In dev tools, you really can solve the problem for a narrow market and extend to adjacent markets over time.

‍Use that -> Snyk did.

Their value proposition stayed pretty much the same for 7 years!

"Find and fix vulnerabilities in open-source software you use."

But the market they served got so much bigger over time:

• They started super narrow with just one Javascript framework, Node.js
• They focused on solving that pain very well before moving to the entire Javascript language
• Then to other popular languages like Ruby, Java, and Python
• Then to the entire Open Source dependencies
• Then fast forward to today and they do Open source + containers +IaC

Again, their core value prop is the same in 2023 as it was in 2016.

But their target market (and revenue share) grew by... a lot ;)

Isn't that just beautiful marketing-wise?

So the takeaway is this:

Start narrow, solve the problem, and extend to other frameworks/languages/tech can still work.

The homepage header is about landing your core product message.

For Modal it is basically LLM infrastructure with great developer experience.  

And they do a great job delivering it:

• Input/output visual: I think for infra products this is a great choice.  Show what code you run, show how to run it, show what you get. Ideally, this all looks nice and easy.
• Headline/subheadline: They explain "what is it" and "for whom is it" (or what use case): "what": Serverless infra platform, "whom" ML teams.

• Great calls to action: If you don't know what to put this is the best baseline imho. Get started (Signup) and Docs.

• Social proof: devs want to know if others like them and/or respectable companies use it in production. While dev testimonials do that better, logos is what people expect to see here. Don't have them and you raise flags, especially if you are unknown.

• Branding: if you can make your page/company memorable on top of landing  that message -> great. And with that green gradient and uncommon colours they definitely do.

Top job on that header folks!

This is one of the more devy blog designs I've seen in a while.

It has this docs-like feel.

But is just a bit more fun and loose than most docs would allow.

Here is what I like:

• smells like there could be value with code all over the place
• shows visuals taken from another devy channel, Twitter/X
• hints at social proof through Twitter/X engagement

And if your posts are code-heavy, then a docs-like experience is where you want to be anyway.

But you can spice it up with things that wouldn't fit the docs.

Like a Twitter/X embed or a meme.

Need one more call to action idea for your dev tool blog?

How about starting an article with it?

Sounds weird but if done right it can work. Even with devs (or maybe especially with devs).

Earthly did and they are known for great dev-focused content.

Ok, so how does it work?

You start your article with a contextual call to action where you explain:

• Who you are and what your product does
• And how that is relevant to the content of the article
• Link out to more product-focused pages, ideally relevant to content

And then you let people read.

Those who find the topic important will remember you and/or maybe click out to see more.

I like it. It's explicit, transparent, and actually noninvasive.

Devs like diagrams.

When you explain a complex concept in one diagram it is just very shareable.

If you are interested in reading more there is an entire "blog post" when you click see more.

Just a very solid content format.

Mixpanel primary CTA is to take an interactive tour.

They take you to a 30min video + a guided UI tour.

Not a signup.

That is because with products that have long time to value (like analytics, observability etc) dev will not see value in the first session.

I mean to really see value you need to see real data, real use cases. And if you were to actually test it would take weeks.

That is why many companies do demos. But demos have their own problems (and most are bad).

Interactive tools make it possible for me to explore the value without talking to anyone.

I love this option.

Nice way to show code and results straight from the React docs that people love.

And this pattern can be used outside of the docs for sure.

Anyway, a classic situation:

• you want to show the code
• you want to show the result of that code
• you want to let people play with the code/results
• you want to make it easy to read and copy/use  

And folks behind React docs solved it nicely by:

• Giving you a spit screen of code and results
• Not showing the entire code but giving you the option to "show more"
• You can change the code and see the results change (and errors pop up)
• You can use buttons to reset the example, copy it, or fork on CodeSandbox

Not groundbreaking maybe but a beautiful implementation that is just a delight to use.

I really love this hand-drawn feel.

It makes it super authentic.

Also, starting from scratch (not a ready diagram) makes following it more fun and less overwhelming.

Great stuff.

BTW the tool used for this is called excalidraw.com

𝗛𝗼𝘄 𝘁𝗼 𝗰𝗿𝗲𝗮𝘁𝗲 𝗴𝗼𝗼𝗱 𝘁𝗲𝗰𝗵𝗻𝗶𝗰𝗮𝗹 𝗰𝗼𝗻𝘁𝗲𝗻𝘁 𝘁𝗵𝗮𝘁 𝘁𝗵𝗲 𝗛𝗮𝗰𝗸𝗲𝗿 𝗡𝗲𝘄𝘀 𝗮𝘂𝗱𝗶𝗲𝗻𝗰𝗲 𝗹𝗶𝗸𝗲𝘀?

The general tip is simple. Create content that the HN audience finds interesting.

𝗧𝗵𝗮𝘁 𝘁𝘆𝗽𝗶𝗰𝗮𝗹𝗹𝘆 𝗺𝗲𝗮𝗻𝘀:

• Something that feeds curiosity (how does X work, why did Y happen, what is it like to do Z)
• Something real, transparent, and written in first person (real stories)
• Something technical and focused on the dev or founder crowd

But how do you actually do that?

𝗢𝗻𝗲 𝗼𝗳 𝘁𝗵𝗲 𝗽𝗹𝗮𝘆𝗯𝗼𝗼𝗸𝘀 𝘁𝗵𝗮𝘁 𝘀𝗼𝗺𝗲 𝘁𝗲𝗰𝗵𝗻𝗶𝗰𝗮𝗹 𝗳𝗼𝘂𝗻𝗱𝗲𝗿𝘀 𝗱𝗲𝗽𝗹𝗼𝘆𝗲𝗱 𝘄𝗮𝘀 𝘁𝗵𝗶𝘀:

• Get your technical founder or core developers to write articles
• Those articles are focused on the technical challenges of building your product
• Again, don't write what your product does but rather how you build it. Mistakes you made, ideas you tried, technical challenges you had to overcome.
• Share real value with that dev audience. And to give people real value, you need to have folks who actually understand their problems. Those are typically senior devs/founders.
• You will inevitably hint that you are building a product and the folks who are interested in your product and you will go deeper.  

That was exactly what folks from CockroachDB did at the beginning.  Heard about it on one of the episodes of the Unusual Ventures podcast with Peter Mattis from Cockroach Labs.

𝗘𝘅𝗮𝗺𝗽𝗹𝗲𝘀 𝘁𝗵𝗮𝘁 𝗵𝗶𝘁 𝘁𝗵𝗲 𝘁𝗼𝗽 𝗼𝗳 𝗛𝗡:

• "CockroachDB Stability Post-Mortem: From 1 Node to 100 Nodes"
• "Serializable, lockless, distributed: Isolation in CockroachDB"
• "How CockroachDB Does Distributed, Atomic Transactions"
 
Kudos Cockroach Labs team and thanks for sharing!

Looking for a good dev-focused case study format?

People tell you to follow a classic Hero > Problem > Solution > Results.

They tell you to show numbers, talk value, etc.

And it is true. Great format.

But packaging this for devs is hard.

For example, putting numbers in there, and framing it in a "save 28min every week" is a recipe for losing trust with that dev reader.

That is if you can even get those numbers from your customers.

I like how @LaunchDarkly solves it.

Hero section:

• Change that customer saw (no numbers needed)
• Additional description of the use case (this seems to be optional for them)
• Before and After boxes with bullets (no numbers needed)
• Clear customer logo

Case study body:

• About: one paragraph about the company and use case
• Challenge: why they started looking for a solution
• Solution: why they chose their product
• Results: what they got from it
• They kept it short and focused on the team leader imho

They keep the content down to earth and devy but still frame it in a value-focused way.

I like that that they speak in the currency that devs care about.

Wasted time.

Before: "Took 2-3 weeks to ship"

After: "Can ship experiments every day"

The cool thing is you could actually use this  hero section format and then have a more technical user story below. By doing that you could speak to the why and how.

That depends on your target reader for this page of course.

Anyhow, I do like this format and I am planning to take it for a spin.

This is a really clever billboard campaign.

Show don't tell they say.

And Segment did exactly that by putting billboards with the wrong location printed on them (LA in SF etc).

The theme/message was "What good is bad data?" which was exactly what they wanted to convey.

What I like about is the alignment between:

• campaign creative
• campaign theme
• product value

This is hard to do imho so big kudos to them 🎉!

Downside?

Reportedly many folks who saw billboards didn't get that it was intentional and Tweeted at them about the error.

Or maybe they were next-level jokers...

This is a simple but great header imho:

• they explain what it is clearly: Stock trading API
• they show the result: trading stocks
• they show the code to drive the "it is for devs" point

Love it.

How to present benchmark results masterclass from RavenDB

The biggest problem with the software benchmarks that you run is?

People don't trust you. Especially when the results are good.

𝗬𝗼𝘂 𝗷𝘂𝘀𝘁 𝗻𝗲𝗲𝗱 𝘁𝗼 𝗯𝘂𝗶𝗹𝗱 𝘁𝗵𝗮𝘁 𝘁𝗿𝘂𝘀𝘁. 𝗢𝗻𝗲 𝗼𝗳 𝘁𝗵𝗲 𝘄𝗮𝘆𝘀 𝗶𝘀 𝘁𝗵𝗿𝗼𝘂𝗴𝗵 𝘁𝗿𝗮𝗻𝘀𝗽𝗮𝗿𝗲𝗻𝗰𝘆.

People from RavenDB do it by:

• Showing where they ran it (AWS, Linux)
• Showing exactly what infra they ran it on. Extra points for making it interactive.
• Explaining how they ran it with code snippets and setup
• Copy is also very to the point, technical, docs-like

This looks solid because it feels like I could re-run what they did myself.And so I trust them and I probably won't ;)

Many dev tools have complex pricing and packaging.

Say your dev tool/platform has many product offerings.

And you offer usage-based pricing but also enterprise plans but also per-product options, and additional customizations.

But you want to present it in a way that is manageable for the developer reading your pricing page.

Mux solves it this way:

• they direct people to the proper parts of the page in the header
• they give self-served prospects a link to the calculator and metering
• they give enterprise/high volume people a "talk to us" CTA
• they give people who want just a single tool (not the whole platform) a CTA to a dedicated pricing page
• they squeeze in a "start free" CTA + info about free credits
• they give navigation to FAQ, features table, and the calculator

Extended headers on pricing pages are not common as they add friction.

But sometimes adding friction is exactly what you need to do.

Mux managed to make this page (and their offering) easy to navigate by adding a little bit of friction at the beginning.

Maybe you don't browse plans right away but at least you don't waste energy (and attention) on the parts of the page that doesn't matter to you.

Good stuff.

This is one of my favorite header patterns for dev tools lately. Layered video visual from MUX.

So that video design pattern in here is this:

• A looped video on the right that...
• Starts by showing code (MUX video): right away I know this is for devs
• Then it shows me a player (MUX player) that shows the result of that code
• Then it goes to show the analytics (MUX data) of people viewing/interacting with that video
• Ends with all parts of the video code/player/analytics layered on top of each other to drive that this is part of one

There are a few bonus learnings here as well:

• "video infrastructure": that framing communicates that there are many tools I can pick and choose from. + it feels like Stripe for video which is a good framing in dev circles.
• "stream billions of minutes of video every day" hints at their benefit and core use case (streaming at scale)
• They show all the products Video/Player/Data right in the header making it clear what this video infrastructure means. And the layered visual explains it further.

btw I really like that branding. Custom font makes it so memorable. It is, isn't it?

An interesting option to push people to read the next article.

You use a slide-in triggered on a 75% scroll with a "read next" CTA in the bottom left.

On the aggressive side for sure but when the article you propose is clearly technical it could work.

And if your articles are not connected to the product explicitly you do need some ways to keep people reading and see more of your brand.

This is one of the most interesting content pieces I have seen in dev tools recently 👇

Comes from @SST and believe it or not is a comedy video created to promote integrations.

That's right.

So SST integrated with Astro and instead of creating "just another how-to use X+Y" video they created this:

• A copy of "Between Two Ferns" comedy show
• With one of the founders of Astro framework which they integrated recently
• Where they don't really talk about integration too much ;)
• And reportedly got a ton of signups from this

It was a fun brand play but got way more views than a tutorial ever could.

And it connected with their audience in a human way that will be remembered (and shared).

Nice.

Ideating how to do dev tool billboards?

I like these from Snowflake.

Especially the customer showcase ones as the format can almost be copy-pasted ;)

One more interesting thing about those billboards though:

• folks from Snowflake placed just a few of them strategically in the cities
• And changed content of the billboard often

By doing that they seem to have billboards everywhere, fight ad fatigue, and stay top of mind.

Love it.

Someone shared an old but awesome article with me recently:  “I answered 99 Stack Overflow questions and now 2 million developers know about my product“

And while chatGPT/Perplexity/co-pilots may be making the Stack Overflow less effective the rules of engaging in communities very much apply to your Slack/Discord/Reddit.

Also, I often talk about social listening, setting up trackers like Syften, F5Bot, or Gummysearch, and jumping into discussions around your problem space. But I haven’t really shared good examples of how people actually join in the conversation doing that. This is one of them.

So what you do is basically:

• Say how the problem can be solved generally
• Say how you can solve it with “a product like mine”
• Show an example of doing exactly that with code

Do that enough times, all in relevant discussions, and see how folks refer to your answers and drive more product signups.

A nice example of making navbar more developer-focused.

Ask for GitHub stars with a link to the repository.

It does three things:

• shows where your repository is and that you have something I can see
• lets me see that you have a popular repository
• reminds me that I can star it (if I am a returning user)

Super short dev tool case study on a single viewport.

Many case studies follow a Hero -> Problem -> Solution -> Results framework.

Many try and do it on a one-pager.

But what @Resend did is next level and I like it.

Especially with devs, you want to be technical and succinct.

And Resend took all the possible fluff out of it.

• They put a strong quote up top
• They highlight the benefits for easy skimming
• They explain the problems and results succinctly
• They show who said it and make it more believable
• They show the customer: logo/ name + what they do

I'd like to have some before or after probably or a stronger results (or pain) ) focused headline.

But I think this is great actually.

I like this Reddit ad creative that uses a classic, devy, bell curve meme.

This is a good creative to use when what you want to communicate is overcomplication. As in:

• there are simple "bad" beginner, obviously not working solutions
• there are complicated "you are so smart" overengineered solutions
• there are wise, pragmatic solutions... that look exactly like the simple beginner ones ;)

Plus, with devs, if you can make something not look like an ad you already won.

And there were a few comments suggesting just that:

• "Good job using meme as add on reddit kudos"
• "I only noticed after reading this lol"

LOVED HOW Flagsmith did it here:

• They start with a spicy controversial hook: "Test in production"
• They explain their product capability in super simple terms: "Decouple deploy and release with feature flags."
• Their call to action feels low commit, not pushy, no "do it now or..." but "Try Flagsmith open source". Having open-source in there is always good for places like Reddit, HackerNews
• The overcomplicated part of the creative shows that they get their audience. They use jargon that the tribe gets (this part can be tricky sometimes if your understanding is actually way off)

And they got people curious to see how Flagsmith makes this Test in production claim reasonable. I'd check it out if I was working on those workflows.

Developer-focused Reddit ad. 33 upvotes, 30 comments.

So @Zesty is a company that targets devops folks and helps with cloud cost optimization.

And they decided to run Reddit ads.

So they:

• Chose the format that works with devs on (some) subreddits
• The funny message that connects to their main value prop
• Made it clear that they solve that problem in the copy
• Added clear(ish) branding

And they got 33 upvotes and 30 comments.

Some of the comments were technical.

One comment that got 67 upvotes was actually

"Okay, this ad is pretty funny"

And I agree, this is a pretty funny ad that I am sure brought them some brand awareness and clicks.

A classic dev tool blog call to action that is somewhat underused these days.

Was going through Martin Gontovnikas blog and found a post from a couple of years back.

He called this "Aside CTA" and the idea is this:

• You write an article about a problem X
• You don't mention your tool much (or anything) in the article
• But your product helps solve that problem
• So you add an "Aside" at the end where you say that you could also solve it with your tool

Why this can work well with devs is:

• You write a genuinely helpful article
• You don't "pollute" the article with your product
• You add value first with content
• You let people "upgrade" their solution experience with your tool
• You are explicit about what your tool does and what the content does.

Definitely a classic that is worth trying.

Read Gonto's article.

I like this idea of showing how your dev tool works.

With developers, you almost have to explain how it works on your homepage.

Many products do some version of Step 1 -> Step 2 -> Step 3 -> Success.

I really like how @SST approached it with a timeline.

I find it more engaging than those disconnected steps.

And when I follow this journey the final and logical step is to try it out. Get started.

This body cross-section is just awesome.

It makes it obvious that I can connect it to my workflow.

This is a must for dev-focused pages imho.

What I like:

- there are many integrations listed

- I can see the code and that it is easy to use

- The CTA is to integration docs, awesome!

‍

Action-focused copy is usually better than "sign up".

But sometimes it is hard to find a good copy for this.

Some teams like Vercel or Auth0  do "Start building "  

But that doesn't always work.

I really like this "Get API keys" CTA copy.

Now for the Hero section I really like those two CTAs:

• Main CTA: Sign up, again expressed with action-focused "Get API keys" copy
• Secondary CTA: See docs, I like how "See API docs" makes it even more concrete.

Really great job imho.

13% signup form conversion bump with a dev-focused trust/motivation builder.

Dev goes through your page, clicks the signup button, and sees a signup form. Now you want them to actually sign up.

The V1 approach is to go clean, a few social signup buttons like GitHub and call it a day.

The V2 is to add trust/motivation builders on the page:

• Logos -> big enterprises and hot startups using your product always feel reassuring
• Testimonial -> fellow dev talking about the product makes your claims real
• Value prop-> reiterating what the product does, key capabilities, makes what you can deliver clear
• How-to -> showing how you get to that value with a 1-2-3 steps removes friction, makes it feel easier

Now, Stytch went for an interesting V3:

Code snippet -> how about just show it? this is a flavour of that 1-2-3 how-to but extra dev-friendly. They also made the code interactive so that you can tinker with it, make it feel yours already.

And they saw a 13% signup conversion bump.

Definitely an interesting thing to test out.

Check out Stytch CEO talking about it here.

How to run developer-focused Reddit ads that get upvoted?

Reddit is well known for anti-promotional sentiments.

Just post something along the lines "you can solve that with our dev tool" and see.

So running ads on Reddit feels even more like a no-no.

Especially if you add problems with bot clicks and attribution as most devs will have some sort of blocks.

But you know your audience is on Reddit.

And for some of us, it may very well be the only social platform they are on.

So what do you do?

This is how @Featureform approached it to get almost 100 upvotes on an ad:

• They start with a simple conversational copy pointing at their target users pains
• They agitate target users pains in their language (lots of jargony terms, tools and problems)
• They use very devy language, likely rooted in deep user understanding (voice of customer)
• They don't talk about their product in the meme
• They show clear branding so that you can connect the dots.

If you are going for brand awareness rather than a direct conversion those types of ads can work very well.

I liked it for sure.

Copy that lands makes a huge difference in dev tool website conversion.

Earthly proved it with this "tiny" change.

So I am a huge believer in good copy.

Not the clever one but the one that is written with words that your customers use.

That is rooted in product and research.

But I often hear devs or founders say things like "it's just copy".

It is not "just copy" it is your message, it is your positioning.

It is the difference between  "cool, let's try it" and "now for me, whatever".

So some time ago I came across this article from the Earthly CEO Vlad Ionescu.

He shared that at some point they decided to run this A/B test with just a "tiny" change.

They changed the word "CI" -> "Build" across the homepage.

• Control -> "Earhly makes CI super simple"
• Test -> "Earhly makes builds super simple"

And their core website conversion doubled.

So next time you work on website copy give it some more thought and you may be surprised that "just copy" made a huge difference.

How to do a dev-focused brand video and get 10M+ views?

Making a memorable brand video is hard.

Doing that for a boring tech product is harder.

Doing that to the developer audience is next level.

Postman managed to create not one but three of those brand videos that got from 4M to 10M youtube views.

The videos I am talking about are:

• "I am gonna push some buttons"
• "Together"
• "We did this"

So what did they do right?

• They are all short playful stories touching on values coming from a centralized API platform.
• They hint at the motif of space which is a clear part of Postman's branding
• They do show the actual UI of the product

Honestly, I am not exactly sure what special sauce they added but those are just great videos that you watch.

And I definitely remember them and the company which is exactly what you want to achieve with brand ads.

A classic "It doesn't suck" campaign.

Afaik, Barebones ran the first version of this campaign 20 years ago and it was a huge success.

It is so simple, it just speaks to that inner skeptic.

It doesn't say we are the best, we revolutionize software.

It says it doesn't suck.

That is way more believable and makes me think that there is a dev on the other side of that copy.

And there is something cool about this message that makes me want to wear it to the next conference.

Good stuff.

Is this brand campaign 💩 or ❤️?

I like it a lot actually.

It gets attention, it is memorable, it gets reactions.  

And It does speak to a product message: that you have better developer experience than other tools.

It definitely beats flavors of "5x developer productivity".

Funny dev newsletter CTA. From shiftmag .dev by Infobip.

It starts with a chuckle-worthy:

"Sarcastic headline, but funny enough for engineers to sign up"

Then they follow up by disarming the "is that spam" and building more rapport with:

• "Written by people, not robots - at least not yet."
• "May or may not contain traces of sarcasm, but never spam."

They end with an alternative call to action. RSS feed.

Most newsletters don't do RSS.

But for many devs RSS feed is the preferred content subscription.

Great job!

Nice Reddit ad from kftray.

This is a simple ad format but lands the message:

• Clear, transparent "What it is" and "What it does" in the Headline
• Basic screen share video that shows both the code (terminal) and the  UI (product app)
• Unblocked comments make it more confident and spark conversation

An interesting fact is that there is no call to action?!

They say "Kftray is an open-source" which is enough for those interested to google "kftray github" or just go to GitHub and find it. And makes the ad less pushy which is a nice touch on Reddit.

But the most important takeaway is this. If the problem is real to the dev audience you target you don't need to go fancy. Just show how you solve it.

What to say when you have many products? 

Dev tool companies over time grow from one product to suite of products to platforms with products built on top of the core one.

The result is that it is harder to communicate without going full-on fluff mode (my fav "built better software faster").

But for most companies, there is this core capability/product where people start.  The entry product. Why not use that?

I really liked what Stripe did on their docs page here:

• They have maaaany products: billing, tax, radar, identity etc.  
• But all of them are built on top of their core payments product
• So they focus on getting folks to start with the payments
• And make it clear that there are many other products

Even though this is docs, the same applies to homepages and other dev comms.

If you have many products, figure out what is the most important one, the one where most people enter. Focus on that. "Upsell" to other products later.

Understand who is reading. Add social proof that speaks to them.

Social proof is about showing people/companies who are similar to the reader that they got success with the tool.

Company logos can be good if your reader knows and likes those companies.
But if those are random companies, I am not sure how much value does it bring.

Devs care what other devs who use your product have to say about it.
That's why I like testimonials.

Not the crafted, clean ones with features and values.
But the real stuff. Real devs sharing real stories.

Bonus points for "Okay, I get the point" button copy.
It changes from "Show more" when you click.

Nice!

If you have an API product presenting it in an exciting visual way is hard.

But Deepgram managed to do just that.

They go for an autoplay presentation that has four acts:

1. Context: playing an audio file showing a spectrogram -> sets the context that this is something audio
2. Code: They show the code from one of the SDKs being typed. And they show tabs at the top with other important SDKs to convey that this is not Python-only.
3. Result: Shows the output of running the code, a transcript, and an AI-generated summary and topics.  
4. Layers: Takes the points above and layers them in one viz to communicate that this is all part of one product, just different "views" of it.

And the delivery is just slick and elegant. Kudos team!

btw, Mux, the video API has a similar design of their visual. I think it is just a great visual element for API products.

"See docs" is one of my favorite secondary CTA on dev-focused pages.

TailwindCSS takes it to the next level by inserting docs search right into the header CTA.

This takes devs directly to the page they are interested in rather than have them try and find things for themselves.

They could have searched the docs in the docs, of course.

But this is just this slightly more delightful developer experience that TailwindCSS is known for.

Classic widget PLG loop.

Algolia really crashed it with these. Here is how they made it so successful.

Some time ago I did some research on Algolia marketing looking for gems. Found quite a few as they are truly amazing at this.

One angle that is bringing a lot of traffic to their site is that classic PLG widget.

So what they did is:

• They gave away their search box for free (under conditions)
• They made sure that folks who do get it for free have some (ideally a lot of) overlap with their target audience.
• People who added that search box got the branded "Powered by Algolia" version of it
• Some devs who used the sites with the Algolia search box liked the search and went to their site
• Some of them started using it and spreading the word further

And the sites that brought the most traffic were:

• Hacker News search (that is not exactly the widget but a standalone site)
• Fontawesome (site with fonts for devs)
• Open-source documentation sites (they give away free docsearch to OS projects)
• SteamDB (gaming site)

I love this tactic as it aligns:

• the value their product provides
• the value that site users get
• the value that the company gets from developers finding out about it

Win Win Win

When you find those "Win Win Win" tactics/strategies you are golden.

Conference activation idea: Tetris competition at the booth.

It is hard to get devs to your booth if all you offer is a "do you want to see a quick demo" spiel.

You need to get a bit more creative than that.

💚 The team at Storyblok ran a Tetris competition:

• Playing station at the booth to make sure people come by
• Live leaderboard for when people were not playing + to get folks to play again
• Branding around the playing station for those who take photos to share it on socials
• A cool devy prize (mechanical keyboard) to build some additional reason to play talk about it

Afaik it was a big hit and I can definitely see why.

📒 A few more notes:

• make it live at the booth, not available online -> you'll get no buzz for it otherwise (made this mistake)
• try to get organizers to give you a few minutes of the schedule to give away prizes
• if you can connect the game to your product in a memorable way do that.  

btw, I read about it on DX Tips. You want to check out that article on dev conferences from DX Tips

7k likes on an event promo post to the dev audience.

I don't think I've ever seen 7k likes on a developer company post on Linkedin.

Ok, this is Github, but still.

This is a 26sec video where they go:

• "What happens when a CEO..."
• "... builds an app LIVE in 18 minutes ..."
• "... in front of 15000 people..."
• "... with Copilot X for the first time?"
• "What could go wrong?"
• "What it Live"

This is a job well done:

• Super slick but minimal design. Feels a bit like that famous nextjs prisma conference tickets.
• Offers a live coding session which is one of the event types that devs like cause it is real.
• Plays powerful music, but no voiceover that would make it feel more corporate.
• Dev to dev, conversational copy. + this final snarkiness appeals to devs.

And they could have done:

• Copy: "We are happy to announce our CEO streamlining business value for the enterprise"
• Design: Show people at previous events and stuff that you saw a million times
• Offer: Talks from industry leaders (that  are customers using your product)
• Voiceover and music: Boring corporate classic.

This is how to promote an event. LOVED IT!

Show how product components fit together.
‍
A good diagram is such a good solution to that.
‍
They use the same colors and eyebrow copy that was used for body sections.
It all clicks now, I get the full picture.

‍

‍

Interactive product tours are all the rage.

But how do you make them work for the dev audience?

How do you deal with:

• Explain your complex dev tool value proposition quickly
• Show both code and UI elements
• Make devs feel great developer experience of your product
• Push devs to the conversion action without being to pushy
• And do all that without overwhelming

That is hard.

But Vercel somehow made it.

This is by far the best product tour I have seen so far.

What I love:

• Great, clean navigation that lets me go back if I want to
• They use their slogan "Develop, Preview, Ship" to reinforce the product message
• They show both code and the UI
• The CTAs are visible but subtle enough not to distract

This product tour is what dev tool startups will aspire to for years (or months ;) ) to come.

Mark my words.

I love how simple this delivery is. But this is what makes it powerful:

• What it does (benefit): "Launch Apps Near Users" just tells you right away what is in it for you
• How it does it (features): some specifics in the header that make you understand the how
• Visual: doubles down on that "near users" by showing which locations they support
• Joke: that little joke "6 continents -> * Antarctica coming soon" makes it more memorable and adds one more point of emphasis to that "near users" story

Bonus points for showing those regions with their balloon logo.

Just loved how they focused their message to the very core and used all of those elements to land it right away. Great job.

How to promote your important company event? How about right there in the header.

A typical approach to promoting events on your site is to have them in the Hello bar (right above the navbar). This is a solid option of course.

But what if this is a super duper important event that you really want to push?

Put it in the header.

The header is the most viewed part of the most visited page on your site.

Doesn't get much better than that.

But you don't want to distract people from your value propositions and main CTAs too much.

How do you do that?

This is how Vercel did with last year's NEXT.js conf.

• above the H1 headline so as not to break the flow
• prominent but not more distracting than it needs to be
• has conference logo, crystal clear copy, and an event CTA

Nice execution on that pattern.

Streamlit has an amazing explainer.

They show how to go from:

• Writing your first line of code
• To creating data dashboard
• To deploying it across the web

In 42 seconds.

No audio, just code and a simplified result window.

Amazing stuff.

Your dev tool is faster/more scalable/more X -> show it with benchmarks.

For some tools the entire unique selling point is that they are faster.

You build your messaging around that, put a flavor of "fastest Y for X" in the header and call it a day.

But devs who come to your website cannot just take your word for it. They need to see it, test it.

For some tools it is possible to just see it for themselves, get started.

But you cannot expect devs to really take a database or an observability platform for a spin.

As to test the speed or scalability on realistic use case you need to...

... set up a realistic use case. Which takes a lot of time.

But you can set that use case and test it for them. With benchmarks.

I really like how Astro approached it:

• they list out known competition by name
• they hint at technical reasons for why they are faster
• they shows those benchmarks high on their homepage
• they link out to the full report and mention the trusted source

If your usp is that you are faster/more scalable/ more whatever. Back it up. This is the nr 1 thing devs on your website need to trust you with to move forward.

How to bring attention and trust to a feature section?

Add a testimonial.

Ideally, it should talk about that feature to make your message even stronger.

I like how Appsmith made it animated and it just makes you look.

And you read the testimonial and look at the feature above it.

Good stuff.

Interesting dev blog CTA idea from V7.

CTAs in technical articles is a tricky subject:

• Go too aggressive and "obviously an ad" and devs ignore it or get angry
• Go too subtle and you may not get the readers attention at all

I like how V7 approached it here:

• They add a separate (aside) section but it is subtle, feels like a part of the article
• They use a GIF image creative that catches my attention and simply shows the product
• They used various  anchor link CTAs. Interestingly these often get more clicks than buttons

What I'd change/test is making this CTA not a generic value prop but something closely connected to the rest of the article.

Just an awesome billboard/ad format for a dev too company coming from Vercel.

What I like about it is:

• you catch attention with something different
• those who are in your audience get it, maybe they feel more seen
• you reinforce that your brand is very developer-focused
• you don't forget to put the "obvious" branding in there
• and there is a CTA to get people to do something

Simple and beautiful.

Btw, they actually run similar ads on Reddit and it makes a lot of sense IMHO.

This is one of my favorite our dev tool vs competitor blog posts.

With these pages, you want to explain when you are better.

But you don't want to berate your competitor.

And above all, you want to help people make a decision.

Chances are (almost 100% ;)) that you are not better for every use case. And your developer audience knows it.

But there should be use cases, tool stacks, or situations when you are the best option.

Talk about those. Dev to dev.

@Convex did a great job in this post that I think can be a template for how to write these:

• They start by saying what is the same. That sets the context.
• Then they say good things about their competitor. Shows respect and understanding
• They follow by listing 3 key differences/situations when you should consider them
• And they go ahead and explain each of these differences deeply

After reading that post you are fairly convinced that if your situation matches the one described and if it makes sense to use it.

Love it.

A freaking developer TV.

They took this "be a media company" to the next level.

They created entire TV around their company, audience, and products.

I respect people really going all in.

Funny ad, that makes fun of ads.‍

But it actually communicates that you don't care about the ads but more about something else, like:

• docs
• code examples
• integration
• backend
• UI

This is such a fantastic ad creative because it is just so different.

So basically what Kinde it does is:

• _It shows the timer, dev, and the screen nothing else.
• The dev adds authorization to the application in under 2 minutes
• The fact that the dev is sneezing while coding just makes it so real and human
• You see a how-to-add Kinde for authorization tutorial while rooting for the dev to complete ;)
• 🎁 Bonus points for having that filename saying what it is, almost like an ad title: Authspeedrun.mp4

💚 That timer is such a great way of catching attention and keeping it while landing your product message. It seems raw and "whatever" but I think it is very intentional in its dev-friendly delivery.

So if you have a dev tool that has awesome devex and can get people to that aha moment quickly then give it a go (and tell me how it went ;)).  

Very cool project.

You type in your GitHub name and see your history in 3d.

• engaging 3d viz
• cool music
• button to share it on Twitter

And Voila!

You have an intrinsically viral brand awareness campaign.

Just brilliant.

I love this copy. It answers:

• what it does -> "authentication and authorization"
• how is it different -> "simple to implement, easy to extend"

It doesn't talk about the value as it is obvious to devs.

Obviously, it will save time and make things safer.

Don't talk about it.

Good in-place code pattern.

I can go and see different code snippets without moving to other parts of the website.

At the same time, I can read explanations and value propositions.

I like how "view documentation" is such a strong CTA with so much going on here already.