City of Oakland

A six-week project to streamline the City of Oakland’s process for awarding capital contracts. The engagement had two phases, the later of which included the design of a website to orient potential vendors to the process.

August 2020–October 2020
My role

I wrote the proposal for the project and lead all efforts in the second phase of the project, including: all design work for the website, project management and coordination with the City of Oakland’s Digital Services team on the final build out .


It’s especially hard for small businesses

While the City Council earmarks budget specifically for capital projects – projects that improve the city’s infrastructure – the process to apply was complex.

This complexity translated to many small and minority-owned businesses loosing out on opportunities, as they often couldn’t afford the up-front cost needed to see a bid through to award.


Simplify capital contracts

EchoUser was subcontracted by see arch. to lead a service design project to reimagine the capital contract process.

Phase 1 of the project looked at Oakland’s internal processes and was lead by an EchoUser researcher. In Phases 2, I lead an effort to redesign the Division’s website.

This case study examines the process of Phase 2, which culminated in a relaunch of the
Capital Contracts Division website in the winter of 2021.


Insights from Phase 1 research

Phase 1 closed out with a series of interviews with small business owners about their experience working with the Capital Contracts Division.

The insights framed the challenge that we would face in designing the external-facing website in Phase 2:

How might we structure information in a logical way that aligns with the vendors’ process stages?

How might we put the most used/ requested information/ forms at the vendors’ fingertips?

How might we explain the RFP and contract process in lay terms to make it easy for any vendor to understand?

How might we demystify the requirements/ qualifications for opportunities?

How might we share more about the team to build “good will”?


Setting constraints with a competitor analysis

Building on insights discovered in Phase 1, a competitor analysis was conducted to find examples of best practices in website design that specifically meet the needs of vendors, as identified in the vendor interview.

Websites (many of which were suggested in the vendor interview itself) were explored and evaluated based on how well specific design elements that address the critical issues raised.


Establishing a hierarchy of needs

While we learned that vendors will approach the site with many questions, the competitor analysis gave us a framework for how to progressively detail instructions on the site.


The iterative process

The existing Division’s website was sparse, so the project and stakeholder team was starting from a largely blank slate.

This ended up being a bit of a mixed blessing – while this allowed for tremendous creative freedom, the content was being created for the first time, as were many of the working relationships between the department and Oakland’s Digital Services team.

In the end, however, the iterations lead to buy-in and a feeling of agency among the team. So much so, in fact, that the project survived a changing of senior leadership.

At the first round of feedback, three options were presented to the team in order to ascertain preferences on tone, information hierarchy. and use of Oakland-specific components

After the initial round of feedback, a mockup was usability tested with a small business vendor to stress-test the design.

The feedback generally suggested that we needed to explain the contract process in even more basic terms – it still wasn’t easy for vendors to understand how to get involved, or what would be required.

The final round of feedback was with the Oakland Digital Services team, in order to identify if anything in the design was impossible, from a technical perspective.

While we were careful to follow Oakland’s style guide and tried to only use components that we saw elsewhere on the site, we just weren’t sure about what was feasible.

In particular, the front page graphic ended up causing problems and requiring a compromise.


The new Capital Contracts Division website

After a brief overview of the division and greater departmental context, the site features a graphic that breaks the process down by different project types. Each step is laid out visually, with a detailed walk-through following below.

While the final version expands language in some areas, the overall structure and ethos of the site was built-out according to specifications and went live just a few months after wrapping the project up.


Buy-in leads to better design

What was at first a frustrating aspect of the project – the pace of bureaucratic process –  ended up being the project’s greatest asset.

By the end of the project, I realized that what felt like miniscule design changes that came out of endless feedback sessions was actually what the process of building momentum can look like.

This realization came suddenly, in an epiphany at the end of the project. The name of the division throughout the project was the Contract Services Division. It always struck me as a vague, and not very descriptive, but a name change was beyond our scope.

Having presented the pen-ultimate mockup before winter break, we returned to hear than the group had met and unanimously decided to change the name to the Capital Contracts Division. In the words of the project manager, our projet had helped him see the process through the eyes of their customers, and as a team, they wanted to give their division a name that was clear, memorable, and succinct.

No workshoping and no brainstorming sessions, just unprompted change making.