UX/UI Design
Nadia Burger
Sep 29, 2025
Summary
I led the redesign of a South African news platform's mobile newsfeed to improve engagement for users transitioning from beloved print publications to digital platforms.
Through stakeholder-aligned competitive analysis, strategic use of available analytics, and comprehensive usability testing, I created and validated a refreshed design featuring improved visual hierarchy, new reusable card components, and enhanced content discovery.
User testing validated the solution with 89% preference for the new design and 97% task completion rates. (Note: I left the position before post-launch engagement metrics were collected, so this case study focuses on the design validation achieved through user research.)
The Challenge
The closure of several well-loved South African print publications forced users to adapt to using the companion digital platforms, primarily on mobile web and app. However, compared to their beloved print publications, users felt that the existing mobile newsfeeds were monotonous and not very engaging. Our analytics confirmed this and showed a steep drop-off after the 15th card slot in the newsfeed.
The challenge was to update the information architecture and functionality to create a clear visual hierarchy and incorporate other media such as podcasts and video, while reusing as many existing components as possible in order to minimize development effort and meet our delivery target date.
My Process
Market Research:
Stakeholder-Aligned Competitive Analysis
Working with stakeholder input on industry benchmarks, I analyzed common patterns across 7 top international publishers. These platforms were selected based on their prominence in the global news landscape and mobile-first approaches, helping us understand industry standards and identify opportunities relevant to our South African audience.
Publishers analyzed
BBC, CNN, New York Times, Fox News, The Guardian, Washington Post, Financial Times
(Source: PressGazette ranking from July 2024)
Key insights
Common patterns observed:
Large typography and edge-to-edge images used for main stories
Category tags for content context
Grouped content sections
Horizontal carousels for content discovery
Prominent, image-heavy cards for features
Auto-hide navigation on scroll
Finite scroll with a footer on web and none on app
User Research:
Analytics Review
Data source: GA4
Our analytics showed that:
Users were only scrolling to about card number 15 in the old design and then dropped off
Users were not engaging with the bookmark or share icons in the footer of the small thumbnail card, but rather on the articles themselves.
I saw an opportunity to remove these icons and simplify the card design, reducing visual clutter while maintaining the functionality users actually used.
Best practices
Card design optimization
To optimize our most frequently used component, the small thumbnail card, I researched content card design best practices. Research showed that placing images on the left aligns with natural left-to-right reading flow and creates a strong visual anchor, drawing users' attention to the image first before engaging with the headline.
Top and above: The previous small thumbnail card, and the updated design below it
Accessibility
As the primary purpose of the interface is for users to read news content, we prioritized typography that meets accessibility standards. This was particularly critical given that a significant portion of our audience is over 50 and more likely to experience age-related visual impairment such as presbyopia. We increased our smallest headline and body font size to 16px, which aligns with widely accepted best practices for readable body text. We also ensured sufficient color contrast ratios (4.5:1 for normal text per WCAG AA standards) and designed with scalable typography that respects users' system font size preferences.
Solution
A phased approach
Because we were making major changes to a live site, we decided to implement the new design in phases. We shipped the updated small thumbnail card first, then added in the new card components. This approach gave us the opportunity to see how each component was received by our audience and make adjustments where necessary.
Above: Variations of the small thumbnail card - one for opinion pieces where the headshots of the authors are not key to understanding the story, and one without any image to indicate lower visual hierarchy.
Above: A section heading and main story card that has a large image and large typography to indicate importance.
Above: A card with a medium-sized image and CTA that can be used to promote content such as Games, Podcasts, Audiobooks etc.
Above: Video and image carousels with horizontal swiping gesture were added to improve exploration of different content types and engagement
Above: The infinite scroll was removed and a footer was added on mobile web to encourage users to explore other categories.
Final Whitelabel High Fidelity Design and Prototype
The final design was created in NOVA, our whitelabel design system.
Above left: Before - Static, monotonous layout
Above right: After - Dynamic, engaging design with interactive elements (Figma prototype)
Impact & Validation
User Testing & Results
To validate the design direction, I conducted remote usability testing with 100 South Africans aged 25-60. Without established personas at this stage, I recruited broadly to represent our diverse, search-driven traffic. While we later developed core subscriber personas (see Learnings), this broad testing validated that the design improvements worked across age groups — important for a platform attracting varied users through search. The results demonstrated strong user preference and confirmed our design decisions:
89% user preference for the new design over the existing experience
97% task completion rate in usability testing
88% said tags helped them browse through articles (validating the addition of category tags)
99% said it was important to know when a story was published (validating the timestamp)
92% immediately understood horizontal swiping gesture on carousels
The strong user testing results and the successful rollout of the updated small thumbnail card gave stakeholders confidence to move forward with full implementation, and the phased approach minimized risk while maintaining delivery timelines.
Learnings
Testing with Representative Core Users
After shipping the updated small thumbnail card, we received complaints from users about font sizes appearing too small, despite having enlarged them. Through direct conversations, I discovered these users had custom system font settings that our design constraints had overridden.
This revealed a critical gap: without an established core user persona, we'd tested broadly (ages 25-60) but missed our actual primary audience, subscribers over 50 experiencing declining eyesight who relied on accessibility features. Additionally, remote usability testing wouldn't have caught this issue, highlighting the importance of moderated testing with live prototypes.
I reached out to Marketing to request user data, which led to them conducting a survey. I used these insights to develop our first established user persona, which informed my next project and ensured we designed for and tested with truly representative users from the start. This experience also reinforced the need for proactive accessibility testing with users who have severe visual impairments, including those who rely on screen readers — something our team has prioritized in subsequent projects.
What colleagues say about me
Peer Review
Nadia has done some exceptional work on the homepage variation mission. A lot of research went into the design changes and it has truly made a big impact on the overall product experience.
Peer Review
Nadia is a great researcher and always does her due diligence in order to design products that meet industry best standards. Her final product always takes in account the various considerations in order to implement a well thought out sustainable product.
Peer Review
Nadia excels at turning ideas into well-executed designs. On the home page variation project, she combined research, user needs, and design principles to deliver outstanding results. She’s proactive in refining tools and processes, always ensuring her work is both user-focused and impactful.
Peer Review
Nadia has done such an amazing job in researching, designing, prototyping, doing playbacks and later on testing and feedback on the homepage variation project. Thanks for everything, this project is where it is now because of you.