Advancing PM&R Bold

appr main app view

Project Details

The American Academy of Physical Medicine and Rehabilitation (AAPM&R) is the national medical specialty association representing more than 9,000 physicians who specialize in evaluation, diagnosis, and management of neuromusculoskeletal and disabling conditions.

Over the past 3 years, AAPM&R has worked with members to define future opportunities in the changing health care landscape, create a unifying vision, and create plans to help advance the specialty towards that vision.

Gulo was asked to create a brand new web experience to help AAPM&R promote this initiative.

The initiative has been called PM&R BOLD.

Challenge

AAPM&R wanted to make sure the initiative had a vibrant presence online that helps connect the dots of many related projects and tells compelling stories. Something beyond a website and more of an interactive experience that focused on helping their members understand the PM&R BOLD vision and see how it applies to them personally.

Project Requirements
  1. Flexible
  2. Support Various Types of content and media
  3. Tablet Friendly

 

PM&R Bold Splash Screen

Solution

The “Team Physiatry” concept is captured in an illustration designed by Ink Factory. Gulo was asked to turn the illustration into a virtual race around the track creating a way for physicians to click and learn more about certain practice areas and challenges the Academy is addressing.

Gulo turned the promotional printed illustration into a sophisticated AngularJS app using a headless WordPress CMS.

aapmr app main view

This is an incredibly engaging web experience and beautifully captures the story we want to tell our members. Our goal was to make this something they would share and talk about. The final result exceeds our expectations. Gulo delivered.

– Megan B., Senior Manager, Digital Marketing, AAPM&R

How it works

Each area is represented by a word bubble accompanied by an illustrated race participant. Upon click, an overlay appears and provides the user a story about the topic along with relevant multimedia like video. Each information-rich modal has a unique URL assigned to it so specific pages of the Team Physiatry experience can be marketed across social media and other marketing channels.

The interactive learning tool created a way for members to learn more about certain practice areas and challenges the Academy is addressing.

Technology

The front-end is a custom-built Leaflet / Angular application that interfaces with the a headless CMS – WordPress using the WP JSON API. The progressive web application asynchronously pulls content from the WordPress headless CMS for public consumption.

Headless CMS vs. Traditional CMS
Image Credit: Jackson Lewis at Dev.to

All the apps assets and content are managed entirely through WordPress. Staff gets the benefit of a custom asynchronous web app all while using the most widely used CMS on the planet. It’s quite amazing.

Building a non-geographic map using Leaflet and Angular provided content managers the ability to easily add new content anywhere on the front-end. It also provides users a natural and intuitive interface from which to navigate the racing track.

Technologies We Used
wordpress leaflet.js angular

Results

AAPM&R now has a one-of-a-kind web presence to help them promote their organization’s top initiative. It will be rolled out nationwide in the summer of 2019 and shared as a kiosk, iPad experience at their annual event.

Let’s build something special.