How might we rebuild a legacy news site so readers keep reading?

TVBS News is one of Taiwan’s largest news platforms. Years of ad-first operation and a focus on breaking updates had left it with a fragmented reading flow, an unclear hierarchy, and editorial tooling too rigid to fix either.

I led a mobile-first redesign as the sole designer. The core team was six: myself, a PM, two engineers, my design manager and the department head. Beyond it I worked with the online news desk — an editor and the editorial director — plus the sales department and a third-party ad vendor. The brief was not a visual refresh: it was to restore reading flow and give editors a modular system they could actually operate.

1. Reduce cognitive interruption

   Dense mid-article ad placement was breaking the narrative.
2. Strengthen information hierarchy

   Readers could not scan or locate the key idea quickly.
3. Increase session depth

   Give readers a relevant reason to continue after the article ends.
4. Support editorial scalability

   Reusable modules instead of one-off layout adjustments.

Target metrics

Reading flow had broken down. Ads placed mid-article interrupted the narrative and readers left early. Three systemic factors kept it that way.

1. Outdated information hierarchy

   Readers could not scan the page or locate the key idea, which made staying engaged harder than leaving.
2. No guided continuation

   Recommendations after each article were generic and unrelated to what the reader had just finished, so they left rather than continued.
3. Limited CMS flexibility — underlying cause

   Editors had no tools to structure stories consistently, so layout and hierarchy problems reappeared with every story.

Behavioural analysis

GA4 behavioural data and scroll-depth metrics showed drop-offs clustering at the exact points where ads interrupted the reading flow. 2023 data also showed mobile carrying roughly six times the pageviews of desktop while session depth was higher on desktop — a strong signal of friction specific to mobile reading. That set the mobile-first direction.

What readers said

Three reading orientations

The constraint was never design quality. It was revenue. Every ad slot I wanted to move was someone’s number.

I ran alignment sessions with editorial and ad sales to map which placements were non-negotiable and which layout areas were open. That produced explicit boundaries to iterate inside — rather than proposing work that would be rejected later on commercial grounds.

The roadmap that came out of it balanced user value, operational stability for the editorial team, and technical readiness — against release timing and resource constraints.

Usage data that settled the arguments

Rather than removing low-performing UI on instinct, I pulled click share from H2 2024 and let the numbers set the direction. Every contested element sat under 1.3% — and four of the five under 1.1%.

My direction was consolidation, not removal. Navigation moved into a hamburger menu — its own click share is only 0.06%, but I kept it as an access path for the readers who still use it. Sharing was merged into a single button.

The breaking-news ticker had already been repurposed as an ad slot, and interviews showed three of four participants skipped it entirely. That told me the module had lost its original information value, so the right move was to realign it with stakeholders rather than quietly delete it.

For text size I proposed aligning article typography with the device’s native text-size setting, working with engineering — older readers already adjust it at system level. If it holds up, it replaces the in-UI toggle; I planned to validate that through post-release feedback.

The redesign had not launched before I left TVBS. The proposals were aligned with stakeholder KPIs and business goals; what follows is what was validated and handed over, not performance claims I cannot make.

• Validated in usability testing. Early testing confirmed the modular layout improved clarity and reading continuity, most clearly for mobile-first readers. Eight of the eleven concepts ranked in participants’ top five.
• Shared ownership across three functions. Grounding decisions in GA4 data and interview evidence reduced friction between editorial, product and ad sales, and sped up decision-making.
• Product thinking introduced to an editorial organisation. The conversation moved from page-level visual tweaks to system-level experience strategy.
• A foundation that outlives the release. Timeline-based storytelling, thematic clustering and modular blocks are all extensible toward personalisation.

What I took from it

1. Constraints are the brief

   Ad revenue was not an obstacle to design around — mapping it explicitly was what made the redesign implementable.
2. Design for the system you actually have

   Shuffle Next exists because the CMS could not support real personalisation. Designing for reader agency was the honest answer, not a compromise.
3. Legacy organisations move on evidence

   Click-share data settled arguments that opinion could not.