- Year
- 2025
- Platforms
- Responsive website (WordPress), shown on mobile and on desktop, and a local back office (PHP)
- What we did
- Product design, UX/UI and development
- Results
- 55k+ monthly visitors and 600k+ page views, less than a year after launch
The brief
musica.com.pt is an independent digital newspaper about Portuguese and international music, made by musicians for musicians and for anyone who lives music. The challenge was to give it a site to match: news every day, but also an archive of artists, a map of venues and an agenda you can actually use on your phone, on the way to the gig.
The site brings together in one place five things that usually live apart: the news, split into categories (Portuguese music, international music, premieres, albums, concerts, festivals, interviews, theatre, arts and production), the artists, the venues, the agenda of concerts and festivals across the country, and an academy of practical guides. And it links them: an artist leads to the articles about them, a venue to the events that took place there.
The editorial stance is open and paywall-free: the site lives on advertising and reader support (hence the support block and the ad spaces you see on the pages), and it has pages devoted to transparency, such as the editorial statute, the masthead and a policy on the use of AI.
Behind the site is Redação, the private back office where press releases, pages and notes become drafts in WordPress, with an AI that structures the fields but never writes the article (the rule of the AI use policy of the newspaper).
Who it is for
-
01
Readers who follow Portuguese music
They want to know what came out, what is coming and what the bands have to say, in a read that works on a phone.
-
02
People looking for something to do this week
They want to filter the agenda by city, type of event and date, and get quickly to the right venue.
-
03
Musicians, producers and promoters
They look for practical guides, news on gear and software, and visibility for their work.
-
04
Whoever edits the newspaper
They receive press releases from many sources and need to sort them, respect embargoes, prepare images and set up drafts without losing editorial control.
01 / 07
Homepage: the newspaper on desktop, light and dark
On a computer, the homepage opens with a thin bar of date and social links, the logo and the navigation by section (Portuguese music, international music, concerts and festivals, production and theatre), with search, newsletter, the theme button and the full menu. The lead story takes up most of the width, with a large photo, the headline, the summary, the author, the date and the reading time, and beside it sit a second story and a clearly labelled ad space.
The same page exists in a light and a dark theme, and a button in the header switches between them (by default the site follows the system preference). The dark one swaps the paper background for a warm ink, keeps the photos as they are and uses a lighter red for the labels.
02 / 07
On the phone: the newspaper in one column
On the phone the header shrinks to the essentials: the date and social links in a thin bar, the logo and four buttons (search, newsletter, theme and menu). The homepage reads in a single column, with the lead story large and, for each article, the category, the photo, the headline, the summary, the author, the date and the reading time.
In between there are blocks with an identity of their own. The featured concert, for example, gets a green card with the photo, the section and the date, the headline and a link to see all concerts.
03 / 07
Articles: reading, supporting and meeting who writes
The article page opens with the headline in capitals and goes on with the text set large, with important names in bold and the images (such as an album cover) at full width, to read well on a phone. Above the headline are the breadcrumbs and the category, below it the author, the date and the reading time, further down the text gains subheadings and embedded video and, at the end, the related articles. A button adds musica.com.pt as a preferred source on Google.
At the end of the article, a block invites the reader to support the newspaper, with three options (a monthly contribution, a one-off one, or just reading, which counts for a lot too), and right after it comes the box about whoever wrote it, with a photo, a role, a short biography and a link to all the articles by that person.
04 / 07
Supporting the paper, and advertising
The newspaper has no paywalls: it lives on advertising and reader support, and it shows. On the homepage there is a dark block that explains it in two sentences and offers two ways in, Patreon (a monthly contribution) and Buy Me a Coffee (a one-off one), next to the links to Instagram and Facebook, and the end of every article repeats the idea with a block of its own.
Advertising always has a labelled space, with the Advertising label and a dashed frame, so it is never mistaken for news (on the desktop homepage, for instance, it sits beside the lead story), and there is a page for advertisers explaining the formats.
05 / 07
Agenda of concerts and festivals
On the homepage, the block of upcoming concerts shows the month and the number of events and, on each row, the date, a thumbnail with the type, the title, the venue and the city, and the artists, with a way into the full agenda.
The full agenda brings together concerts, festivals and theatre from across the country, grouped by month, with a button to open each event. The filters let you pick the city (with the number of events in each), the type of event and the date, and there is a search by artist or venue.
Each city has its own page, past events stay archived, and the page carries structured data for events and frequently asked questions, to help search engines. On a phone the filters and the list fit in a single column.
06 / 07
Artists, venues and Academy: the archive
Every event in the agenda leads into an archive with pages of its own. The artists page is an index of artists and bands, each with its genres (rock, fado, hip hop, electronic, jazz and more), and each profile gathers the articles the newspaper has published about them, with structured data (MusicGroup) so search engines understand who is who. The venues page lists the halls, theatres, auditoriums and outdoor sites of the country, from the mainland to the islands, with the address, the website, the map buttons and the events that took place there, linked to the agenda.
The Academy gathers practical guides for artists, promoters and producers, with the level and the reading time, and Viseu ao Centro is a series about the music scene in Viseu, where the newspaper is based: reports, venues, music schools and the agenda of the Centro region.
07 / 07
Redação: the back office and the AI that does not write
Behind the site there is Redação, a bespoke tool the team uses every day. It is private, so it does not appear in images. It gathers in a single inbox the press releases that arrive by email, the pages and posts sent from the browser, the articles from feeds and the notes pasted by hand, understands embargoes and scheduling, handles the images (crops at the sizes the site uses and upscaling on the local graphics card) and creates the draft or the scheduled post in WordPress, with saving, SEO and promotion in the same place.
AI is built into each step, but only where it helps and never to write the article. It reads the press release and fills in the fields (headline, summary, category, tags and embargo, the last only if the text says so), with category and tags forced to the values that already exist in WordPress; it translates and, on request, produces the Instagram caption, the hashtags and the newsletter excerpt; it suggests terms and a sample paragraph for SEO; and it enhances small photos. It can run in the cloud or on a local model, chosen for each analysis, and everything goes through human review.
The draft that reaches WordPress is a skeleton (summary, facts, sources and an embargo notice), never text ready to publish: it is the same rule as the AI use policy of the newspaper.
Paper, ink and red
The site has two themes, light and dark: it follows the system preference and has a button to switch. The light one recalls a printed newspaper, with a paper background and near-black ink for the text; the dark one inverts them into a warm ink background with paper-coloured text, and a lighter red to keep the contrast. Corners are square and rules of 1 to 3 px separate the blocks. Red is the only accent colour, green only appears for positive states, headlines are set in Big Shoulders at weight 800, mostly in capitals, and body text in Work Sans. Redação reuses these colours and fonts, in light and dark, as one of its looks (it has another, blue and rounded).
musica.com.pt (light)
- Surfaces
-
#F3F2F2#E9E7E6#DEDBDA - Text
-
#1C1A19 - Red
-
#FF141A#CC0D12#C11212 - Success
-
#0D6B34#0A5228
musica.com.pt (dark)
- Surfaces
-
#151312#211E1D#2B2726 - Text
-
#F5F2F0 - Red
-
#FF3D42#FF7377#C11212 - Success
-
#3DDC84#63E8A4
Behind the screen
What it takes for a newspaper with this many images and content types to work well on a phone, and for the newsroom that feeds it to work fast.
-
A bespoke theme and plugins
The site is a custom WordPress theme with five plugins made for it: ads, concerts agenda, newsletter, related articles and search.
-
Artists, venues and events linked together
Artists, venues and events are content types of their own and link to the articles: an artist page gathers the articles about them, and a venue page lists the events that took place there.
-
Structured data on every page
Each type of page speaks the language of search engines: articles as NewsArticle, artists as MusicGroup, venues as MusicVenue, the agenda with a list of events and frequently asked questions, and breadcrumbs everywhere.
-
Light and readable
Variable fonts (Big Shoulders and Work Sans) served by the site itself, server-side caching and Cloudflare in front, so a page full of images does not weigh on a phone.
-
A local tool connected to WordPress
Redação is a PHP application with a SQLite database that runs on the newsroom's own machine, outside the site, and talks to WordPress through its API to create drafts and scheduled posts. A separate Python service does the SEO analysis.
-
AI that structures and never writes
The analysis runs in the cloud or on a local model, chosen for each item, and only fills fields with values that already exist in WordPress. Translation and the texts for social media are explicit requests, never automatic, and the article is always written by people.
-
Images handled on the machine itself
Cropping uses the site's real sizes and upscaling runs on the local graphics card (with the Real-ESRGAN and ATD models), so the photos never leave the machine. The originals are never altered.
What we did
We designed and built the newspaper end to end: the UX/UI and design system, the bespoke theme and plugins, the SEO structure with its structured data, and art direction from the visual identity. And we built Redação, the back office that takes a press release to a draft in WordPress, with AI and automation that structure without writing.
FAQ
Questions, answered.
-
An independent digital newspaper about Portuguese and international music, made by musicians for musicians, with news, artists, venues and an agenda of concerts and festivals across the country.
-
No. AI only structures what already exists (headline, summary, category and tags) and review is always human. The article is written by people, and the draft that reaches WordPress is a skeleton, not text ready to publish.
-
The newspaper's back office: a bespoke tool that gathers press releases, pages, feeds and notes in a single inbox, understands embargoes, prepares the images and creates the draft or the scheduled post in WordPress.
-
Yes. Tell us what you have in mind and we will tell you how we would approach it, from design to development. Write to us with the "Talk about a project like this" button, at the top and further down this page.
-
With a conversation to understand the goal, who will use the product and what already exists. That produces a clear scope, and we move forward in phases, with deliverables you can see and comment on along the way.