The Ask
Though the program had an existing website, the team at CalSEED wanted to better showcase the entrepreneurs who received support from the fund and highlight their innovative climate solutions, both to celebrate the participants and encourage prospective entrepreneurs to apply. It was also important to have a way to educate ratepayers about how their money is supporting a more equitable energy future for California.
From an internal perspective, the team at CalSEED wanted a convenient way to update and add content to the website, a feat that was challenging with the way their current CMS (content management system) was set up.
The Solution
Based on the CalSEED team’s need for a flexible platform, we kept the site on WordPress but reorganized the backend to make the content easier to manage and edit. Working with our design partners at Manoverboard and Diverge Labs for content strategy, we were able to create an information architecture that allows current and prospective entrepreneurs and ratepayers to easily explore the website.
On “The Program” page, we leveraged compelling, interactive animations—some triggered on hover and some triggered on scroll—to educate users about program steps, timeline, and geography without solely relying on text. We’re proud to hand off a website that empowers the team at CalSEED to manage their content, as well as exhibits the impacts of this program on California’s clean energy innovation.
Highlights
To bring some life and interactivity to the page that outlines information about the program, we took static JPEGs from one of CalSEED’s reports and recreated them as animations. We chose Lottie for the two animations that are triggered on scroll and used SVG (scalable vector graphic) format to add motion to the map image on hover.
Roots:
- WordPress
Our Role:
- Responsive Front-End Development
- Custom Wordpress Development
- Graphic Design
Thinking about a project?
Start a project. Ask for advice. Say hello.
Mangrove respects the GDPR and will never share your information without consent. Read our privacy policy for more on how we handle your personal information.