During my time at CNN, I worked with the CNN Business product team on some long overdue improvements to their market data experience. Essentially, these pages were so outdated that many links and data points did not work, layouts were non-responsive, and pages were created entirely of iframes provided by our data vendor. We “owned” none of it and did not have control of the content in order to iterate and improve.
If we wanted to reach our users and provide them with innovative new experiences, we needed to first build a solid foundation to work from. In moving the old market data pages to a new tech stack, we manually rebuilt each component, made small UX improvements where possible, aligned with the new CNN design system, and tested along the way to be sure we were not alienating loyal users in the process. As we did this, we spent time doing extensive user research–developing personas and identifying pain points, as well as opportunity areas to better serve them.
We started with one of our more popular pages, pre-market trading. This page had an average of 221K daily unique visitors, and many loyal users who returned to the page multiple times per week.
This is what the page looked like.
As I explored different layout variations, the focus was to not stray too far from what users were used to, but create usability improvements where possible. Initial surveys told us that futures data, quote search, and investing news were top priorities when visiting the page. I was also tasked with implementing a new ad experience that would serve as a template for pages to come.
After presentations with key stakeholders and discussions with market experts on the editorial team, we moved forward with variation 1.
After visual design exploration and the addition of design system standards where applicable, we launched the new pre-markets experience to just 10% of our audience, with a short feedback template for users to tell us what they thought.
Because our users were so loyal and this page went unchanged for so long, this first launch received a lot of negative feedback. The overwhelming majority of users mentioned that they now had to scroll and there was too much white space, especially on mobile. They did not agree with our responsive design solution.
We moved through a series of iterations as we tweaked the page to meet user and business needs.
Some of the improvements from initial launch include:
By responding to user feedback, as well as adding a toggle that allowed users to opt-in to the new experience on their own time, we managed to ease our loyal users to the new experience without a decline in page visits.
More importantly, we had a great base (that we had full control of) to start building new experiences on.
The pre-markets page was only the beginning. One by one, we applied an iterative, user-focused process to the rest of the CNN Business market data experience, launching pages that users loved and at the same time set us up for growth.
Below is a sample of some chart and layout exploration I built into prototypes and tested for Commodities, leading us to the launched page that follows.