News Weekly: Newspaper UI/UX Design

How do you bring the pleasure of reading a newspaper to a screen?

For News Weekly, we set out to give lead stories, opinion pieces and shorter reads their own space without making the front page feel crowded. Readers needed a clear way to browse sections, find a story and settle into a longer read.

This was a self-initiated design concept by Kwebby, built with original sample stories and fictional journalists.

We designed and built a newspaper-style website using HTML, Tailwind CSS and JavaScript. The front page combines a strong masthead, a lead story, a latest-news column, opinion pieces and photo-led features.

A dedicated news index brings the edition together with search, category filters, sorting and pagination. Article pages include reading times, an in-story contents list, writer profiles and related stories, plus controls for saving, sharing and printing.

Light and dark modes let readers choose their preferred view. The breaking-news ticker and rolling story carousel include pause controls, and the site links through to journalist, about, contact and saved-story pages.

The finished concept brings 12 sample stories across 6 editorial sections into one connected reading experience. Visitors can move from a front-page headline to an article, explore its writer and find another story through related reading or the news index.

The live demo shows the design and navigation in context. It is a portfolio project, so traffic, conversion and engagement improvements are not claimed. Newsletter signup and regional news are clearly marked as demonstrations rather than live services.