We open up: Redesigning the CivicActions home site

It’s probably safe to say the CivicActions delivery team is happiest when working on projects for the greater good. Opportunities abound for us to make a difference in civic tech right now, from helping Doctors Without Borders support human rights to helping Child Welfare Digital Services provide better care for at-risk children. Updating and redesigning our own site doesn’t hold the same world-changing potential — but it does allow us to reach more people who may become our co-workers, clients, or partners in helping us continue to serve mission-focused organizations.

While the new site isn’t going to save any lives, the redesign project held value as an opportunity to create something radically open that could help people learn. As we focused on building transparency into the design and process of civicactions.com, the team got satisfaction from the chance to demonstrate CivicActions’ values in a way that was closer home (pardon the pun).

From foundation to facade, civicactions.com is an open house. Here’s how we built it:

The right tool for the right job

We usually work with content management systems to help government agencies handle complex data and serve large populations. The needs of our site were more modest, so the team decided to keep it simple. Designed to be static and lightweight, we built the new site with Gatsby and ReactJS for fast performance and low maintenance. Paring it down was fun, according to front-end developer Iris Ibekwe who led the technical vision for the project: “It’s freeing to try something new and craft the site to be just what we need.”

Realtime Boards helped us design for users’ needs by mapping site visitors.

Agile + UX

It was also important to keep the content and design fast and light — including only what’s important to us and those we serve. We integrated UX from the beginning so our decisions would be informed by the needs and behavior of real humans who visit our site. Tools such as Realtime Boards and practices such as tree testing helped us focus on the essence of who we are and what we do, without overwhelming the user (or the servers) with excessive info.

We used Zeplin to create design mockups for easy sharing with the rest of the team. Everyone got glam alter egos on the team page test design, thanks to our visual designer Jacqueline Gu.

Fiercely open

Although the team opted to use new tools for the job, we approached this project with the same commitment to openness and transparency that we bring to our client engagements. We like to say that we’re “fiercely open.” It’s not just bluster — that “fierceness” comes from the belief that by being transparent and sharing our work, we can support the broader community of civic technologists to transform government services.

By being transparent and sharing our work, we can support the broader community of civic technologists to transform government services.

Civicactions.com is accessible as a public repository so anyone can use and improve on what we built. We also added an 18F-inspired feedback link to our footer so folks can easily share problems or suggestions.

For sharing and learning

Our new site shows how we use modern technologies and iterative approaches to support better outcomes for people — like improving transparency in state government or helping adult education practitioners do their jobs better. We also enjoy geeking out over the stats (“5,000,000 items of legislative data made accessible on a public platform!”). But we also wanted to make our site more useful to everyone by including links to resources and tools, from Web Content Accessibility Guidelines that inform our work to Drupal modules maintained by our engineers that continue to be used by other civic technologists.

Our new site shows how we use modern technologies and iterative approaches to support better outcomes for people.

As we work on future projects and continue to develop our service offerings, we plan to add guides and other helpful info on topics like DevOps, free and open source software, remote teams, accessibility, and service design. The goal is to help people understand the how and why behind our work — so anyone can use and benefit from our learnings.

Welcome home

The launch of our redesigned site was a moment of celebration and gratefulness for the people who make this a great place to work. CivicActioners are caring, open, and passionate about technology that puts people first. We’re also into a lot more than just our work. Sound like you? We’re looking for new folks to help build digital services that work for everyone. Join us!