SaaS Website - Solutions Billing & Management


Role

UX / UI Designer, Content Designer


Collaborators

1 stakeholder, 1 developer


Duration

4 weeks

Tools

Adobe Xd, Adobe Illustrator, Adobe Photoshop


Company

Solutions Billing & Management

Problem

old website was overwhelming and difficult to navigate

The website is outdated and not performing well. Some of the main issues users encounter are an overwhelming amount of information and difficulty locating CTAs. It is hard to find the free offers, so users don’t take advantage of them. How might we make the infomation easier to digest?

Solution

add visual cues and break up the information with design elements

Adding visual hierarchy, images, icons, and color will help direct the users eyes and visually categorize the importance levels.

Process

persona 1

Matthew is a business manager at a dentist and wants to spend less time on his administrative tasks. He is trying to find a great company to work with who can help provide a better billing and project management software.

Many of the websites he encounters are difficult to naviagte and don’t hold his attention, which makes him think the software they provide must not be phenomenal. He is frustrated at the lack of clarity provided and wishes the businesses would be up front about what they offer.

site flow

To communicate all the information in an organized way, I first determined where everything would go and the steps users would take to access that information.

After some rough sketches I began laying out the information on the various pages of the site in a low-fidelity protoype. I took this version to the client and developer, looking for feedback and confirmation the designs could be translated by the developer.

low-fidelity prototype

hi-fidelity prototype

After sythesizing the information provided by the client and developer, I began the process of creating a high-fidelity prototype. These are the final designs used for the website. You can view the most recent version by clicking the link below.