The project started in 2015 with a mission to rethink news consumption on mobile devices for the entire globo.com portals. My role as Information Architect / UX designer on this journey was to project this whole new consumption experience along with visual designers, product owners, and developers.
Our projections showed that in a short period of time, our mobile access would be higher than our desktop's. Since our mobile experience was never adequately thought out, we had to identify the issues on our mobile experience consumption and how we could fix them.
The project had three basic requirements: Data-driven design, mobile-first and fit efficiently to the main brands: G1, GE, and GSHOW.
The numbers were our best friends at this point; we needed to understand the real impact of the growing mobile share in our products.
Mobile is all about the user, which means context: where I am, what I am doing. To deliver this personalized experience and distribute content we need to produce structured content and meaningful metadata.
We decided to abandon the WYSIWYG way to create and embrace the adaptive content methodology.
This change meant a challenge to create a new publishing platform capable of serving this content. A capability to personalize content according to user behavior/ clusters and distribute our content - not only on our site but the third-party platforms (Instant article and AMP) - and a total change of culture for editors.
Homes were known as traffic-driver for full content, but since they are not the main landing page anymore, we need give to the content pages one more responsibility. The equation here was pretty simple: our homes recently changed the way to deliver content, now it's done by a News Feed, and the results were very optimistic increasing pageviews per session and time on page.
Why don't use this system to deliver News on the content pages too?
One of the most important parts of the engagement equation is attention, for us, it means to read. And that's the problem; we operated by the rules of average time on page, bounce rate, and page views, the traditional metrics. We didn't know much about how the user interacted and engaged with each part of the content. We didn't know how they read.
All our unanswered questions became a measurement plan based on all the additional information that we need: the time users spend in every chunk, every piece of content, and how they interact with every content piece.
Our ad units on mobile were very different from the desktop which was a historical problem for our advertising team, to turn our business competitive we redesigned all mobile ad units using IAB guidelines and the placements were thought according to market case studies and best practices.
All these changes took us to work in a cross-screen/channel model of advertising and allowed us to pay attention to important things like viewability (metrics and optimization), and personalized ads.
As fast as we can
Instant article and Accelerated Mobile Pages (AMP) were a clear response to old problems: heavy pages and long load time. The responsibility for these optimizations passes thru the development and UX team. For developers, the challenge is to build lean codes, services, and requests. For my team, the responsibility is to create every element and every feature following functions.
We analyze every performance data; we rethink every interaction, element, font, and color. We pulled off every unnecessary thing. The focus was to build a simple and clear page, where the content is the real star.
Be fast, look fast
Performance is about optimization but is also about perception. Based on user behavior observed in previous usability tests, we prioritize elements based on reading movements and build a first paint logic to implement in our pages.
Almost three years after the beginning of the project and two years after the project launch, our data analysis showed us the results of all deep studies and improvements we did on the framework (Multi-content + News Feed): we improved by 25% the time per user on our products/ brands.