Long form video page

Long Form Video Layout

Season selector is added above the playlist and indicates the user the tv serie title and the number of season is currently playing.
The user clicks/taps on the back arrow button to display the season list
Once the user reaches the last item of the playlist, a "load next season" button appears.
From season two and forward, when scrolling up to the first item, a "load previous season" button appears.
On mobile the player and season selector are sticky. Please refer to the mockups below

Mobile (414): https://univision.invisionapp.com/share/XVN0K3MC5BA
Sticky player + season selector: https://univision.invisionapp.com/share/MVN0K3VBXE6
Load next/previous season button: https://univision.invisionapp.com/share/TFN0K47XJM5

Mobile

414: https://univision.invisionapp.com/d/main/#/console/13896722/309279308/inspect
414 - season list: https://univision.invisionapp.com/d/main/#/console/13896722/309277482/inspect
414 - Load next/previous season button: https://univision.invisionapp.com/d/main/#/console/13896722/309277484/inspect

Apps:

Android: https://univision.invisionapp.com/d/main/#/console/13249074/310591193/inspect

Desktop (1440): https://univision.invisionapp.com/share/YDN0K4DVW6R
Desktop (1440) - load next/previous chapter: https://univision.invisionapp.com/share/7SN0K4KYMC2

*For button hover/pressed states please refer to the OUTLINED dark button definitions here : https://sites.google.com/fusion.net/univision-design-framework/design-base/buttons

craft url: https://univision.invisionapp.com/d/main/#/console/14375444/305679873/inspect

Desktop

1440: https://univision.invisionapp.com/d/main/#/console/13898069/289560928/build
1440 - season list: https://univision.invisionapp.com/d/main/#/console/13898069/309275660/inspect
1440 - load next/previous season button: https://univision.invisionapp.com/d/main/#/console/13898069/309275659/inspect
1280: https://univision.invisionapp.com/d/main/#/console/13898069/310597442/inspect
1024: https://univision.invisionapp.com/d/main/#/console/13898069/310597443/inspect
768: https://univision.invisionapp.com/d/main/#/console/13898069/310597441/inspect

Uses the same layout than the tv series, but all the novelas chapters will belong to the one single season, meaning that the user will only see in the season list: season 1, unless the chapter data is organized in more seasons.
The playlists will be of 25 chapters. When the user scrolls down to the last item of the playlist, the "load next chapters" button appears
When the user scrolls up to the first item of the playlist, the "load previous chapters" button appears as well

🎨 Sketch editable files: