Making it easier for teams to create plugins for Globo's video player.
Solution:
Drawers, a canvas that orchestrates all components of the video player. Other teams can freely create plugins inside that canvas, without worrying about interface conflicts.
Role:
I mainly worked on this project alone, unless where stated otherwise.
Globo is the largest media company in Latin America. I design its video player for TVs, desktops, and mobile devices. The same player is used across several company products, each with its own business goals and designers.
Sometimes, those other teams needed to design for the video consumption moment. They usually faced integration issues and had to disable all video controls.
The company needed a way to enable all designers to create for the video consumption moment without disrupting playback controls.
The solution to this challenge was the creation of Drawers, a canvas that orchestrates all layers and behaviors of the player in a content-agnostic way.
Designers from other teams could focus on the drawer's contents and their own business goals, such as promoting specific titles within the player.
Drawers have since made it easier and faster to create plugins that integrate with the video player.
Globoplay has big plans for drawers in the future. For now, they have already used it to give out video recommendations inside the player in an experiment to increase video views.
The product will also use it to enable switching between live broadcasts while the video is full screen.
Drawers have also become a valuable reusable component for the video player's basic capabilities, such as language selection.
I took two steps that made Drawers more well known at Globo:
- Documented all concepts, constraints, and guidelines on Notion. The page also linked to tech specs and to prototypes, so designers could get a better grasp of how their plugins would work.
- Created components on our Figma library that assist on creating Drawers. They accompanied text and video tutorials (using Loom) right inside the design file.
