Built for the future
universalpictures.com
Due to the industry’s emphasis on social media and mobile promotion, Universal faced a dilemma with their website. It relied on flash, lacked social media integration, and had no mobile functionality. Impressed by our achievements with foxmovies.com, Universal approached us to develop a similar platform, with the added requirement of making it “way cooler” than Fox. We enthusiastically embraced the challenge and initiated the planning process to determine how we could enhance and future-proof our existing work for Fox, pushing the boundaries to create a truly cutting-edge product.
As the leader of the design team, my responsibility was to create an experience that drew upon the UX notes and functionalities from foxmovies.com, while introducing a distinctly divergent direction in page construction and UI design. Notable alterations included reorienting the top carousel, revising the presentation of social media posts, and completely overhauling the film pages to adapt responsively based on available content. To infuse the desired “cool” essence, serious efforts were devoted to crafting interactive elements.
problem statement
Build us foxmovies.com but way cooler
Designed to be completely modular
Drawing insights from our experience with Fox, we discovered that films transition from a lack of promotional material to an abundance of it throughout their lifecycle. We meticulously devised multiple scenarios for each module on the individual film pages. These modules possess the capability to scale and reconfigure themselves to create a unique layout for each additional piece of content added up to 3 items. The modules also adapt dynamically based on the content present in adjacent modules, such as the film poster module altering its appearance according to the number of trailers associated with a film.
The extensive emphasis on planning for every conceivable scenario was essential, as Foxmovies.com encountered various unforeseen content-related situations that neither we nor the client had anticipated. This pushed well outside the scope of our project, but such occurrences are to be expected when pioneering a new format. We invested significant effort into planning meticulously and this paid off in dividends when the client had zero adjustment requests after our official hand off date. The website is 7 years old and it still holds up today.
A groundbreaking video modal
The video modal we designed for universalpictures.com is exceptionally advanced, even by contemporary standards. It smoothly expands and retracts from a fixed position, featuring a snapshot from the current scene to demonstrate this transition. Since the launch of this project, I have made attempts to persuade corporate tech developers to replicate this modal launch, but the outcome has been somewhat limited.
Patience makes the world go round
A significant request we received from Universal was to devise a solution for animating their logo in the header. After careful consideration, we chose to utilize an extensive sprite sheet to achieve this goal. This approach presented several challenges, primarily associated with file size. The presence of a transparent cut-out beneath the logo meant that standard image compression methods could not be employed. Numerous hours were dedicated to compression trials and errors before successfully bringing the dynamic universal globe to life.
Custom video headers
We implemented the capability to integrate custom video headers into the upper sections of the individual film pages. Although this functionality is not presently being utilized, it continues to be available within the system.
Thank you
