Overview:
I collaborated with a coworker to redesign the Pittsburgh Penguins’ single-game tickets page. We aimed to replace the existing Awesome Table integration with a more customized and user-friendly solution, providing better filtering options and a smoother experience for users. Our goal was to improve usability while maintaining brand guidelines.
Process:
- Research:
We researched ticket pages from other sports teams, especially MLB, and reached out to teams for insight. Based on this, we modeled our solution to offer more intuitive filters for theme nights, rival games, and promotions. - Design & Prototyping:
We sketched ideas and created wireframes, then used CodePen to code and collaborate on the page design. Our CMS’s preview feature allowed us to iterate quickly and make real-time adjustments. - User Testing:
We tested the page internally, gathering feedback from colleagues. One key change we made was making giveaway images always visible, instead of hidden in dropdowns, to enhance user engagement. - Development:
We coded the page using HTML, CSS, and JavaScript, adapting elements from MLB sites to fit the Penguins’ branding and CMS limitations.


Challenges:
Adhering to the Penguins’ design guidelines while working within CMS constraints was a challenge, but we were able to create a visually appealing and functional page despite these limitations.
Outcome:
The final design was well-received by colleagues in the Penguins organization and the hockey industry. The improved filters and interface helped streamline the ticket-buying process, aligning with user needs and business goals.
Reflection:
This project sharpened my skills in front-end development and user experience design, teaching me how to balance user needs with technical and branding constraints. In the future, I would focus on enhancing the visual styling to further elevate the user experience.
While the site has been updated for the new season, the core coding framework that I helped develop is still in use, as shown below.