Drupal 8 marketing and event site

When AOA Racing decided to update their image, they knew their old content management system was not up to the task, it was time for a fresh start.  

From early on, my focus would be to create an easy to use interface so that AOA would feel comfortable adding and editing content.  I wanted the content edit screens to reflect the live site as much as possible, with simple modals for controlling layout, adding components, and customize the styling.  This allowed AOA to create custom, one-off pages that conformed to their new brand standards and immediately decide if they liked the results.

AOA wanted to display their racing schedule and allow visitors to book their race cars for events.  They were already maintaining a Google Calendar with their racing schedule, and they didn't want to maintain that information in two places.  I connected their Google Calendar using the Feeds iCal module to import the data and save as Drupal nodes.  Then I created a custom calendar module to display the events, embedding a Webform to collect visitor booking requests.  This allows AOA to continue using the tools they love and get the benefit of the completely automated booking system.

 During training, one staff member commented, "This is much easier to use than our previous site."  

AOA Home page design

Home page redesign

Racer car enthusiasts love to watch racing.  AOA already had professionally produced videos, which they wanted to feature on the home page.  But we also wanted to make it simple to add and edit content, giving editors the most flexibility to create page layouts and style the content, without breaking their brand standards.

AOA additional features

Customized Components

AOA's Drupal 8 theme makes extensive use of libraries to keep the global CSS and JavaScript files small and performant.  Features, such as this FAQ widget are easy to construct and are light weight, with excellent scores on Pagespeed Insights and WebPage Test.  

AOA Racing - Events page

Custom Events Booking Calendar

The custom Events booking calendar automatically pulls events scheduled in Google Calendar and creates Drupal nodes.  Visitors can then either book the event or get more details.  The calendar is a custom controller that generates the entries and uses a custom twig template to create the calendar.

Project Timeline

Existing Site Evaluation

Existing Site Evaluation

While the original site's proprietary CMS included many available features, it was cumbersome to create consistent content.  There were no controls for enforcing brand standard, such as colors and fonts, and no support for SVG.  Being proprietary, adding custom features, such as Google Calendar integration, was not possible.

Complete redesign and rebranding

New brand, better user experience

What is more exciting than trading paint at high speeds?  AOA wanted to highlight their professional video footage for a more engaging experience.  The new design is lightweight with a lot of subtle touches to give it that polished feel.

Booking Events has never been easier

Booking Events has never been easier

The new site uses a custom calendar that displays events automatically pulled from Google Calendar and integrates a booking system.  Customers simply find an event and book it directly on the site.