Building a New Content-Discovery Feature for kumparan's Product EcosystemAn end-to-end content-curation feature, from the Magnetic CMS mechanism to the front-end discovery experience.
Product DesignFeature IdeationDesign ProcessContent Management System

Building a New Content-Discovery Feature for kumparan's Product Ecosystem

An end-to-end content-curation feature, from the Magnetic CMS mechanism to the front-end discovery experience.

2019
1 Month
Lead Designer + PM, 1 iOS dev, 1 Android dev, 1 backend engineer
Product Designer, Researcher, and Product Manager

Overview

Collection" was proposed as a new feature across kumparan's platforms — mobile site, app, and desktop — with a supporting mechanism built into kumparan's internal CMS, Magnetic. The feature needed to let editors package curated content (special coverage, story series, themed collections) in a way the existing topic and timeline structures couldn't support, and needed to be designed as a system that worked on both the content-management side and the reader-facing side. I led this from initial mapping through to a validated, testable prototype, starting with mobile site as the first platform.

The Problem

kumparan had recurring content that deserved to be packaged and surfaced together — special coverage, story series, and other curated collections — but the existing structure offered no dedicated way to do this. Valuable content risked getting lost in the regular timeline instead of building a cohesive reading experience, weakening both engagement and content literacy for the topics that mattered most.

The Solution

I followed a structured five-stage process end to end:

  1. Mapping — scoping what "collection" could realistically cover (special coverage, story series, and future collection types), and defining how the feature would connect between Magnetic (CMS) and the front-end.
  2. Sketching — low-fidelity wireframes for both the Magnetic (CMS) side and the front-end UI, establishing content placement and information architecture before visual design.
  3. Deciding — evaluating multiple UI directions with the team (including several card-layout variations for the collection home) and converging on an approved direction for both the front-end and the Magnetic CMS experience.
  4. Prototyping — building interactive prototypes (InVision, plus live dev prototypes) covering both the Magnetic collection-management flow and the mobile site's collection experience.
  5. Testing — validating the concept and the high-fidelity prototype directly with prospective users before moving toward wider rollout.

On the CMS side, the design let editors create a parent "collection title," with nested sub-collections underneath it, giving them flexible control over how stories were grouped and curated.

Flow alternatives explored during Mapping

User flow alternative 1:

User flow alternative 2:

User flow alternative 3:

Magnetic (CMS) flow mechanism

Flow mechanism 1:

Flow mechanism 2:

Flow mechanism 3

Sketching: low-fidelity wireframes and hi-fidelity

Front-end UI, version 1 and alt 2:

Front-end UI, collection list page:

Magnetic (CMS) collection wireframe:

Deciding: UI directions explored

Collection card home, variation 1:

Collection card home, variation 2:

Collection card home, variation 3:

Deciding: final approved UI

Approved front-end UI (1 of 3):

Approved front-end UI (2 of 3):

Approved front-end UI (3 of 3):

Approved Magnetic (CMS) UI:

A Two-Sided System:

This wasn't just a front-end feature, it required designing two connected experiences: the content-management mechanism inside Magnetic (how editors create, structure, and populate a collection) and the reader-facing interface (how a collection is discovered and browsed). Designing both sides together, rather than the UI in isolation, was what made the feature usable end-to-end rather than just visually complete.

Results & Impact

Led ideation-to-prototype design for a new content-curation feature spanning CMS and 3 front-end platforms

Reduced production costs by 30% before development and launch.

Designed both the editorial (Magnetic CMS) and reader-facing sides of the feature as one connected system

Validated multiple UI directions with the team before converging on an approved design

Delivered working prototypes (CMS + mobile site) ready for user validation ahead of wider rollout

Like what you see?

I'm always excited to collaborate with teams and individuals who value thoughtful, user-centered design. If you're hiring, or have a project in mind, let's talk.

Get in Touch