About this project
Built the Center for Sustainable Energy's primary digital presence, EnergyCenter.org, from the ground up in Drupal. The design team delivered detailed Figma comps covering every breakpoint and interaction state, and my job was to translate that into a fully realized, production-quality Drupal theme, pixel-perfect from the marketing team's vision to the live site.
The build required heavy animation and motion work throughout. Every page carried intentional movement: scroll-triggered section reveals, animated counters for key program statistics, parallax layering on hero sections, and sequenced entrance animations on content blocks. Keeping all of that performant across devices (particularly on mobile, where animation can destroy page feel if handled carelessly) was one of the bigger technical challenges on the project.
Key deliverables included: Custom Drupal theme built entirely from Figma (no off-the-shelf starter theme) Scroll-triggered animations and intersection observer implementations throughout Animated data visualizations for program impact statistics Responsive motion design that degrades gracefully on reduced-motion preferences Custom content types and field architecture to support CSE's program structure Performance optimization to maintain fast load times despite rich front-end interactions
Screenshots
