Zacks Quote Ticker Page
Problem: Existing stock ticker page was extremely cluttered, difficult to navigate, and numerous menu items fell below the fold of the page, so they were getting very little traffic.
Solution: Full redesign of the page to improve hierarchy, user experience, and organization.
Skills: UI/UX, user data research, Photoshop
Results: Updates to UX resulted in easier flow of information, and a higher click rate for all items that were moved above fold of the page.
One of the most important parts of the Zacks website are their stock ticker pages. As a stock information site, much of the traffic comes from users searching for specific tickers for more information on whether to sell or buy. As is such, this high traffic section needs to have top notch user experience. The original version of the page was difficult to navigate, and overwhelming with the amount of information. It needed to be broken down into many sections, to accommodate for the massive amount of information.
Original Design
This is a screenshot of the original design of the page. As you can see, much of the content is hard to read, and what’s circled was identified as the most important content by the President of marketing. However, it’s almost impossible to understand the flow of this information, even if you are intimately familiar with Zacks rankings and stock evaluations. The icons can be difficult to read, and since they are really important for personal evaluation, that isn’t helping the user at all.
The second biggest issue with the page was the navigation. It was long enough to run below the fold of the page, and much of the research data we had on the page through click-thru numbers and heat mapping showed that almost no one was clicking on the links at the bottom of the navigation, which included a CTA. I needed to find a way to make it more accessible, to ensure that necessary information was easier to see and utilize. Unfortunately the final design that was approved by upper management was a version that still fell below the fold of the page, but I found a way to make it a bit more manageable overall. This was a great lesson as a designer, as I learned a lot about how best to present data and information to explain my design choices. As a designer, nothing is as valuable as hard data and research to make your point in a design.
I also needed to take the mobile view of the website into consideration. With this much information, and an extensive navigation, it was important to find a way to make it digestible on a mobile device. I wanted to minimize how much information was shown, and to remove anything that wasn’t completely necessary on mobile, based on the prioritization from the management team.
