Updating of Patient Telephone Supply

Patient Telephone Supply shown as a responsive site on several devices.

Overview

Patient Telephone Supply is a dedicated to providing telecommunication products and solutions to healthcare facilities. They are the premier supplier in the United States and Canada. The tech originally used to create the site had depreciated and none of their order or contact forms were being submitted.

Objective

  • Decouple the site architecture and set up a headless cms so client can update their own products.
  • Ensure that all forms are correctly working and being submitted so that client can easily communicate with potential customers.
  • Make site responsive so that it looks nice and is easy to use across all devices.
  • Update the color scheme to use the medical industry standard.
Views showing the difference between the old Patient Telephone Supply site and the new one.

Approach

Being relatively new to development, taking on the update of a retail site was both exciting and daunting. Looking at the site and all of it’s problems, it was obvious that it needed to be simplified and streamlined. After some research, I settled on Next.js because it utilizes server-side rendering, creating a better user experience and better SEO results - which of course is ideal for any retailer. I also chose Contentful as the headless CMS option. It was easy to use for me and more importantly easy to use for the client so they could finally have the option to edit their own site and add/delete/edit products as needed.

Since the site was already designed in a way the client approved of, we decided to freshen it up with a color change. The color scheme before did not lend itself to the medical field. Changing the colors from grass greens and browns to blues, teals, and grays was the obvious choice. Along with the color update, the other completely necessary thing was making the site fully mobile. I updated the CSS using newer layout methods to ensure reliability and scalability of the site especially on the product pages.

From utilizing atomic design to create reusable components to figuring out how to submit forms directly to the client to learning the syntax of a new react framework, this entire project was a huge learning experience.

Multiple views showing the different pages of the Patient Telephone Supply site.