• Content/Data Migration
  • Design
  • Engineering
  • External APIs
  • Ongoing Support
  • Strategy

Supporting digital transformation for a forward-thinking California government agency

OSHPD.ca.gov Website Redesign

The Office of Statewide Health Planning and Development (OSHPD) improves access to quality healthcare for Californians, ensuring hospital buildings are safe, offering financial assistance to individuals and healthcare institutions, and collecting and publishing healthcare data.

OSHPD had an aging website that was difficult to update and frustrating for visitors. The aging front end of the site was challenging to navigate on a tablet or smartphone; constituents and citizens struggled to find the information they needed, no matter the screen size. A hard coded website with no CMS, all website updates were routed through a busy IT department for coding — causing a significant bottleneck in public information dissemination.

OSHPD.ca.gov Website Before Working With 10up
The original OSHPD.ca.gov website before working with 10up.

Motivated to transform their digital footprint, OSHPD began by engaging a specialized consultant who performed preliminary user research — identifying and profiling the needs of the website’s audience. Upon a recommendation from the consultant, and following guidance from the State of California to embrace open source solutions like the WordPress CMS, 10up was invited to speak with OSHPD leadership about WordPress as a platform for a revitalized website. Those discussions, which included an initial look at internal prototype implementation efforts, were later followed by 10up being awarded a competitive contract to redesign and implement OSHPD’s online presence.

A Modular Approach To Web Design

Rethinking the website experience with a constituent centricity began with a focus on information architecture and organization, namely improving site navigation and wayfinding, so that citizens and other visitors could find the content they were seeking faster and more easily. 10up leveraged the preliminary user research as the foundation for a clear information architecture.

The timing of the OSHPD website redesign aligned with the development of an entirely new modular, block-based editor for WordPress that fit with a modern, component-based reimagining of the editorial experience for content managers. OSHPD’s forward-thinking leadership gave the green light to adopt the new editor, which was still in beta. This not only future-proofed the new build — it unlocked a flexible, modular approach to the redesign and editorial vision.

Rather than designing highly prescriptive (and constraining) individual page templates for the entire site, 10up created style tiles that visually showcased design treatments (e.g. fonts, color palette) and individual key components (interface elements) that would collectively define the website aesthetic.

OSHPD.ca.gov Style Tile Example

With the style tiles establishing a common visual language, 10up also designed individual site components, encompassing global template-level elements like the header and footer, as well as page-level elements (blocks) that could be assembled in virtually unlimited configurations to create visually appealing, unique page designs without requiring a developer.

OSHPD’s UX research provided the foundation for wireframes of static global elements like the website header, footer, and key pages like the homepage and facility finder. The wireframes gave OSHPD a framework for intuitive content hierarchy and a systematic user experience that guided future page layouts using built in and custom blocks.

To empower a broad group of OSHPD staff to update and maintain the new website’s pages and content, 10up collaborated with OSHPD to reimagine a custom editorial workflow, that included 10up’s open source plugin WordPress Safe Edit. WP Safe Edit adds the ability to draft modifications to pages (and other content) that have already been published, which 10up augmented to require users in more limited roles to attain approval through OSHPD’s internal approvals workflow before making changes public. (By default, WordPress content is either in a draft or published state, and changes to published content are made visible immediately upon saving changes.) IT staff were removed from the publishing process, unblocking workflows without jeopardizing content accuracy or review.

Upon approval of the visual design system, 10up built out the new OSHPD WordPress site, ensuring State of California accessibility and design requirements were met and integrating third-party tools such as Tableau, CKAN, and ESRI. When the site was completed, OSHPD managed the final content migration and website launch, with 10up providing training and consulting on infrastructure configuration and management to empower the internal technology teams.

OSHPD.ca.gov Reusable Components

Cloud Infrastructure

10up’s systems and cloud reliability team specializes in establishing and configuring cloud hosting infrastructure to support secure, scalable, performant WordPress sites. After conducting an audit of OSHPD’s existing Microsoft Azure Cloud infrastructure, 10up delivered a tailored set of recommendations, guidelines, and best practices that enabled OSHPD systems engineers to confidently host their WordPress site using their existing, mandated Azure cloud platform. From configuring WordPress and its hosting environment on existing infrastructure, to providing security best practices, to supporting load testing and security audits, 10up collaborated closely with OSHPD to prepare for a smooth site launch and continued reliability.

Accessibility Compliance

10up engineered the new OSHPD website in accordance with CA Assembly Bill No. 434 (AB-434), which requires California State government websites be certified for compliance with WC3’s latest Web Content Accessibility Guidelines (WCAG 2.0) AA and the Americans with Disability Act (ADA) Section 508 by July 1, 2019.

Accessibility is a core aspect of 10up’s engineering methodology and philosophy. From website infrastructure to visual design and content creation, 10up employs — and has open sourced — a variety of tools to build and test for website accessibility from the ground up. 10up delivered a robust, engaging site experience that exceeded WCAG 2.1 AA compliance.

Tableau Integration

Many government agencies use tools like Tableau to create and share interactive visual representations of their data. Embracing OSHPD’s adoption of Tableau to turn their data into engaging charts, maps, and graphs, 10up built a custom Tableau content block for the new WordPress editor. Using the Tableau block, OSHPD content managers can easily copy snippets from Tableau and paste them into WordPress to add custom data visualization graphics, like interactive maps, to any web page.

OSHPD.ca.gov Tableau Integration

Open Data Sharing

OSHPD has a treasure trove of data about public health and hospital safety in the State of California at its fingertips, spread across different data sources with no way to easily share all of it with the public.

To solve previous third-party data integration challenges, 10up migrated the site’s advanced document indexing and search capabilities to Elasticsearch, a central data solution that delivers lightning fast search, fine-tuned relevancy and weighting, and powerful analytics. Content and metadata from the WordPress site’s database, static documents like PDFs or Microsoft Office files, and other data sources feed into Elasticsearch so that all content in every format, and from different sources, can be easily searched on the site and accessible to all audiences.

In the spirit of open data sharing, California state agencies like OSHPD also share data on the California Health and Human Services Open Data Portal to make it available to other agencies and the public. 10up engineered an integration with the California Open Data Portal API to pull a subset of OSHPD’s data into their new site, ensuring the data is consistent across platforms.

Training And Ongoing Support

WordPress puts site managers in control of the site content, providing the ability to create and update content in a user friendly interface that doesn’t require ongoing support or expertise from trained technology professionals. To ensure the state agency remains self-sufficient and not reliant on any third-party vendor, 10up provided comprehensive WordPress training for both content owners and technical support staff on the OSHPD team.

  • 10up trained OSHPD engineers on WordPress coding standards and Git-based deployment workflows, and continues to provide weekly training and code reviews leveraging screen sharing and video conferencing.
  • 10up developed a WordPress administrative content management training curriculum with OSHPD, enabling them to train program managers to manage their own content on the website.

OSHPD and 10up continue to iterate and improve the website, centering many of these improvements around user testing and other data.

“We had a very positive experience! 10up brings a professional, veteran team with a wide range of domain expertise. In my experience, this is rare to find.

Our website has garnered attention as one of the best in California government. We were one of the first adopters of WordPress and our template has since been leveraged by several other agencies. We are now well-positioned for increased mobile and data analytics adoption.

I appreciate the long-term partnership with 10up and I’m happy that other government agencies have been exposed to your firm. This is resulting in better government websites and digital services for all Californians!”

— Michael Valle, Chief Strategy Officer, Information Services, OSHPD

Government Partnerships

10up and OSHPD are also united in their advocacy for open source, particularly identifying opportunities to share their work and innovations with other government agencies. As an example, since launching the OSHPD website, 10up has reused the OSHPD WordPress theme as the foundation for the California Department of Corrections and Rehabilitation (CDCR) and for a microsite project for the California State Department of Motor Vehicles (DMV).

To learn more about leveraging open source technology like WordPress to empower your government agency, enterprise, or other organization, and better communicate your mission and message online, contact 10up today.

Let's build something great