Circulation Website Redesign

Circulation is a (Non-Emergency Medical Transportation) NEMT Health Tech company with a platform that provides an on-demand ride-ordering solution that is a single access point for scheduling medical transportation. During my time at Circulation, I was assigned to be the sole Designer to redesign Circulation’s website.

 

Context

Professional Project

Date

2018

Role

Lead User Experience Design

Lead Visual Design

 

Redesign Opportunities

In 2018 Circulation was gearing up for Series B funding and realized their website was dated and didn’t accurately represent who they were. The primary stakeholders saw an opportunity to build a new website that would:

  • instill confidence in their current and future clients and investors.

  • demonstrate what the platform could do, as well as accurately reflecting to the world that the innovative technology-driven startup that was maturing

  • speak to their three primary client types about how Circulation could benefit their business and their patients

  • generate new business, which meant making a inquiries for demos or information easier

 

Final website design for both desktop and mobile

Information Gathering

For the first couple weeks, the focus was on information gathering. This included looking at our competitors to understand the general landscape of the NEMT market, compare our marketing website to others, and to confirm and learn more about our primary client and user types.

User Research

Talking extensively with primary stakeholders and existing clients we confirmed our primary audiences were Medical Clinics, Hospital Discharge, and Health Plans. The most important elements to our clients were highlighting notable and impactful features, explaining how our product works for them, and how we can help grow their revenue and improve their patient’s lives.

Competitive Analysis

I began by looking at competition in our market as well as other innovative startups. I found that most of the companies I looked did a good job at:

  • giving a more in-depth view into their companies with blogs, feature descriptions, and customer testimonials

  • showing how their platforms could save their clients money

  • allowing clients/users access to demo requests

  • speaking directly to their primary clients/users

 

Marketing landing page competitive analysis

Initial Concepts and Wireframes

After understanding stakeholder and user priorities I started thinking through initial concepts. The desire was to create and innovative and interactive site to showcase ourselves as creative problem solvers. I started by sketching out some ideas.

 

Early concept sketches

 After review of initial concepts, the decision was made to include the following key elements:

  • call to action (CTA) for clients to log into our platform above the fold

  • CTA to request a demo above the fold

  • interactive hero image that engaged the user and represents key offerings

  • CTA to user/client revenue calculator above the fold

  • step-by-step walkthrough of how the system works for each of our primary client types

  • overview of our most important features with descriptions

  • revenue calculator illustrating how much the platform could save each of our primary client types

Landing page and “How it Works” wireframes developed in Sketch

Interactive Experience

Our primary stakeholders wanted to set ourselves apart from the typical marketing site. This meant thinking outside the box and pushing our design. I started by thinking about what our company’s strengths are and how we could relay that to visitors. One of the biggest services we offer our clients in not just transportation solutions but the analytics behind that transportation. We can tell our clients where their patients are most frequently going, how often, if they are missing appointments.

Circulation for Transportation and Analytics

The first scene is an animation of a vehicle moving along on a map to its destination and as you scroll an analytics map is revealed below. In order to complete the animation, I learned how to use the animation software Adobe After Effects.

 

Interactive hero animation and analytics underlay made using Adobe After Effects and Photoshop

How Circulation Works

Another key priority of the site was to explain to our primary client types how our platform will work for their organization and patients. To do this we wanted to walk the user through each step of the user journey and keep them engaged along the way. The use of motion and progressive disclosure was used to reach this goal.

 

Animation upon scroll, revealing how Circulation works

How Circulation can help you add revenue

The last major interactive element on the landing page was a calculator which the user could manipulate to discover how Circulation could provide their organization extra revenue. The user can choose the appointment type most relevant to their organization and learn what the dollar amount could be based on a 68% reduction in patient no-shows.

 

Revenue calculator for our clients

Final Design