Project Overview
The marketing website is the face of a company and helps determine whether a prospect becomes a customer. Working closely with the marketing team, I made several improvements to the visual branding and improved the overall user experience.
Goals
- Improve overall visual hierarchy and ease of use across the entire website
- Re-design outdated visual design
Improving Visual Hierarchy & Ease of Use
The visual presentation of a web interface should guide users from one action to the next without feeling overbearing. Information that users are seeking should be easy to find while also encouraging them to move to the next stage of the funnel by clicking "Schedule a Demo" and getting in contact with the sales team.
A Clear Call To Action
Clicking the CTA button is the most important action a website user can take. It needs to stand out above all other elements on the page. The previous design did not clearly communicate the importance of this button.
- The CTA button lacked contrast and was lost in a similar coloured background.
- The button did not stand apart from other options in the navigation bar and was in a less noticeable position compared to other options like "Support" and "Sign In".
- The wording of "Schedule a Demo" was too long.
Previous Website Design
- In the new design, the CTA button stands out clearly on a white background.
- Website navigation items are moved to the left and actions to "Log in" and "Book a Demo" have been moved to a more prominent position on the right.
- The wording has been simplified to "Book a Demo".
New Website Design
Legibility
The previous website included small font sizes, often with very little contrast. This made it difficult for users to read the content. An all uppercase style was also used (buttons and titles) which made it harder for users to read as they are more accustomed to sentence case.
I improved the website's legibility by increasing font sizes, improving the contrast and moving away from uppercase styling.
Previous Font Styling
New Font Styling
Using Analytics To Guide Navigation Structure
Information architecture (IA) is the structural design of shared information environments, in this case, how website pages are organised and linked together. It's important that the pages are organised in a logical way so that users can find what they're looking for. The most visited pages should be the most easily accessible, with any secondary pages logically stemming off from them.
While adding new pages to the website, we saw an opportunity to better organise the navigation menu. We noticed that the pricing page and the about us page received a large amount of traffic. The pricing page was located within a dropdown and therefore treated as a secondary item. Similarly, the about us page was located at the bottom of the page in the footer.
We moved the Pricing page link to be one of the primary options in the nav bar and moved the about section into the dropdown for "Why Video?" and renamed it to a more engaging "Our Story". These small changes made it easier for users to find these popular pages.
