Case study · Drupal
Ribera del Duero
Website for the Regulatory Council of one of the leading designations of origin in Spain and worldwide: a site that tells the story of a region and serves the whole industry behind it.
- Client
- Regulatory Council of the D.O. Ribera del Duero
- Scope
- Web design
Drupal development: front end, theming and back end - Technology
- Drupal · Views · Webform
Paragraphs · Layout Paragraphs
A website that lives up to one of the leading designations of origin.
Editorial art direction: large-scale imagery, typography with character and room to breathe, so the wine and the landscape take center stage.
More than 300 wineries and 2,500 labels, easy to find in seconds.
Built in Drupal with reusable components, so the Council’s team can publish content and build pages on their own.
The challenge
A designation of origin speaks to two audiences at once: people who want to discover its wines and people who work with them every day.
The site had to capture the emotion of a unique region while organizing a large, constantly changing body of information: terroir, grape varieties, vintages, wineries and labels, Enopedia, press releases, events, wine tourism… all with a consistent experience on desktop and mobile.
Tell the story
A visual story of the region: climate, soils, altitude, vineyards and history, told chapter by chapter.
Organize
A clear content architecture—The D.O., Enopedia, Wineries, Communication and Brand, Wine Tourism, International—each with its own secondary navigation.
Serve
Useful tools for consumers and the industry: a winery finder and map, vintage ratings and buying direct from the wineries.
The home page
A home page that inspires and points the way.
The home page opens with a full-screen campaign and, within a few scrolls, gets each audience where it needs to go: the story of the D.O.’s exacting standards, the winery finder, shortcuts to Enopedia, Vintage Ratings and Wine Online, and the latest news and events.
The D.O.
The region, told chapter by chapter.
Climate, Soils, Grape Varieties, Altitude, Vineyards, Our Wines, Vintages and History: each chapter has its own page, with shared secondary navigation that invites you to keep reading. The section’s landing page uses visual cards, while the reading pages go into detail with large-format photography.
Every chapter works just as well in the palm of your hand.
Tempranillo, Cabernet Sauvignon, Merlot, Malbec, Garnacha Tinta and Albillo Mayor: visual profiles, each with its own illustration and key traits.
Typography, rhythm and hierarchy designed for unhurried reading, on small screens too.
Features
Tools for consumers and the industry.
-
01
Winery finder and map
Search by name, results as image cards, and an interactive map that clusters wineries by area and spreads them out as you zoom in.
-
02
Winery pages
Every winery has its own page: gallery, address and contact details, location on the map, video, the labels it produces and its wine tourism services. One template, populated from the CMS.
-
03
Vintage ratings
Every rating since 1982, with each vintage’s press release one click away.
-
04
Enopedia
A video library for discovering Ribera del Duero wine, guided by winemakers and sommeliers.
Communication and brand
A newsroom that’s always up to date.
Press releases, advertising, events and sponsorships, a press kit and an image library, all in a section of their own. News is published once and shows up wherever it belongs: in its paginated listing, on the home page and in the events calendar.
Under the hood
Drupal, built right.
A large site needs a solid foundation: well-modeled content types, reusable components and listings that update themselves.
Paragraphs + Layout Paragraphs
A library of components—text, images, cards, callouts, videos—that the team combines to build each page without touching code.
Views
Listings, search and filters: wineries, press releases, events and vintages sort and paginate themselves as new content is published.
Webform
Forms managed right in Drupal, with no custom development every time a new need comes up.
Responsive design
A single design that adapts from desktop to mobile, with the same hierarchy and the same attention to detail.