Protected

This case study is password‑protected

Incorrect password

Case Study

Growth design at Tumblr

Growth projects I initiated or led: fixing link previews, redesigning the share sheet, building branded image sharing, rewriting notification copy, and updating App Store screenshots. Together: +6.5% notification opens, +1.6% installs, +118–173% app sharing.

Role
Design Lead
Timeline
September 2024 – April 2026
Platform
Web, iOS, Android
Focus
Product design, A/B testing

These projects came from paying attention to how Tumblr content moves through the world. I noticed problems, proposed fixes, and measured results.

In September 2024, I sent a Tumblr post to a friend on Discord. The link preview showed a generic thumbnail, a truncated blog title as the page title, and no indication of what the post actually contained. On iMessage, it was worse: a tiny square with no useful information. On Bluesky, the OpenGraph metadata was so bad the preview was essentially blank.

Every time someone shared a Tumblr post off-platform (group chat, social feed, forum), the link preview looked broken. Generic thumbnail, truncated metadata, nothing that made you want to click.

I documented the problems in an audit post, which became the foundation for a full engineering project. We updated OpenGraph metadata for every post type (original posts, naked reblogs, reblogs with content) so that link previews render properly across platforms.

Before: video post preview showing just the blog name repeated

After: video post preview with author, post text, and thumbnail

Fig 01 Before and after for a video post. The old preview repeated the blog name with no content. The fix surfaces the post type, author, and actual text.

Before: photo reblog showing only the blog name

After: photo reblog with reblog attribution

Fig 02 Before and after for a photo reblog. The old preview used the blog name as the title. The fix shows reblog attribution and the original post description.

Before: blog profile preview, small and compact

After: blog profile preview with proper layout and avatar

Fig 03 Before and after for a blog profile link. The old preview used the display name but was cramped. The fix shows the avatar larger and lays out the metadata more clearly.

In the year after the fixes shipped, permalink traffic from shared links grew significantly. Multiple factors drove that, but the previews made sure shared links actually looked worth clicking.

Permalink traffic growth
+60%
Weekly views from shared links
~4M

Share sheet redesign

Tumblr’s old share sheet was designed around on-platform DMs. But usage data showed that sharing off-platform (Discord, iMessage, other apps) was the stronger intent.

I redesigned the share sheet to prioritize off-platform sharing while keeping on-platform DMs accessible.

Before and after share sheet on mobile

Fig 04 Before and after on mobile. The old share sheet (left) prioritized on-platform DMs with a list of Tumblr users. The redesign (right) leads with Copy link, Share to, and platform icons, with messaging deprioritized.

Key design decisions

Platform ordering by data. I ordered the external app icons based on actual installation data showing which apps Tumblr users have on their phones. The share sheet also uses device detection to only show apps the user has installed, then orders by their last-shared-to app. No guessing.

App installation data for Tumblr users

Fig 05 App installation data for Tumblr users. Notes app leads at 202K, followed by Instagram, Pinterest, TikTok, Discord, and Twitter. This data drove the icon ordering in the share sheet.

The web version uses a modal with two rows of platform icons (avoiding horizontal scrolling that only works with trackpads) and a “Message to…” input for on-platform DMs that animates to reveal the conversation UI.

Share sheet on web

Fig 06 The share sheet on web. Default state (top left), link copied confirmation (top right), and the progressive DM flow: searching users, selecting recipients, composing a message.

On mobile, platform icons are displayed as a grid with Copy link and Share to (native sheet) at the bottom. Tapping “Message to…” slides the platform icons away and brings up a keyboard with the user search.

Share sheet on mobile

Fig 07 The shipped mobile share sheet. Default state with user list and platform icons (left), and messaging mode with selected recipients and compose field (right).

Instagram Stories + Save as Image

I designed a flow where users can share any post as a branded image to Instagram Stories, with a Tumblr attribution sticker. The post is rendered as an image with the Tumblr logo, placed on a customizable background. Users can pick from default color options, or the app extracts dominant colors from the post’s images to generate a custom gradient.

Instagram Stories sharing flow

Fig 08 The full Instagram Stories flow: post in feed → share sheet with Stories option → Stories editor with the post as a sticker on a colored background.

Background color variations for Instagram Stories

Fig 09 Background variations. Text posts get solid colors. Image posts extract dominant colors for custom gradients. Each screen shows selectable color palettes at the bottom.

For video and GIF posts, the video becomes the background layer and the Tumblr attribution becomes the sticker.

Video post handling for Instagram Stories

Fig 10 Video post handling. The video can become a full-screen background with a Tumblr attribution sticker, or the post card renders on a colored background.

I also added a “Save as Image” option that generates a post screenshot with Tumblr branding. Interactive UI elements are removed, and the Tumblr logo is added. This ensures Tumblr’s brand travels with shared content, even when shared outside of any specific platform.

Different post types rendered as shareable images

Fig 11 Save as image across post types: an image post with tags, a cropped version, a video post with play button overlay, and a text reblog chain. Each includes blog name, timestamp, and Tumblr logo.

Results

The share sheet was A/B tested across all platforms:

App sharing (Android)
+118–173%
Share to Instagram
+45%

Notification copy

Tumblr sends a push notification when a blog you follow posts after being inactive. I noticed the notification titles were being truncated on mobile, cutting off the blog name (the most important piece of information). This was a pattern I’d been writing about more broadly: our interface copy used more words than necessary and prioritized quirky personality over clarity. I suggested putting the blog name first and cutting each variant down.

  • “Guess who’s back? It’s <blog>!” → “<blog> is back!”
  • “<blog> returns to the scene!” → “<blog> returns!”
  • “Alert: <blog> breaks the silence with a post!” → “<blog> breaks their silence!”
  • “<blog> is back and ready to rock!” → remove
  • “Stop the presses! <blog> makes a triumphant return!” → remove
  • “Calling all fans: <blog> resurfaces with a new post!” → “<blog> resurfaces!”
  • “The prodigal blogger returns: <blog> is back!” → remove
  • “<blog> breaks their silence with a post!” → remove
  • “Attention, Tumblrverse: <blog> is back in action!” → “<blog> is back in action!”
  • “<blog> emerges from hibernation with a fresh post!” → “<blog> emerges from hibernation!”
  • “Attention: <blog> is back in business!” → “<blog> is back in business!”

We A/B tested the shorter copy.

Notification opens
+6.5%
Sessions
+1%

App Store screenshots

I designed updated screenshots for the App Store and Google Play that better represented Tumblr’s current experience.

App Store screenshots before

After screenshot 1

After screenshot 2

After screenshot 3

After screenshot 4

After screenshot 5

After screenshot 6

A/B tested via App Store Optimization:

Install rate
+1.6%

Takeaways

None of these projects were assigned. The link preview audit came from sharing a post to Discord. The notification copy change came from looking at my own phone.