Case Study
Redesigning Investopedia's Top-of-Page News Section
Context
Investopedia offers three main content types: product offerings, term definitions, and news. Most of the site’s traffic comes from users seeking specific information, such as financial terms or product recommendations. This intent-based interaction may lead to low engagement since users typically leave after finding their immediate answers and return only with new questions.
Current Solution
The team is increasing the number of daily news articles.
Goal
The team's goal in increasing the number of articles is to encourage users to visit Investopedia regularly, making it a habitual source for their daily financial information rather than just for one-off, intent-based interactions.
Emerging Question
The main question I had to solve as a PM working on this project is, how can Investopedia reflect the increasing amount of news articles on the homepage and how can those changes improve user engagement?
Role
Product Development Intern (roles encompassing product management and product design)
Timeline
June - August 2024
Tools
Figma, Miro, & UserZoom
01
Motivation
Looking at the Data
Session Statistics and Traffic on Different Content Types on Investopedia
First, we must validate if redesigning the homepage is the best solution for our engagement problem
Upon reviewing Investopedia’s session data from the past 30 days (Fr. August 2024), it is evident that while the site experiences a high volume of overall sessions, the homepage has the lowest average session rate. This indicates that users are more likely to enter the site through specific articles, rather than landing on the homepage.
From this observation, several hypotheses can be generated:
Engagement Levels: Users might find the homepage less engaging compared to other sections of the site.
Content Preferences: Sections such as News, Term content, PRM (Performance Marketing Content), and Evergreen articles may be more attractive or valuable to users.
Homepage Design: There may be issues with the design, layout, or usability of the homepage that are impacting user interaction.
📌 TL;DR - Despite high overall traffic, Investopedia's homepage has the lowest average session rate compared to other pages, indicating that users prefer accessing the site through specific articles rather than the homepage. This suggests potential issues with homepage engagement, content appeal, or design.
When examining the session data alone, the results might appear discouraging. However, shifting our perspective to understand how users arrive at specific pages reveals that a significant portion of the homepage's traffic comes from organic sources—users directly typing investopedia.com into their search engines.
While the homepage has a significantly lower session rate compared to other areas, the fact that it still attracts a portion of overall traffic indicates that users are interested in exploring Investopedia’s broader content. Despite the homepage receiving less attention than specific pages, this sustained interest shows that users value the site as a whole and are drawn to what Investopedia offers beyond just the individual articles.
Nonetheless, the low session numbers on the homepage suggest it may not be effectively retaining users or clearly showcasing its value. Addressing these issues could improve user retention and better harness the homepage's potential to drive engagement with Investopedia’s content.
📌 TL;DR - Despite its low session rate, the homepage attracts a substantial portion of its traffic from organic search, indicating significant interest. However, the low retention suggests it may not be effectively engaging users or showcasing its value, presenting an opportunity for improvement.
Competitive Analysis
To understand if other finance sites face similar user-engagement challenges, I conducted a competitive analysis of MarketWatch, Forbes, NerdWallet, Bankrate, and SmartAsset
The analysis reveals that Investopedia has one of the highest bounce rates among these sites at 81.41%, meaning users often leave after viewing only one page. Additionally, Investopedia has a lower average of 1.47 pages per visit. However, it boasts one of the highest average visit durations at 9:00, indicating that while users engage deeply with individual articles, they are not exploring beyond their initial page.
🙇🏻♀️ What does this data all mean? How can our redesign capitalize on those facts?
The data confirms that Investopedia faces a challenge with user engagement on the homepage, struggling to retain or attract visitors despite drawing significant traffic from organic search and having an average visit duration of 9:00. The low engagement levels, along with an 81.41% bounce rate and 1.47 fewer pages per visit compared to other finance sites, suggest that users are not being effectively encouraged to explore further.
To address these issues, a homepage redesign should focus on highlighting engaging content and promoting deeper site exploration. This approach aims to improve user retention and foster more consistent engagement with Investopedia’s offerings.
02
Validation
Validating Data with Internal and External Stakeholders
User Research
Before creating any mockups, we want to validate if the problems that we see in our data is reflected to what users are experiencing.
Part One: Brainstorming session with Inner Stakeholders
Given that the homepage redesign affects both internal and external stakeholders, I began by organizing a brainstorming session on Miro with members of the editorial teams responsible for News, PRM, and Evergreen content. This session aimed to identify their challenges and requirements for the redesign.
From this session, we identified several key design priorities that the editorial team wants:
Flexibility in designs in order to allow editors to highlight specific stories and topics: This flexibility is crucial because it allows editors to respond quickly to breaking news or trending topics, ensuring that the most important and relevant stories are prominently featured. This adaptability helps keep the content fresh and engaging for readers.
The space to show more articles: Expanding the space for articles ensures that a wider range of content is visible to users without needing to navigate deeply into the site. This can increase user engagement by providing more opportunities for readers to find topics of interest, thereby potentially reducing the bounce rate.
Emphasize practical implications for readers: Highlighting the practical implications of content helps readers see the immediate value and applicability of the information, which can enhance user satisfaction and loyalty. When readers understand how the content can impact their daily lives, they are more likely to return to the site for advice and insights.
Highlight the breadth of evergreen/PRM content: Showcasing evergreen/PRM content alongside current news helps to provide context and depth, aiding readers in building a more comprehensive understanding of financial topics. This not only educates the audience but also leverages Investopedia’s strengths in providing reliable, foundational information.
Consequently, they want us to think about
Part 2: User Interviews with Readers and Affinity Mapping Session
After identifying the editorial team’s priorities, I conducted an unmoderated user interview with 8 randomly selected participants to gather their feedback on the current homepage. To synthesize these findings, I then facilitated an affinity mapping session with the product designer and product manager to gain a clearer understanding of users' needs.
While reviewing the interview recordings, I focused on understanding the user’s interactions in the following key areas:
Balance Between Evergreen/PRM and News Content: We wanted to observe whether readers felt there was a good balance between news and other content. Understanding this is crucial because if users engage more with other content, we need to ensure that its prominence remains consistent even when redesigning the page to feature more news content. Although the redesign aims to increase news visibility, we also want to preserve user engagement with other content while introducing additional news elements.
Clarity of Content Relationships: Given our diverse range of content, we explored whether users find the relationships between different types of content clear. This is important to ensure users understand the purpose and relevance of each content type and can easily navigate between them.
Overall Layout Clarity: We also wanted to identify if there were any unclear aspects of the layout, especially concerning accessing news content. It's crucial to understand if any obstacles in the user journey might prevent users from easily finding and engaging with news. By pinpointing and addressing these issues, we can improve navigation and ensure users have a smooth experience accessing news updates.
User Demographics
During the user interview questionnaire, we discovered a key insight: when participants were asked about the most important feature they look for on Investopedia’s homepage, every single respondent emphasized the need for easy access to financial news content. This unanimous response underscores that users highly prioritize the ability to read timely and relevant news articles.
This finding confirms that financial news is a central element of user engagement on Investopedia.
Additionally, through our affinity mapping session, some high-level points that we got were:
Users prioritize reading lots of news content: They anticipate that the news content will be continually refreshed throughout the day to reflect the latest updates and appreciate a flexible approach where the site dynamically adjusts based on current news events. This reflects the unanimous user interest in news content, with 100% of users indicating that staying updated with the latest news is a key priority.
Users like images because it tells them what they should focus on: Images play a crucial role in guiding user focus and engagement, with users consistently prioritizing articles that feature prominent images, particularly hero stories. All users indicated that hero stories or images attract their immediate attention and often prompt them to click for more details. Additionally, larger images are perceived as more significant by users, influencing their viewing priorities.
The financial products/rate section garners significant user interest. Users expect this section to remain current and up-to-date: Users expect this section to remain current and up-to-date, indicating that it plays a key role in their engagement with the site. In fact, half of the users reported that their first action was to click on the financial rates section due to its prominent display of percentage rates, highlighting its importance and appeal.
People are split between the current home page layout: Opinions vary, with some users feeling that elements like "Investopedia for Advisors" and the Mission Statement disrupt the news-focused experience and are geared towards a different user group. Users also prefer clear categorization of news content by topics to facilitate navigation and browsing.
📌 TL;DR - The homepage highlights news at the top, but users must scroll all the way to the bottom for more news, encountering unrelated sections along the way. This is frustrating and disrupt user experience.
03
Iteration
Translating Feedback into Design
Iterating Process
After taking all the data and research that we did, I started creating mid-fidelity mockups of what this redesign could look like
First Mid-Fidelity Mockup
Expectations vs. Reality: Editorial Feedback Discrepancies on Mockup 1
Expectations
During our first mid-fidelity iterations, I focused on maintaining the same vertical space as our current homepage to avoid displacing other Investopedia content. This was important because our user research showed that PRM content, particularly the financial rates section, captured users' attention due to its highlighted percentage rates. I aimed to address both users' needs and the editorial team’s requirements with the limited space available, primarily to improve user experience by reducing disruptions in accessing news content and allowing room for the editorial team to increase the number of articles.
Due to that, I proposed a two-column layout with sections for “other top stories” and the “latest headlines.” I thought this would be the best solution because:
For users, this change simplifies access to news content by eliminating the need to scroll to the bottom to find the latest articles.
For the editorial team, the layout creates more space to highlight additional articles at the top of the homepage.
For developers, the design uses similar components to those on the current homepage, minimizing front-end work and allowing them to focus on other tasks.
Reality
However, when circling back to gather feedback from internal stakeholders on the mockups, they expressed concerns that:
The two-column layout might appear cluttered and overwhelm readers, compromising clarity and readability.
The side-by-side placement could blur the distinction between 'Other Top Stories' and the 'Latest Headline,' potentially reducing engagement.
Excessive text could result in fewer images and a lack of visual hierarchy, weakening the impact of varying image sizes for prominent news.
Proposed Solution
Thus, To address these concerns, stakeholders suggested expanding the vertical space in the top news section for a cleaner look and reorganizing sections, including financial rates and the latest articles, to improve balance and usability.
📌 TL;DR - In our first mid-fidelity iterations, I aimed to keep the vertical space consistent with the current homepage while addressing user and editorial needs. I proposed a two-column layout for “other top news” and the “latest article” to improve accessibility and showcase more content. However, stakeholders felt this layout might look cluttered, overwhelm readers, and lack visual hierarchy. They recommended expanding vertical space and reorganizing sections for better balance and usability.
Second Mid-Fidelity Mockup
Taking their advice, when creating my second mid-fidelity iterations, I really explored playing around with different layouts and reconfiguring existing components.
Expectations vs. Reality: Editorial Feedback Discrepancies on Mockup 2
Expectations
Based on feedback from the first mid-fidelity iterations, a key change in the second mockup was significantly expanding the layout.
I believed this would be most effective because:
For editorial: The expanded layout provides additional space to feature and highlight more content, offering greater flexibility which is one of their design priorities.
For users: User research showed that 100% of participants consider news content the most important on Investopedia. A longer layout allows them to access more news articles.
Reality
However, during our second feedback session with internal stakeholders, concerns were raised that while showcasing more articles is desirable, the proposed number of article slots might exceed the editorial team's capacity. Currently, Investopedia has the bandwidth to publish just over 40 news articles daily.
Technically, if 40 articles are produced each day, they could fill all the slots in the mockup I created. However, the editorial team pointed out that not all 40 articles would be relevant or necessary to feature prominently. Displaying less relevant articles could undermine the trust users have in Investopedia as a reliable financial news source that consistently delivers valuable content, ultimately impacting user experience.
Solution
After hearing the editorial team's perspective—that not all 40 articles have relevance to a wide range of users—I re-evaluated the user research and initial feedback. While users expressed a desire for more news articles and the editorial team requested more space to showcase them, it became clear that the quality of the content is paramount. Even if users say they want more articles, this could backfire if the articles are not consistently relevant or valuable.
With this new understanding, I shifted my focus from creating a large amount of space to designing just enough space where the editorial team could maximize the presentation of highly relevant content. This approach better aligns with their needs and priorities, ensuring that the articles showcased are consistently relevant and valuable to users. By optimizing space for high-quality content, we can maintain the integrity of Investopedia as a trusted source while still meeting user expectations.
📌 TL;DR - Initially, we expanded the layout to showcase more content based on user and editorial feedback. However, after stakeholders raised concerns about content relevance, we refocused on designing a layout that prioritizes the presentation of high-quality articles to maintain Investopedia's credibility.
04
Final Design
After a couple more rounds of design audits…
Here’s what the news section looks like now on Investopedia
💡 So, how did our redesign solve our design questions?
Question One: How might we visually create a partnership between news and evergreen/PRM content?
In our redesign, we focused on maintaining user interaction with PRM content, especially our financial product section, as user research highlighted its importance for navigating finances. To optimize accessibility, we repositioned this section to the right-hand side of the page, adjacent to the news articles.
This placement offers several benefits:
Visibility and Accessibility: Placing PRM content next to news articles allows users to easily access both without leaving their current view, enhancing convenience and encouraging interaction with both content types.
Balanced Layout: The right-hand side placement creates a balanced layout, enabling users to engage with current news while still having easy access to valuable PRM resources.
Consistent User Experience: By positioning the PRM section prominently, we align with user preferences, ensuring it remains easily accessible as users browse news updates.
Additionally, we increased space for related articles. The current homepage layout allows only 2 related articles for the main hero story. Our redesign expands this to 3 related articles for the main hero story and 2 for the sub-hero story. This adjustment gives the editorial team more flexibility to mix news and PRM content, helping users better understand topics and enhancing their overall site experience.
Question Two: How might we design templates that increase flexibility and adaptability?
To enhance flexibility and adaptability, we prioritized expanding the overall space dedicated to showcasing news content. User research showed that users are motivated to return to Investopedia primarily for news. In response, we redesigned the homepage to provide more room for news articles, making it easier for users to access a broader range of stories.
Key Enhancements:
Increased Space for News Content: The expanded layout gives the editorial team the flexibility to allocate more space to individual articles. They can choose to expand titles, descriptions, or include additional related articles as needed. By presenting more relevant content upfront, this approach aims to reduce bounce rates, helping users find what they’re looking for quickly and encouraging them to explore more articles, potentially increasing pages per session.
Enhanced Interaction: The redesigned template immediately draws readers into the stories by reducing navigation time. With all news content consolidated in one area, users can access and engage with updates more efficiently, likely decreasing bounce rates and increasing time on site and pages per session.
Clear Grouping of Content: Clear grouping and logical theming of stories help users easily navigate and understand related articles. This organization reduces cognitive load, making the site more intuitive and encouraging deeper exploration of related content, which can further reduce bounce rates and increase pages viewed per session.
05
Moving Forward
Question to Consider
🤝🏻 Given the recent redesign of the homepage to emphasize news content and the increase in daily news articles, what additional strategies can we implement to attract more visitors to the homepage and encourage them to make Investopedia a regular part of their daily financial news routine?
The most straightforward approach is to leverage the natural progression of user awareness toward our new, news-focused homepage design.
Since a portion of our traffic already arrives organically at the homepage, users will notice the shift towards a more news-centric layout, likely enhancing their engagement with the site. This increased focus on relevant content could further boost organic traffic to the homepage.
Moreover, when users visit specific articles, such as term definitions or product recommendations, there's a strong chance they'll click and explore the updated homepage. By presenting a refreshed and engaging layout, we can redefine their perception of Investopedia as a comprehensive resource, extending beyond just product recommendations and term definitions.
By doing so, we aim to shift users' perception of Investopedia from a one-time, instant resource to a site they check regularly for financial news, helping to create a habit that builds a loyal user base.
