Front End Development, Backend Development, WordPress

Hospitals can have a difficult time breaking free of the enormous amount of content needed on their main website. Cullman Regional Medical Hospital was interested in engaging a youthful audience with healthy tips and an easy way to find a physician. An elegant and interactive micro-site would be the focal point for the integrated campaign developed to launch the new brand.

After choosing a desired specialty, preferred gender, and location visitors are given a list of matching doctors. Using Ajax, the list of doctors update automatically on each selection. All the doctor profiles were created as post types in WordPress so that the entries would be easy to update. A lead form allowed visitors to submit their doctor selection to the hospital.

Mobile Friendly and Cross Browser Ready

The site was tested thoroughly to ensure that the doctor matchmaker flow worked just as well on mobile devices. This was accomplished with Chrome dev tools and a variety of iOS and Android devices. Browser Sync allowed me to view click and scroll events simultaneously on many different browsers and devices during my QA testing.

Working on development projects closely can lead to issues being unnoticed. Using Bugherd allowed testers to identify any issues early so I could resolve them before launch.

The Cullman homepage hero

Animations with graceful degradation

The designer, Elias Julian, created some beautiful icon illustrations throughout the site. I wanted to showcase this by animating the doctor illustration when it loads for the first time. Using the css attribute ‘stroke-dashoffset’, I was able to give the appearance that the doctor was being drawn in line by line. The css classes generated by Modernizr allowed me to make sure if the animation wasn’t compatible with a user’s browser, a static version would display instead.

See the Pen doctor illo by Tony (@tones350) on CodePen.

Staying healthy isn’t one choice. It’s a lot of little ones. That’s why Cullman Regional offers so many.