Spearheaded a limited-time website takeover for the Wicked-themed rooms collaboration.
―
Hilton partnered with Universal Pictures to promote their new movie Wicked by creating “Stay Like Wicked” suites at their New York Hilton Midtown location.
We were tasked with showcasing this partnership in a larger-than-life takeover experience of the Hilton Stories website. The main goal of the project was to keep the pre-existing blocks from the news site while adding Wicked-inspired theming and assets, all within a tight deadline.
Note: This website takeover was only live while the rooms were available to book, which lasted approximately five days due to demand. However, the article page is still live with the takeover design.
Design Vision
From the onset of this project, I tapped into my background in writing to conceptualize a narrative that users would experience at each touchpoint. Anchoring on Emerald City as the destination, I wrote a three-tiered user journey:
Loading Screen—Entering the Gates of Emerald City
Homepage—The Sights inside Emerald City
Article Page—Meeting the Wizard alongside Wicked’s heroines
Loading Animation
In order to grab users attention, I had the idea to add a loading animation that would invite users into the experience and showcase that something new was happening to the site. Working closely with the front-end developer on the project, we were able to create a bold moment that put the users in control with their scroll—entering the homepage once they have fully scrolled down to see Emerald City.
Homepage
Once the users landed on the homepage, they were met by gilded golds and emerald greens. I incorporated textures seen in the film as background elements and pulled in stylized fonts like Mr. Darcy and Pentz to tie into the Wicked theming. To ensure accessibility was still met with the busy textured background, I added deep and dramatic shadows throughout.
To make the Article call-to-action section visually more prominent, I used of gold decorative borders. For the “Corporate News” section, I used an Oz logo background to align the Wizard of Oz himself as the “corporate overseer.”
Article Page
By clicking on the Article call-to-action, the user “accepted” the Wizard of Oz’s invitation and was taken to see “behind the curtain.” Gears go down the Article page and texturize the “About” background to show that the user is truly a part of the exclusive experience.
At the very bottom of the page, the Wizard himself waits behind his curtain for those brave enough to venture that far. I added this surprise element for a layer of fun for those who reached it.
Hilton x Wicked Assets
Inspired by assets that the Universal team shared, I designed custom lettering for the “Stay Like Wicked” tagline for the loading animation. I also created a custom logo for “Stories from Hilton” that paid homage to the street signs seen in Emerald City.
Interactivity
Tying into the existing Hilton’s website styling, I kept the shadow elements and color change on hover but enhanced their dramatic effect and keyed them into the Wicked styling. For buttons, I amplified their appeal with a gold gradient and border that transitioned to a mystical green on hover—a direct parallel to the idea of turning “Wicked.”
Key Solves
Balance between the two major brands
I used typography from both brands to balance the two styles, while also making sure not to add any new blocks to the Hilton Stories website’s pre-existing library. The partnership was also clearly distinguished in verbiage on the loading screen.
Exciting Experiencial Takeover
By adding the loading animation as the gateway, it captured users’ attentions immediately, inviting them to explore what was new. While the site structure remained the same, the addition of vibrant colors and patterns made it eye-catching and a joy to scroll through.
Respected Existing Assets While Pushing the Bounds
I made sure to partner closely with both Universal and Hilton to keep legally-approved assets within guidelines, all while exceeding expectations by putting personal touches on elements where made sense.