← All worknow showing ( 08 ) / 24
← part of One hub, many communities

The tool behind the tool

The tool behind the tool key visual

the admin portal is where all learn & earn content gets made. we rebuilt it around how content developers actually think about their work.

Client StackUpDuration 2 months, 2023Role product designerTools figma, figjam, balsamiq, notion, github
( 01 ) Challenge

it made sense to the people who built it.

pathways, campaigns, quests and tutorials looked tidy on a whiteboard. underneath were hidden relationships and messy edge cases, and content developers were hacking their way through the prototype to get things out the door.

↗︎↑ mostly black & white. clarity first, on purpose.
( 02 ) Pulling it apart

we mapped everything first.

how every content type connected and where it broke. i interviewed the content developers who'd been managing things by hand, and their feedback was blunt: the system followed its own logic and ignored how they actually worked. analytics filled in the rest, showing drop-offs, odd usage and inconsistent submissions.

the original prototype we inherited
the original prototype we inherited
( 03 ) Simplifying

we kept the complexity underneath.

we cut it down to what a content developer needs: create content and see exactly what learners will see. we mapped the lifecycle from draft to live to archived, and designed for the core needs so the system carries the complexity and the user doesn't have to.

the simplified builder
the simplified builder
( 04 ) Two structures

pathways and campaigns now speak the same language.

pathways are long-form learning journeys that build on each other. campaigns are time-boxed and reward-based, running quests for badges, money or the satisfaction of finishing. tutorials can live in either and behave the same way.

draft( 01 )
active( 02 )
paused: still visible, clearly marked unavailable( 03 )
archived( 04 )
↖︎↑ sounds small. saves a lot of confusion.
pathways and campaigns
pathways and campaigns
( 05 ) Priorities

we started with whatever mattered most and cost least.

inconsistent states and unclear labels were quick to fix and made a big difference. multi-community publishing and scheduling needed more time and cross-team input, so they went in the queue.

( 06 ) What landed

content developers could see where everything lived.

we tested async with developers and internal ops over figjam and meets. there were fewer "where do i click" moments, and new admins needed fewer handovers.

( 07 ) Byproduct

the learn & earn component library.

reusable pieces like availability cards and progress indicators now power every new feature. the components outlasted the project, and it's the part i'm proudest of.

learn & earn component library in figma
( ↗︎ ) Prototype
Next track →
Making progress feel like something