Pasadena Playhouse

We joined forces with the Pasadena Playhouse prior to their major rebrand, helping patch and fix an antiquated content management system (ModX, circa 2011) as well as designing and developing an interim upgrade until they completed their centennial rebrand.

In 2017, Pasadena Playhouse working with Pentagram, conducted a major rebrand — an entirely new, unique look, establishing a whole new direction for the Pasadena landmark. We were brought on to build the website, integrate with Tessitura and work with Pentagram to bring their design to life.

With an accelerated timeline, as we needed to launch in conjunction with their opening season, we were able to execute along with a lot of help from the Playhouse team and the Pentagram team.

Design to Development

Pentagram has an eye for detail. We were provided template mock-ups for both desktop and mobile. With Pentagram’s direction, we developed pixel-perfect translation of their designs to the web.

Custom Content Builder

For the Playhouse, it was imperative that their team needed to update content, add new events and shows. We built a custom content builder based on common design patterns throughout the mock-ups that were provided. Each of these patterns was built as a component that would allow the Playhouse the flexibility to manage, update and create new content while still maintain the brand authority and integrity of the original designs.


Shows and events had complex needs including over 7 different artwork pieces all at different sizes that need to be translated site wide depending on the component and layout they were being used in. Using custom post types, we create a custom shows and events builder allowing the content manager to build the show or event in a single location and then decide which pages they would like the show or event displayed on — with all the data automatically populating depending on the specs of the component or layout of the page.

Tessitura, TNEW and Connecting WordPress

Pasadena Playhouse uses the CRM and Ticketing application Tessitura.  They use Tessitura’s product TNEW (Tessitura Network Express Web), a public web interface connected to the Tessitura backend, to sell tickets, manage memberships and accounts. We worked within the TNEW system to create a custom template that aligned with the live website and create a seamless user experience between the WordPress site and the TNEW site.

The TNEW calendar was not responsive nor a good user experience. Using the Events Calendar plugin for WordPress, we customized the plugin to create a branded calendar as well as developed a script to pull events from TNEW and populate the Events Calendar within WordPress. This was an intricate part of the project and without this integration, the user experience would have been greatly diminished.

Project Management

We needed to align the website build with the overall brand reveal. With a tight timeline and a lot of moving parts (content, photos, video, and other brand assets were being created as we were developing), it was imperative that we had a detailed, communicative and collaborative process. We turned to a few of our favorite tools (Trello, Google Drive, Pageproofer) to keep the project moving forward while knowing we needed to have just enough flexibility in our schedule as many things were being decided upon as we went.

In the end, we could not have pulled this project off without the contributions of the Pasadena Playhouse (shout out to Jackie, Elias, and Julie) and Pentagram (shout out to Rory and Claudine).