Mario Ferrer
← Back to work

Collabs creator app

Rebuilding Shopify's creator-marketing product from a mobile web experience into a native app, and designing the merchant and creator sides as one connected system.

Company
Shopify
My role
Staff Content Designer, Collabs
What I owned
Content design across two connected surfaces: the merchant admin and the new creator app
When
Jul 2023 to Nov 2024

The problem space

Creator empathy map: 'As a creator using Collabs, I feel...' and 'What I need...' research synthesis
Early creator research (with our UX researcher) surfaced the real tension: momentum and control, but also simplicity and automation.
FigJam board comparing the core current navigation against the redesigned 2023 navigation, level 1 to 4
The IA problem, made visible: the old five-tab structure versus the redesigned navigation grouped by how creators actually work.

From here, you'll need a password

The full walkthrough, the screens, the numbers, and what I learned are behind a password. Reach out and I'll send it over.

That's not it, try again. Ask me for the password

What I worked on

  • Set the tone-of-voice foundations first. Three pillars, Gutsy, Authentic, Empowering, each grounded in a specific creator insight ("Collabs is a vibe... clarity over clever"), not abstract adjectives. This became the north star for every screen that followed.
Collabs tone of voice: Gutsy, Authentic, and Empowering pillars, each tied to a creator insight
Voice pillars tied to real creator insights, so tone had a reason behind it rather than a mood board.
  • Built the taxonomy and IA that tie admin and app together. Mapped the full screen inventory as a system, Discover, Creator Shop, Performance, Settings up top, with PDP, Merchant Shop, Search, Collections, Connections, and Security beneath, so the same product and collab-state model could drive both what a merchant configures and what a creator sees.
Full Collabs app IA and taxonomy skeleton across Discover, Creator Shop, Performance, and Settings
One shared taxonomy driving two surfaces, the scaffolding the whole system hung from.
  • Designed the Home feed around three real creator personas. Coach, Insider, and Guardian, each with a distinct need ("show me what's working" / "show me something new" / "keep me on path"), mapped along a spectrum from your active collab out to discovery. Home's design principles were written as paired rules and creator-voice quotes.
The three creator personas, Coach, Insider, and Guardian, with their needs and Home's five design principles
Personalization designed around who the creator is, with principles written in the creator's own voice.
  • Turned the personalization concept into a prioritized, voice-complete backlog. Every rail idea (Your top sellers, Trending in {my category}, New from {Active Collab}) got a plain-language rationale, an actual shipped-voice tagline ("Tap into the trendsetters to boost your commissions"), and a Do Now / Do Soon / Later / Don't triage. Voice applied line by line, not a moodboard.
The prioritized Home rail backlog: Do Now, Do Soon, For the Future, Don't Do, each with a rationale and a shipped-voice tagline
The craft behind the spectrum: real taglines against a triaged, attributed backlog.
  • Spec'd each Home rail as a reusable component with conditional logic, not a one-off screen. "IF creator has an active brand collab, show the hero product card... ELSE fallback," written right alongside the visual so engineering could build the branching without a separate spec.
Home rail components spec'd with conditional IF/ELSE logic written alongside the visual design
Content and logic in one artifact, so the rules shipped with the design.
  • Designed the buyer-facing side of the same system: a shoppable creator storefront (a TikTok-style feed to "Shop this look" to curated collections like "Marielle's Minimal Winter") so a creator's own audience could shop straight from their content. This is the content-commerce half, the other side of the same taxonomy. We deliberately designed these screens with a diverse cast of creators, so the product's tone was set by the real range of people who use it.
The shoppable creator storefront a buyer sees: creator profile, content post, Shop this look, and curated collections
The other side of the taxonomy: a creator's followers shopping directly from their content.
  • Wrote and structured the full onboarding flow: login, welcome, personal info, social connection, community guidelines, notifications, celebration, plus edge states like the waitlist screen and a "Leaving so soon?" exit-intent. I added a skip option on social connection specifically to cut drop-off.
The full Collabs onboarding flow from login through celebration, including waitlist and exit-intent edge states
The whole flow, including the unglamorous edge states, with a skip added where the data said people were dropping.
  • Pressure-tested the taxonomy in cross-functional decision reviews, on the file. Real questions resolved in place: do we favorite or save or follow a brand (favorite), where do favorite brands live, Home or Library (Library, per Harriet, our PM), are brand values clickable (no). Designed with product and design leadership, not in isolation.
  • Carried Gravity across products. Ahead of the build, I stress-tested an experimental Figma UI kit (a teammate had repurposed Gravity's components) by translating the existing web creator experience into it, to validate it as a foundation for the engineer building the native app. The systems thinking wasn't siloed per product, it traveled.

What got shipped

4.8★
App Store rating, live today
70 → 72%
Onboarding completion, legacy vs. new funnel
~10 → ~3%
Drop-off on social connection after adding a skip
  • Live product, positive reception. "Collabs: Content commerce" is on the App Store and Google Play today at 4.8 stars across 298 ratings. Unsolicited from the reviews: "Keeps me up to date with every sale that's made," and "so user friendly... we've had the best experience with it."
  • The skip option was the single biggest win. Adding a skip on social-account connection cut that step's drop-off from ~10% to ~3%, and 15% of the people who skipped came back and connected later anyway.
  • Documented decisions traced straight to what's live. The "favorite brands live in Library, not Home" call shipped exactly there. The Coach / Insider / Guardian spectrum shows up as a live "Curate your feed" picker. The taxonomy's Performance and Commissions sections are the app's real tabs, with commission math on every product page.
Live Collabs app product page showing real commission math: Buyer pays $189.00, You earn $28.35
A documented decision, live: commission math surfaced on the product page ("Buyer pays $189.00 / You earn $28.35"), shot from my own phone a year after the work.
  • The merchant-admin half shipped too. Shopify's Editions Winter '24 page lists seven live Collabs features: creator search and filters, automatic commission payouts, consolidated creator profiles, bulk application management, a unified connections table, per-segment affiliate offers, and TikTok Shop sync.
Public Shopify Editions Winter 24 page showing shipped Collabs merchant features
The merchant side, documented publicly in Shopify's Editions Winter '24.

The lesson learned

  • The information architecture was the real test, and it demanded systems thinking, not screen-by-screen writing. Everything was interconnected, so holding the whole shared taxonomy in my head at once mattered more than any single screen. Leaning on that systems view is what kept two surfaces reading as one product, and it's the muscle this project pushed furthest for me.
  • The values-step drop-off taught me something about how "optional" reads to people. Creators treated it as a "maybe later" step, and a good chunk never came back. If I had more time, I'd make its value clearer in the moment or rethink where it sits in the flow.
  • Working across both surfaces let me see the full loop, the merchant managing a collab and the creator posting and getting paid. Very few projects let you sit with both halves of a relationship at once, and it changed how I thought about the taxonomy: a decision that looked small on the admin side could become real friction on the creator side.

There's always more behind a case study.