How I helped redesign the Penn Entertainments website with our new design style.
I took on the role of UI/UX Designer and Interaction Designer for this rebrand, I worked along side 1 other designer and my primary focus was the homepage.
Nov - May 2024
(6 months)
Wireframes
Design Artifacts
Interactive Prototype
Figma, Notion, Google Docs, Miro, Maze
Take a look at what the design and layout of the past brand style looked like.
I created design artifacts to maintain consistency in the current design style and to provide documentation for future designers.
The Marketing Department provided me with a chosen fonts and colors, however font styles and neutrals + gradients still needed to be chosen and laid out.
Building out components
• Navigation
• Heros
• Cards
• Carousels
Users found the previous website outdated and difficult to scan for information or navigate to vital resources.
Improving the style and layout of the site, creates less visual strain for users, allows them to access CTA's more fluidly, and reduces barriers to successfully completed flows.
The plan for my first iteration included making the home-page prioritize user actions and put Penn's services front and center.
• Action-Centered: The previous navigation contained links to a lot of extraneous information that wasn't focused on Penn's loyalty, rewards, hotel or dining experience.
• Improves Rate of Successful Flows: This navigation resulted in higher rates of users being able to successfully complete flows related to Penn's services.
• Intuitive Infrastructure: Drop-down selects allow users to scan all of their options quickly and efficiently complete their booking.
• Increased Rate of Bookings : After this design was implemented, the rate of successful hotel and dining bookings increased by 35%.
I tested a group of 10 randomized users to stay mindful of my assumptions regarding the Penn Entertainment website, it's functionality, and it's design style
The majority of participants found the new navigation more useful or relevant than the last.
Previously hotel and dining bookings were made over the phone of in person. Users were surprised and gave raving reviews of the new functionality.
When asked about their wishes or wants for the website users listed:
• Better breakdown of organizations and their roles within the Penn Umbrella
• Explanations of Penn Plays loyalty and rewards system
• More information on Penn's hospitality offerings.
User were able to easily and quickly navigate the first flow for the homepage but expressed wanting the content and functionality to stay consistent and thorough across the site
After testing and interviewing users and discussing my findings with my Product Owner and another Designer on my team, I quickly built out the rest of the web flows and minor edits and acquired consensus on all the changes I intended to make to the app.
The hotel flows required adapting some of our pre-existing components, I was responsible for updating the design system with these new components and the new buttons.
• Improves Scan-ability I added cards with images, instead of needing to scan text for each option on the page, the images provide context as to the cards value. The CTA's are in chartreuse, the interaction color in the color palette, making them standout.
• Carousel Efficiency: Putting the cards in a carousel allows the users to flip through them without taking up too much real estate on the homepage.
• Speeds up Users Ability to Scan : Maintaining a consistent layout with compatible page components creates familiarity and allows users to scan and sort information more quickly
• Added Content : With the Penn rebrand, it's newly added features, and Penn's numerous great organizations under it's umbrella there was a lot of content to add into the site, allowing the user to familiarize themselves with all things Penn Entertainment.
