WETA

Upgraded design and architecture for educational literacy website

With a longstanding partnership with the development and maintenance of several websites, WETA wanted to update and improve AdLit, an entity that seeks to nurture and advocate for literacy in middle and high school-age kids.

Services:
Design
Front-end Development
Back-end Development
Migration
Accessibility
Drupal
Site Architecture
Planning & Strategy
Technologies:
Drupal 9
Project Link:
Student sits on bench reading a book in front of artwork

Project Expertise

Migrations & upgrades

The site was on an antiquated CMS in need of a new system that would be the basis for other sites within the WETA family. RDG built a custom migration that allowed for the existing content to be pulled into the new CMS with a better architectural foundation for future maintenance and growth.

Project Contributors

Jonathan Chaffer head and shoulders image, wearing glasses and a plaid shirt

Jonathan Chaffer

Senior Developer

Ashley head and shoulders, with glasses, brown hair, and burgundy shirt with cream cardigan

Ashley Helminiak

UX Designer, Front-end Developer

Haley head and shoulders, with glasses, brown hair, black shirt with light denim overshirt

Haley Troyer

Front-end Developer

Project Brief

AdLit was in need of a design and development overhaul to appeal to their audience and be easier to maintain. As the first site within the WETA family to be built in Drupal 8 (soon to be Drupal 9), there was a desire to leverage this site build into future upgrades of other WETA entities in a variety of ways. In order to accomplish this, it was collaboratively decided that the site should:

  1. Be built with a clean and well-organized theme that can extend to other sister websites in the future
  2. Have features and capabilities that could carry from site to site without requiring a large amount of custom effort, such as a book finder tool and full site translation
  3. Standardize on a set of core content types and building blocks that allow for migration of content while supporting an improved administrative experience
old AdLit homepage with gradient dotted background and narrow fixed width content
new AdLit homepage with full width navigation and image slider

What We Did

We built the new AdLit site with due attention not only to its own requirements, but to the needs of the entire suite of WETA sites. This informed the development of the site architecture and features in a way that makes it a good base for future site upgrades.

For example, the WETA site Colorín Colorado is bilingual, while AdLit is for an English-speaking audience. Since our framework  takes on this multilingual baseline, it will be easy for AdLit to be translated into other languages later if need be. We also developed a theme infrastructure that would allow for a basic visual framework to be shared across sister websites while allowing each individual site to showcase its own branding and design.

Challenge

Design a fresh new theme that can minimize future development effort on sister websites

Solution

Create a parent/child theme structure to separate site layout and brand elements

For AdLit, we took the opportunity to look at ways we could minimize the cost for future Drupal upgrades for the WETA suite. We decided to separate the site grid and layout into a parent theme that could be reused on other entities, and rely on a child theme to implement the AdLit branding. This means that when the next site is ready for an upgrade, we will already have a base theme in place that minimizes the amount of front-end development work we need to do.

Challenge

Leverage site elements for future use on sister websites with similar content

Solution

Build a standard set of content types and building blocks

Along with the parent and child theme structure, content types and site features were created while looking at other sister websites and their requirements, and consequently built into each element from the beginning. For example, book and author relationships are core to not only AdLit but Colorín Colorado, Reading Rockets, and Start with a Book. These content types are implemented in a generalized method that will satisfy the needs of all the sites.
four air and space themed books in bookshelf style on AdLit site
Content-area Literacy Topics page, desktop layout
Content-area Literacy Topics page, mobile layout
The new site is an amazing leap forward over the old: appealing, inviting, accessible, seamlessly scalable, and extremely user-friendly. RDG has consistently delivered more than promised and through all the months of challenging work, they've been—from everything I've seen and heard—exceptionally resourceful in finding solutions and unfailingly easy to work with. I think as more educators and families start discovering the new AdLit, they will love what they see.
Noel Gunther Vice President, Learning and Interactive Media, WETA-TV-FM