globoesporte.com
Increasing watched time with a minimum viable experiment
Year
2020
Role
Senior Designer
Platform
Web
Expertise
Visual and Interaction design, Prototyping, HTML/CSS
globoesporte.com
Increasing watched time with a minimum viable experiment
Year
2020
Role
Senior Designer
Platform
Web
Expertise
Visual and Interaction design, Prototyping, HTML/CSS
globoesporte.com
Increasing watched time with a minimum viable experiment
Year
2020
Role
Senior Designer
Platform
Web
Expertise
Visual and Interaction design, Prototyping, HTML/CSS
globoesporte.com
Increasing watched time with a minimum viable experiment
Year
2020
Role
Senior Designer
Platform
Web
Expertise
Visual and Interaction design, Prototyping, HTML/CSS
globoesporte.com
Increasing watched time with a minimum viable experiment
Year
2020
Role
Senior Designer
Platform
Web
Expertise
Concept, Visual and Interaction design, Protoyping, Pitch presentation
globoesporte.com
Increasing watched time with a minimum viable experiment
Year
2020
Role
Senior Designer
Platform
Web
Expertise
Visual and Interaction design, Prototyping, HTML/CSS
Globoesporte.com, the leading sports website in Brazil, faced a perception gap: while widely recognized as the go-to source for sports news, it wasn’t seen as a destination for watching live matches. As part of the product design team, I helped envision a experiment reimagining how live content appeared on the homepage, by crafting a responsive, emotionally engaging highlight component that emphasized the energy of live events and the context of each match.
Globoesporte.com, the leading sports website in Brazil, faced a perception gap: while widely recognized as the go-to source for sports news, it wasn’t seen as a destination for watching live matches. As part of the product design team, I helped envision a experiment reimagining how live content appeared on the homepage, by crafting a responsive, emotionally engaging highlight component that emphasized the energy of live events and the context of each match.
Globoesporte.com, the leading sports website in Brazil, faced a perception gap: while widely recognized as the go-to source for sports news, it wasn’t seen as a destination for watching live matches. As part of the product design team, I helped envision a experiment reimagining how live content appeared on the homepage, by crafting a responsive, emotionally engaging highlight component that emphasized the energy of live events and the context of each match.
Although widely recognized as the go-to source for sports news, Globoesporte.com, the leading sports portal in Brazil, wasn’t perceived as a destination for watching live matches. As part of the product design team, I helped design an experiment aiming to shift that perception, by reimagining how live content appeared on the homepage.
Context and
problem outline
Context and
Problem outline
Context and problem outline
Context and problem outline
Globoesporte.com is the #1 sports portal in Brazil, with over 7 million unique users per day. Its reputation as a trusted news source about soccer and other sports has consolidated it as the #1 top-of-mind website for sports news in Brazil.
Globoesporte.com is the #1 sports portal in Brazil, with over 7 million unique users per day. Its reputation as a trusted news source about soccer and other sports has consolidated it as the #1 top-of-mind website for sports news in Brazil.
Globoesporte.com is the #1 sports portal in Brazil, with over 7 million unique users per day. Its reputation as a trusted news source about soccer and other sports has consolidated it as the #1 top-of-mind website for sports news in Brazil.
The live match is Globoesporte's premium moment, but user research showed that most users did not perceive the product as a place to watch live matches.
The live match is Globoesporte's premium moment, but user research showed that most users did not perceive the product as a place to watch live matches.
The live match is Globoesporte's premium moment, but user research showed that most users did not perceive the product as a place to watch live matches.
The live match is Globoesporte's premium moment, but user research showed that most users did not perceive the product as a place to watch live matches (2020).
It was important to drive users to the live matches because of advertising delivery and the product’s subscription business model.
The homepage was the product's most accessed page and when matches were happening simultaneously, it was an important aggregator for all live content. However, the highlight component had been created for news features. It did not emphasize the liveliness of the matches and was not efficient in using imagery to engage users emotionally.
It was important to drive users to the live matches because of advertising delivery and the product’s subscription business model.
The homepage was the product's most accessed page and when matches were happening simultaneously, it was an important aggregator for all live content. However, the highlight component had been created for news features. It did not emphasize the liveliness of the matches and was not efficient in using imagery to engage users emotionally.
It was important to drive users to the live matches because of advertising delivery and the product’s subscription business model.
The homepage was the product's most accessed page and when matches were happening simultaneously, it was an important aggregator for all live content. However, the highlight component had been created for news features. It did not emphasize the liveliness of the matches and was not efficient in using imagery to engage users emotionally.
It was important to drive users to the live matches because of advertising delivery and the product’s subscription business model.
The homepage was the product's most accessed page and when matches were happening simultaneously, it was an important aggregator for all live content. However, the page structure and its components had been created for news features. The highlight component in particular did not emphasize the liveliness of the matches and was not efficient in using imagery to engage users emotionally.
Globoesporte.com highlight component on the homepage
Process
and responsabilities
As one of the senior designers in the project, my main responsabilities were
Designing a responsive modular system that encompassed the headline text and elements, their relationship with the overall component and page structure and how they would be displayed in each match scenario.
Credits
Design team
Ana Paula Miranda (IA/UX) William Berwanger (UX/UI) Marcela Maués (IA/UX) Jonatan Zylberstjen (Design intern)
Design manager
Rodrigo Santos
Process
and responsabilities
As one of the senior designers in the project, my main responsabilities were
Designing a responsive modular system that encompassed the headline text and elements, their relationship with the overall component and page structure and how they would be displayed in each match scenario.
Credits
Design team
Ana Paula Miranda (IA/UX) William Berwanger (UX/UI) Marcela Maués (IA/UX) Jonatan Zylberstjen (Design intern)
Design manager
Rodrigo Santos
Process
and responsabilities
As one of the senior designers in the project, my main responsabilities were
Designing a responsive modular system that encompassed the headline text and elements, their relationship with the overall component and page structure and how they would be displayed in each match scenario.
Credits
Design team
Ana Paula Miranda (IA/UX) William Berwanger (UX/UI) Marcela Maués (IA/UX) Jonatan Zylberstjen (Design intern)
Design manager
Rodrigo Santos
Process
and responsabilities
As one of the senior designers in the project, my main responsabilities were
Designing a responsive modular system that encompassed the headline text and elements, their relationship with the overall component and page structure and how they would be displayed in each match scenario.
Credits
Design team
Ana Paula Miranda (IA/UX) William Berwanger (UX/UI) Marcela Maués (IA/UX) Jonatan Zylberstjen (Design intern)
Design manager
Rodrigo Santos
Process
and responsabilities
As one of the senior designers in the project, my main responsabilities were
Designing a responsive modular system that encompassed the headline text and elements, their relationship with the overall component and page structure and how they would be displayed in each match scenario.
Credits
Design team
Ana Paula Miranda (IA/UX) William Berwanger (UX/UI) Marcela Maués (IA/UX) Jonatan Zylberstjen (Design intern)
Design manager
Rodrigo Santos
Process
and responsabilities
As one of the senior designers in the project, my main responsabilities were
Designing a responsive modular system that encompassed the headline text and elements, their relationship with the overall component and page structure and how they would be displayed in each match scenario.
Credits
Design team
Ana Paula Miranda (IA/UX) William Berwanger (UX/UI) Marcela Maués (IA/UX) Jonatan Zylberstjen (Design intern)
Design manager
Rodrigo Santos
Crafting an iterative experiment
Unifying the CodeSandbox experience
Unifying the CodeSandbox experience
Before investing in a larger redesign in the product's most accessed page, the design team designed an experiment to evaluate the user's response to this new format. The experiment was based on a few hypothesis:
Before investing in a larger redesign in the product's most accessed page, the design team designed an experiment to evaluate the user's response to this new format. The experiment was based on a few hypothesis:
Before investing in a larger redesign in the product's most accessed page, the design team designed an experiment to evaluate the user's response to this new format. The experiment was based on a few hypothesis:
A day overview in a glimpse
Designing a single dashboard
A quick snapshot of the day
Creating a match carousel using the score element would allow the product to quickly provide an overview of the the matches happening in a specific period of time.
Creating a match carousel using the score element would allow the product to quickly provide an overview of the the matches happening in a specific period of time.
Creating a match carousel using the score element would allow the product to quickly provide an overview of the the matches happening in a specific period of time.
Displaying a match carousel with score elements allowed the product to quickly surface an overview of all matches happening within a give timeframe.
Consistency as the key
to recognition and familiarity
The new component had to be completely adaptable and recognizable in different devices and contexts.
Intentional image selection
to reflect the moment of the match
Designing a single dashboard
Straightforward and emotional
Straightforward and emotional
Straightforward and emotional
Prioritizing live media
Designing a single dashboard
Because the content was sensitive to several conditions (availability, user subscription status, geolocation, the match's timeline, etc.), it was necessary to establish a set of rules to define which media would be displayed in each scenario.
Because the content was sensitive to several conditions (availability, user subscription status, geolocation, the match's timeline, etc.), it was necessary to establish a set of rules to define which media would be displayed in each scenario.
Because the content was sensitive to several conditions (availability, user subscription status, geolocation, the match's timeline, etc.), it was necessary to establish a set of rules to define which media would be displayed in each scenario.
Creating a flexible element
that adapts to each match moment
Flexible by design: adapting to the full match lifecycle
Before the match begins: the warm-up
Post match: Comments, analysis and live interviews
Results
In a joint effort with the editorial team, this solution was rolled out to users as an A/B test. Results showed a significance increase in perceived value and watch time. The new highlight component became the official format for showcasing live content.
+5,6%
lift redirect to
live content
lift redirect to live content
+6,9%
lift in live video consumption
+17%
lift in NPS