Ratings

SERMO Ratings is a crowd-sourced rating & review platform that provides 24/7 access to opinions on thousands of drugs sourced from anonymously from over 30,000 board-certified doctors with first hand experiences. I worked on this project for 20 months and took part in every part from early designs through proposing and leading enhancement initiatives.

Problem: Doctors do not trust pharmaceutical companies to provide accurate information about medication. We wanted to create a system of unbiased and professional sentiment that Health Care Professionals could trust when researching medications.

Role: Lead Designer | Researcher | Product Manager


The Beginning

When I started, I was tasked with bringing this wireframe to visual fidelity with our current styles and components. This would help the team understand what we could plug and play and what we would need to build new.

I thought this would be a simple visual design project, a great way to start my work and show how I could deliver results at SERMO. It turned out to be a whole lot more than a visual design project that helped me define my process as a designer.

As I presented this mocked up design, that is when things started going off the wires and we quickly lost sight of what we were trying to do with the project.

The original layout sketch that was left from the previous designer

The Visual fidelity mockup using the current styles

 

The Wild Ride Begins

I spent the next month I was pumping out mockups that were trying to achieve the constantly shifting goals that my product manager and I were hearing from our stakeholders. I produced roughly 30 different directions we could take before I realized we weren’t getting anywhere because I was not setting up our conversations for success.

Our Reprioritization meeting resulted in a list of 5 prioritized pieces of functionality

To wrap my head around the requirements, I attempted multiple approaches before the first meeting to start making decisions. I started with an almost direct copy of the sketch and then branched out on design explorations from standard column splits to pintrest style feeds. As I explored more I began finding an approach and language that I thought was more consumable and more successful than the others.

I wanted to make our meeting as streamlined towards making informed decisions as possible, so I made a set of mockups that could be used to create a decision tree. Everything was an A/B decision and we handled the page 1 section at a time, from top to bottom and from left to right. I used this method to help the team come to an agreement that we needed to pursue a top down approach to make it easier for doctors to consume the ratings data.

A left/right approach that separated the rating from the brand name and indication

A top down approach the introduced each component in sequential order, creating immediate understanding when the user reaches the rating

I followed this A/B process until we had a complete page design that we could user test. We had trouble getting quick access to talk to our users so I devised a "dirty user test" by using my colleagues around the office and testing the interactions. Even if they weren't knowledge experts and would not be able to make all the connections a doctor would between the drugs and indications, they would be able to tell me if they could navigate the page and perform the simple actions I was asking of them. It immediately became clear that we had missed on some of our goals. None of our users were able to understand the tab system for selecting indications. We also identified that no one understood the metric for the competitor panel. The only two tasks all the users could perform was to "add a rating" by clicking the big blue button in the middle of the page and to search.

A static mockup from the prototype we used for user testing

We took the feedback from our first user testing session and implemented a pill system instead of tabs. In review with all of the previous testers plus a group of 3 new users, everyone was able to navigate between indications. We also simplified the competitor panel. Instead of the top 3 drugs, we showed all the drugs and simplified the copy to tell users where the drug sat amongst its competitors. We stumbled upon what would become the most valuable item on the entire page. We created a simple way for a doctor to ease the fear of a patient by showing them that they are taking one of the top drugs for the indication.

Recently my girlfriend got a prescription for an infection and after a simple Google search, we found that the medication caused everything from more infections to bleeding disorders. But after looking up the drug and seeing it ranked #2 on the competitor panel and ranked #1 for safety, all of our fears melted away.

The next iteration of the UI we tested


Public Launch

We had two public launches for the product. The first was when we increase the rollout to 100% of the US user base. The second was when we introduced the international community.

The product was targeted at US doctors as our primary user base, but US doctors have been hesitant to start using the product. However, we were taken by surprise at the successful market for international doctors. Despite our active "international" user base being about 2/3rds the size of our US active user base, we saw 70% of the activity coming from our international community.

We followed the discovery with quantitative market research and discovered that the international doctors think US doctors are some of the best in the world and are very interested in getting their input whenever they can. We ended up making a tool that helped educate the international physician community about the current marketplace of drugs in the United States.

We have used this discovery to help us drive and test new ways to get our US user base to participate in more international discussions. We tried an experiment pre-translating emails about foreign patient cases to US doctors and have seen double the activity by US doctors on patient cases, which has also led to more international patient cases being created. We are also encouraging the use of translations more on our iOS app.


Responsive Design

As soon as we started realizing the value the product's ability to foster communication between a doctor and a patient, we knew this needed to be available in the field and not just on a desktop. Patient conversations happen in the exam room and they happen quickly. We wanted our product to be there with you whenever you needed it. We put a lot of time and effort into designing a quick view responsive design that would display all the needed information for a patient above the fold. The entire product is still there and available to be seen, but we wanted to focus on what our core value is.


Indication pages

We had always planned on doing "disease" pages. After launching to the international community and discovering their interest in the product, we worked to take the value proposition of the competitor panel and create a page dedicated to the best ways to treat diseases. This has taken the best parts of the original brand pages and given doctors more control of how to reveal drug ratings to patients. Allowing them to focus on what therapy is best for them. After all, you don't want to take a steroidal asthma drug, when you react poorly to steroids, just because it is rated higher.

The first iteration of the indication page