screenrove
SaaS blog design: what 18 product content pages actually do
SaaS blog design from 18 real product pages: Medium's engagement bar, Glasp's read times, Linear's chapter index, and why none had a newsletter form.
Page types / Blog & content pages
Blog & content page examples
Blog indexes, articles, changelogs and help content from 17 real products.
- 23
- blog & content pages
- 17
- products
- Help / docs
- most common page
MediumArticle
RaycastChangelog
LinearBlog index
IFTTTArticle
MediumArticle
Product HuntHelp / docs
WherebyChangelog
RaycastChangelog
StripeHelp / docs
StripeHelp / docs
StripeHelp / docs
FLORABlog index
GlaspBlog index
Leonardo.aiChangelog
RiveHelp / docs
PostmanChangelog
CursorHelp / docs
RaycastHelp / docs
DesmosArticle
HevyArticle
StackBlitzChangelog
DuolingoHelp / docs
StripeHelp / docsAnalysis from this wall
Changelog page design: 5 real examples and what to steal
Changelog page design examples from Raycast, Leonardo.ai, Postman and StackBlitz: version navigation, change-type labels, dates and what to copy for your own.
AI-ready documentation: docs pages now written for coding agents
AI-ready documentation from real product screens: Stripe's Copy for LLM and View as Markdown, Raycast's Ask or search, Clerk's SKILL.md and Eraser's MCP setup.
Questions
Where do these blog pages come from?
Every screenshot was captured by Screenrove in the real product, in a desktop browser, with a research account where sign-in was needed. Nothing is a mockup or a Dribbble shot. Each blog page links to its full product collection so you can see the screens around it.
How are the blog pages tagged?
A vision model reviewed every screenshot and recorded what kind of screen it is and the details designers filter by, plus a crop of the part worth studying. The tags are shown on each screen's page so you can check them against the full screenshot.
Can my coding agent use these blog pages?
Yes. Connect the Screenrove MCP server (screenrove.com/agents) and ask for blog pages. Your agent can search them, let you pick one in your browser and build from it with the screenshot, notes and the product's measured design guide.
Every screen was captured in the real product, in a desktop browser. A vision model recorded each screen's facts and crop, and you can check them against the full screenshot. Original interfaces belong to their owners. Spotted a wrong tag? Tell us.