Narrative Lens - Browser Extension

Real-time media x-ray: One click pulls bias, tone, claims, and contradicting sources so you can judge any page’s credibility before it shapes your thinking.

Comment

About Narrative Lens

After a long week of doomscrolling, a few of us kept swapping links with the same warning: “take this with a pinch of salt.” We realised that even reasonably tech-savvy people struggle to work out whether a piece is reporting, opinion, or outright propaganda. That frustration sparked Narrative Lens, a browser extension that gives you a quick, evidence- backed sense of what you’re reading before it nudges your worldview.

Inspiration

We wanted something that sits quietly in the browser, then springs into action when you click, returning a trust score, ideological lean, tone, key claims, and (crucially) sources that either support or contradict the article. The idea was to feel like an x‑ray: instant, unobtrusive, and genuinely helpful.

How we built it

  • Manifest V3 extension with a lightweight content script that extracts the page title, main body and metadata using a measurable scoring function.
  • Service worker calls out to OpenRouter (DeepSeek V3). The LLM prompt is heavily tuned: we tell it to start the trust score at 50, move the number up only when evidence or balanced reporting is present, and push it down when it spots sensational wording, unverified claims, or one-sided framing.
  • Popup UI (vanilla JS + glassmorphism CSS) shows a radial trust gauge, ideology slider, tone tags, claims list, caveats, and source links. We keep everything client-side, caching the last result so you can flick between tabs and still see your previous analysis.
  • Icon pipeline generates the all-seeing eye from a single PNG via a Node script using pngjs, so the Chrome toolbar and extension page stay in sync.

Challenges & lessons

  • Bias drift: early builds returned identical scores (almost always 85). The fix was a multi-step prompt audit, explicit weighting, specific language about sensationalism, and a clearer rule for the left/right slider.
  • Source hallucination: the model would invent believable URLs. We switched to “include only if you’re confident” and display an empty list when it isn’t. (A future iteration will add real search-backed retrieval.)
  • Layout oddities: some news sites hide the actual article in shadow DOMs or infinite-scroll containers. We now clone the largest text node, strip scripts, and trim to fit the token budget.
  • Rate limits & fallbacks: during testing we got throttled and wired in a local mock payload with diagnostics so the popup still behaved. Once limits were sorted we removed the mock but kept the diagnostics option.

What we learnt

  • Prompt clarity is everything; if you want the model to use the full scoring range, you must spell it out.
  • People judge credibility faster when you surface contradictions visually, hence the “supporting vs contradicting sources” sections.
  • Browser extensions feel friendlier when they remember context; we cache the last report and show “Latest analysis: Article Title” so you always know what you’re looking at.

Narrative Lens isn’t meant to be an arbiter of truth, it’s a first-pass triage that helps you decide whether to read, verify, or move on.

Built With

Share this project:

Updates