Mobile IV Medics (MIVM) is a SoCal based company specializing in in-house IV therapy. Their clients range from mom's-to-be needing help with morning sickness, to those needing extra vitamins due to chemotherapy, or to those who are looking for a quick bounce back after a night out. Their team of highly trained nurses make these house calls to benefit their clients daily throughout Southern California and South Florida.
The executives initially wanted to talk about creating an App, but after further meetings, we were able to establish a different need for the overall site. The following case study is in reference to the redesign pitch.
User needs a better way to book their IV therapy online. The overall user experience is fine, but it misses opportunities to retain guests or allow guests to book multiple IV drips.
How do we create a site that has characteristics of an E-Commerce App?
While studying and comparing Mobile IV Medics with other sites I came to the conclusion that I needed to create a different color scheme to establish better Calls To Action (CTAs), establish better product display, develop a multi-step booking flow to help the user confidently book online and design a new User Interface to help create better overall User Experience.
With this project needing User Interface upgrades, I looked for inspiration to draw from. The main issue for Mobile IV Medics is the IV bag photos. Since they needed to look realistic, but also not exactly like medical IV bags, there was very little wiggle room for changes with the images. I looked for sites, both e-commerce and medical, that showcased minimal images.
One area I needed to tackle before building out wireframes of the new site was the rebranding. Mobile IV Medics initially wanted to keep the color gradient below, but the main issue was that by using this gradient, all other colors on the site would feel out of place. This was a major issue with the colors from the IV bags. The final colors are not off of what the MIVM site is currently using, but removing the gradient and focusing on solids.
Setting typography to maintain consistency and hierarchy throughout the site was a necessity before designing and creating wireframes. I didn't want to change the font because I felt that Nunito Sans is on brand for MIVM. However, I wanted to play with the weight and the colors to create a different experience.
CTA (Calls to Action) buttons would have to be clear and prominent to create a better user flow. While studying tother sites and searching for inspiration, I developed what I thought to be the best solution for the new CTAs.
Developing two types of buttons/CTAs would help create trust with the user throughout different steps in booking. One style would work with the site and help navigate the user from page to page. The other would show a more serious side, and this would be used during the booking process.
An ideal User Flow and User Interface adjustments guided me through the main process of this site redesign. The ideal user flow would allow the user to book online with the use of four steps.
What would have to be decided by the executives was whether or not to have a multi-step booking flow. Both of which will be delivered on order to make the final decision. Click below to skip to the booking flow.
Since this project didn't need an entire rework, I was able to follow some of the same design themes already established on the site. This allowed me to quickly build out pages and focus on other key areas pivotal to the booking process and overall business.
To draw the user’s eyes to the IV bags, I wanted to showcase them in the same fashion as other e-commerce sites. This layout would be familiar to the user and it would help draw them to the area on the page.
The last piece of the puzzle was to develop two different flows for the booking process. I developed the first flow to mimic the original site, but changed necessary UI, while the other was a multi-step flow to help breakup the process for the user. Since the first flow was already built out, I spent more time developing the multi-step process.
A multi-step process is nothing new. Many companies/sites use this to help breakup the flow. This allows the user to fixate on one piece at a time while also receiving feedback on each piece of the process.
With changes made and more fine tuning established, I started piecing everything together to get a full experience of the site. Photos and more colors were added to create a realistic Hi-Fidelity Mockup for both Desktop and Mobile.
Having these would help showcase the possibilities of the direction MIVM could go without creating a full iOS or Android App.
This redesign for Mobile IV Medics was a project based on the use of color and creative design. The many obstacles for the scale of the project, as well as the challenges with the product photos, kept me focused on creating a great overall user experience that would in return help the company.
If I were to spend more time on this project, next steps would be on product reshoots and more prototyping for interaction design.
