Mathias Rechtzigel

Federal Reserve Bank of Minneapolis

The Federal Reserve Bank of Minneapolis is one of twelve Federal Reserve Banks. When I joined in 2019 they were kicking off a reimagining of how they would serve the public. At the center of this rebranding was the tagline: "Pursing an economy that works for all of us."

In 2019 the application development group was a year into their Agile Transformation. They identified a gap in a dedicated Front End Development, User Experience and accessibility resource.

That's where I came in. I hit the ground running my first week: identified gaps within approved technologies that we could use to build out the Minneapolis Fed's first design system. I created partnerships between departments that rarely talked to each other and emphasised the importance of user-centered design. Finally being a consultant to our executive level sponsors to invest in an accessible, reusable and performant system that could support a 30+ year volume of content that they had to migrate from their legacy system.

During the completion of the project, they could point to deliverables that extended beyond the project. A design system wasn't just contained to the public website, it could be leveraged across our entire portfolio of internal applications (with some minor tweaks, you don't need big bold marketing fonts on internal data applications). Soon I was able to spin out proof of concept websites with real code in less than a day. Gaining budget and approval to expand the team for larger application initiatives.

It wasn't just a pie in the sky dream. With a decade of experience delivering responsive and flexible websites that could easily be modified based on the needs of our stakeholders.

Consistency for thousands of economic papers both new and old. #

As an economic research organization the Federal Reserve Bank of Minneapolis publishes A LOT OF PAPERS and supplementary educational material. With three core personas: uninformed, informed, and academic the Federal Reserve Bank of Minneapolis creates personalized content in service of its mission of "Pursuing an economy that works for all of us".

To support this mission, the Public Affairs team needed a technical and design strategy that would scale for the long term but also ensuring that the solution wouldn't place an additional burden on the content authoring team. This required a strategy that would ensure that all legacy content (30+ years), current, and future content could adhere to our new design language.

Article template on Mobile
Article page on medium
Article page on desktop

Reducing Spin on Red Balloon, Blue Sky Conversations #

You have been there. Someone says that you need to change some spacing on the "Card Component". Your developer opens up their fancy design system and low and behold there's four different cards that have different spacing on the four breakpoints that you support. Everyone is crunched for time because you're trying to do more with less (but somehow you always do less with more, isn't that funny?), so your development team makes a quick change and deploys it. Looks good on my machine, ship it.

A couple of weeks later the Creative Director adds a comment to the ticket: "Not seeing this updated. Let me know if you need any help."

Oh no. So much time has passed since the developer has made the change that they can't quite remember what they changed, and now they have to make another change.

All design debt is technical debt and it's important to manage it upfront then letting changes cascade into the future where the easiest way to fix the issue would be to start from scratch.

How can we fix this? During my time at the Federal Reserve Bank of Minneapolis I created a couple of tools to help reduce this spin. Instead of having our wireframes as pdf's on the server, the names of the components in the design system, and the back end code naming their components in different ways I created a tool based on Eric Meyer's Generating Wireframe Boxes with CSS and HTML5 that allowed each and every component we created to have a consistent nomenclature across multiple projects and code repositories.

In short... I baked the wireframes INTO the website, and with a couple lines of CSS and Javascript, anyone could toggle "Wireframe Mode", eliminate spin, and start speaking the same language. Designers could more easily communicate with back end developers and it reduced gaps between teams.

Example of Minneapolisfed.org with the wireframe mode turned on.
The same example of Minneapolisfed.org with the wireframe mode turned off.

Multi-platform Consistency #

Responsive design was table-stakes in 2019, now users expect that the content they see is consistent across all of their platforms. Luckily we were able to add a few lines of automated meta tag magic via Sitecore to ensure that when the public or one of our partners shared an article on Linkedin, Twitter, or Facebook it would use our branded images.

In addition, this allowed our social media professionals to spend less time wrangling images, tiles, and descriptions and more time focusing on a long-term content strategy. More with less and being good stewards of the public funds.

Image of a MinneapolisFed.org website shared by the Boston Fed, with all branding on Twitter. Image of a MinneapolisFed.org website shared by the Minneapolis Fed, with all branding on Linkedin.

Winning hearts, minds...
and budgets #

We launched Minneapolisfed.org eight months after I joined. It was like having chewbacca in the pilot seat and telling him to punch it. During and after this project I was assigned to larger and increasingly ambitious projects.

  • I conducted technology forecasting that set the direction for a 20+ person technology team.
  • Highlighted and defined a headless content strategy that would leverage Sitecore 9.3's JSS functionality.
  • Pitched and acquired funding for a Customer Experience and User Experience team, to support the Treasury Department that was comprised of User Experience Architects, Researchers, Technologists and Product Designers
  • Lead the procurement and security vetting process on a suite of tools to support secure usability testing with the public
  • ..and much more!

But most of all, working within the Federal Reserve Bank of Minneapolis gave me a greater appreciation for public service at all levels of government. There are some extremely talented folks out there who are making sure that the government is running smoothly. It was an honor to work alongside them.