Sometimes things just catch your eye, in this instance it was a really smooth UI. I just thought their motion was so satisfying, I simply tasked myself with achieving the same result.
A full explanation of the project, with the included final full fledged prototype.
I would suggest watching but I am still going to add all the details in writing below this, you could do both that also works
First my approach was to breakdown all of the components of their home page, ranging from the buttons and type to how they structure their previews and featured content. Getting these details was vital in ensuring the feel of this prototype. Understanding their design system if I was able to get those details right there would be little to no discernable difference between the prototype and the actual version which was the result I was after.
With each featured card after about 1.2 seconds, the featured show would dissipate it's cover image and reveal a video underneath.
Each video of the 3 featured for my prototype, I redited each commercial to meet the 1 minute timer on the app for each show, usually cutting down each video by about a minute and a half. While trimming each commercial I also re-edited the commercial to line up with the viewer of the app as many shots of the commercial had the point of interest in the left or right third of the image eliminating them from view. Cutting each clip and then re-positioning it to the center to line up correctly with the crop of the viewer.
ProtoPie is a powerful prototyping tool that enables designers to create interactive prototypes for mobile, desktop, and web applications. It allows designers to create complex interactions and animations without the need for coding.
Using it was vital in the last step, being able to create dynamic and responsive interactions pulled the project together. Crafting a highly polished version of the existing UI with relative ease.
