Department of Energy Website Redesign & Development

Department of Energy Website Redesign & Development

2026-03-01

IC Work - Real World Project

I worked on this project while at Accenture.

Government | Accessibility | Drupal | Site Migration

View Website

Role & Impact

  • Role: Frontend Drupal Engineer (Individual Contributor)

  • Impact:

    • Built custom twig tempates and preprocess functions used to build out the frontend UI.
    • Worked on R&D and technical buy-in presentation for Drupal 7 to Drupal 9 migration.
    • Created custom content types, views, and fields within the Drupal CMS to support the new website's content structure and presentation needs.
    • Implemented accessibility best practices in the frontend codebase to ensure compliance with WCAG 2.1 AA standards.

Tech & Project Type

  • Project Type: Government | Accessibility | Drupal | Site Migration
  • Built & tested with: Drupal, Twig, PHP, JavaScript, HTML, CSS, USWDS

Context Overview

The Department of Energy (DOE) is responsible for shaping the nation's energy policy and advancing scientific research in the energy sector. The DOE's website serves as a critical platform for disseminating information, resources, and updates to the public, researchers, and industry stakeholders. The project involved developing the DOE's redesigned website to enhance user experience, improve accessibility, and modernize the site's architecture.

DOE Website DOE Website

Technical Details on Contribution

Drupal 7 to Drupal 9 Migration R&D

I was onboarded with another engineer before the project kicked off, which gave us the opportunity to support the R&D and technical buy-in process for the Drupal 7 to Drupal 9 migration. Because there was a large architecture change between Drupal 7 and 9, we researched migration best practices, potential challenges, and mitigation strategies. We then created a presentation to help the client evaluate Drupal 9 advantages and migration risk areas. This supported an informed decision to move forward with Drupal 9.

Twig Templating & Frontend Implementation

As a frontend engineer on the DOE website redesign project, I worked closely with a collaborative team of Accenture and Phase 2 engineers. My primary responsibilities included referencing the USWDS design system to build custom Twig templates that formed the basis of the frontend UI.

From a design perspective, we utilized the atomic design methodology to break down the UI into reusable components. The components were then styled using BEM naming conventions which were implemented into the Twig templates.

Drupal Content Types & Views

One business requirement for the DOE website was a structured content architecture that supported easier content and asset management. To meet this requirement, I created custom content types, views, and fields within Drupal's CMS.

Challenges and Solutions

  1. Drupal's frontend architecture isn't set up for React-like component-based development. Building the frontend required deliberate planning so Twig templates stayed reusable and maintainable.
  2. Drupal 7 to Drupal 9 migration introduced complexity because of significant architecture differences. I researched migration patterns and helped shape implementation strategy with the team.
  3. Drupal frontend development has unique constraints because of its monolithic architecture. I had to account for how frontend UI, content architecture, and custom modules would integrate.

Business Impact

  1. A mobile-first web experience providing citizens and researchers with intuitive content and data access
  2. Updated and modernized architecture that allows for easier maintenance and content management by the DOE team
  3. Content refresh and restructuring to make information more accessible and easier to find for users