Planned Parenthood Direct (PPD) is a non-profit ancillary of the Planned Parenthood Federation of America that offers reproductive healthcare on the go. Drupal was the perfect solution for a decoupled website that informs users about the different reproductive health services offered in each state. The site directs users to download the Planned Parenthood Direct app in order to access services that are unavailable where they live. Evolving Web partnered with PPD to build out the new website and create a digital brand strategy that would appeal to younger audiences.
Security was an important consideration, as the current political climate around reproductive rights and family planning puts PPD at greater risk of cyber attacks. The decoupled architecture using the Next.js framework for the front-end addresses these concerns by completely separating the CMS from the website served in the browser. The new website provides a welcoming, informative experience that is instrumental in supporting reproductive rights and ensuring access to reproductive and sexual healthcare.
Goals
The main objective of the project was to build a captivating yet approachable website to compel people to download the Planned Parenthood Direct app. A secondary objective was to create a new visual brand identity for Planned Parenthood Direct that resonates with the younger audience and while still staying true to the Planned Parenthood brand.
Back to topChallenges
Different states have different services, and users need to be able to easily see exactly which services are available in their state. It also needs to be easy for the client to modify the services available within each state, since these can change.
Security was an important consideration, since the client’s work has become very politicized due to the current political climate in relation to abortion and family planning and they could become susceptible to attacks.
In order to provide service to a large, diverse demographic, there was a need to be able to easily translate the website to Spanish and easily add other languages at a later time. The website also needed to be fully accessible up to WCAG 2.1 standards.
Solutions
To help Planned Parenthood Direct achieve their goals, Evolving Web used a mobile-first approach, where we prioritized mobile designs and layouts and then adapted them to desktop.
Our project deliverables included:
- A decoupled architecture featuring a static front-end page using a Next.js framework and a Drupal powered backend, to optimize website security
- Using Drupal to store content that is used to generate static HTML pages to avoid dynamic code running on a server that could be exploited
- Cloud hosting on Pantheon to provide multiple layers of security protection, including fully managed HTTPS certificates, and DDoS protection to prevent denial of service attacks, as well as a container-based cloud architecture that allows for partitioning of the operating system into dedicated spaces
- Progressive disclosure to ensure a clean site coupled with uncomplicated functional pages, presented on a clear layout helps users easily find the information they need
- State-specific pages optimized for SEO make it easier for individuals to search for the services they need online and clearly see which services are offered in their state
- Allowing content editors to easily remove or associate healthcare services to a state
- Compliance with WCAG 2.1 AA guidelines, including a style guide that ensures content editors produce accessible content
- A library of reusable components that can be used by the client to create new pages and make updates to their content strategy independently
Results
The new website is a robust, secure decoupled Drupal 10 site that is strategically designed to drive users to download the PPD app while also providing the information users need in a clear format. To ensure it resonates with young adults, it leverages mobile-first design and the creation of a distinct sub-brand that features bold colours and supportive, destigmatized messaging. The new Planned Parenthood Direct website is instrumental in continuing to support reproductive rights and ensuring access to reproductive and sexual healthcare, which is now needed more than ever.
Back to topDrupal was chosen for its robust security, including regular updates from the security team, and rigorous coding standards. The ability to use decoupled architecture, enabling the front-end and back-end to operate independently, provides another level of security. The open source nature of Drupal also aligns with Planned Parenthood’s values of community and inclusivity.
Technical Specifications
Drupal version:
Key modules/theme/distribution used:
Drupal was chosen for its robust security, including regular updates from the security team, and rigorous coding standards. The ability to use decoupled architecture, enabling the front-end and back-end to operate independently, provides another level of security. The open source nature of Drupal also aligns with Planned Parenthood’s values of community and inclusivity.
