Duration:
3 months

Update the appearance of the current website buttons page to make it more appealing for the user

For this project, I was the Primary Designer along with a Tech Lead, Product Manager and two Engineers. Starting off with the initial designs, I did exploration work in the platform’s staging environment to find different examples of navigation design patterns. This was beneficial since the user would be going back and forth between the medical and website integration pages. From there, I began to iterate on a handful of designs showing different navigation styles. Since practitioners don’t like having multiple tabs open, it was important to make sure that they would be able to switch back and forth between pages with ease. I explored the idea of having a navigation bar on the left and also having the tabs placed at the top of the page.

After getting feedback from my team on the initial designs, I elected to move forward with keeping the tabs at the top of the page since it would be easier for the user to see. On top of the navigation, I also iterated on different ways to display and organize the website buttons. At this time, I only had the images for the small website buttons so placeholders were used for what was missing. One of the layout designs that I explored and ultimately chose was carousels. I went with this design pattern because I felt that it would be an easy way for the user to view all of the options.

When it came to organizing the buttons, I thought about trying to categorize them in terms of colour and website types. I tried out a dropdown menu for filtering out options but in the end, I decided against it when I realized that there were not enough options for it to be feasible.

For the final UI, I received all of the website button images and was able to incorporate them into the designs. In addition to the buttons, I also received banners and ended up having to adjust the layout to accommodate for their different shapes. These new changes also meant that the carousel was no longer relevant in the designs. Since there were so few options for the user, it did not make sense to keep these patterns. A module was also created so that when the user selected the copy button, they could see a full preview of the button.

Metrics from the updated page have not been made available at this time but with that being said, there are three potential things that can be measured. These metrics are: are practitioners interacting with the page? Which images are loading on practitioner websites? And how much traffic are the new buttons generating to the landing pages? The last is considered the most important as it’s what leads to patients signing up and purchasing items.