Projects
River Valley Orthodontics
Duration: 3 Weeks
Role: Web Designer, Graphic Designer, Copywriter, Editor, Client Management, QA
Team: Solo Design
Platform: Web only (website)
Overview
River Valley Orthodontics is an updated website for an already existing Orthodontics practice that has recently updated their office and needed to also update their dated website.
I was assigned to this client to solve for a website design that really highlights their updated office while advertising the new services they offered. I looked to design their website with a focus on the services they offered in a condensed manner to avoid information overload.
Like a pile of Christmas lights, some are working and some are half broken, and they are all tangled up
I created a full website design that updated their older and poorly organised information dense website into a more fluid and easily readable website for both new and old clients. In addition to this I have also visually updated their website to a higher quality that matches current web practices and utilising their updated visual assets they had. Their older website also had the issue of poor usability in navigation and so I improved it to become an easier to navigate and reach the information that the visitor of the website needed. Creating micro-animations within the website to draw focus on key elements and important copy that both the client wanted to highlight so the visiting user naturally navigated towards those sections of the website as well.
Great! We figured out which lights are broken and which lights work and got some new lights to decorate our tree with!
Research
From my research in regards to their older website and other competitors within similar industries as well as prior experience now designing Orthodontic websites I had reached the following conclusion:
Drop down menus had to be removed due to the poor navigation hierarchy it created
Information burden to the user was heavy and unnecessary in all cases, especially the highly technical detail most clients initially wanted to put in
Micro-animation and movement were added to improve the flow 'below the fold' and "explorability" of the website
Condensed navbar to show only the needed information until after the information in requested, and only then display it in full
Synthesising the research I came to the conclusion the update from older website to new required a few things that were observed. One was the condensation of the information that was on the website. Second was hiding information that was required but on initial view may have been too much burden on the user unless requested. I see the conclusion of the research being that the website needed to be streamlined and information compressed into something anyone visiting the website can ingest easily.
Iteration & Design
This project had a short design to deployment time and so my design time was cut a lot shorter than was initially proposed. First few things to resolve were the navigation bar drop downs which were converted from a menu with hidden drop downs and multiple tertiary pieces of information to only primary pieces of information and no drop down. Next was to clean up the general density of the copy that made parts of the website too hard to focus and read and convert it into a smaller copy that only relayed necessary information. Seeing the old website had issues where information would disappear on the 'fold' a lot of the time I added some animations at section breaks and over mouse hovers to increase discoverability. Lastly I looked at the nav bar to show the information only when needed but otherwise hide most of it unless needed. This was done by condensing the nav bar once you scrolled down and then increase it back to it's full size when you scroll up.
Menu was stickied at the top in it's full size view with company logo when initially loading into any page
Once the user scrolls mostly past the Hero sections it would condense to a smaller version with just the logo and no text and Nav Buttons as well as the Page title in the top right
The overall outcome of this website now was a website that had only the information needed for the clients specific to this industry and made the overall website a lot easier to navigate while maintaining the content the client needed. In the end the client was satisfied with the overall design while improving a once poorly structured website into one that anyone who visited can get the information they need and not feel overwhelmed.
High volume of text that existed with too much space in between this made it too dense to read even if the copy was important
Changing it so that the text overlaid with a BG allowing for more information being able to be condensed and only requested information can be seen when either option is clicked
Hover menu over the nav bar which was also static made it difficult to see that there was even a submenu below
Removing drop downs completely and simplifying the menu allowing for a better experience overall and less confusion
Old website did not have constraints on banner images and so you had to scroll a while before being greeted with the next section of the website
Adding video and text that scrolled in from the right with the right over the BG indicating a small animation and more content below 'the fold'
Conclusion
Yes! Lights untangled, new lights installed and now our Christmas tree looks like it will be both good to look at and not a clumped mess!
The knowledge that I gained from this project was importance of condensation of information where possible and where it was necessary. Unorganised and overwhelming amount of information only adds to burden the user visiting the website who may have an already short attention span. This is even for specialist websites such as these that were sought out directly. Improving this by hiding information not needed or pointing towards actions the user can take on the website allowed for a more natural feel when looking for information in regards to what you would be looking for as a potential patient as well as the fun discoverability. In the end by giving clear direction and organising the information it allowed me to create a seamless experience for all.