Sydney Theatre Company
Completed at: Deepend Sydney
Location: Sydney, Australia
Role: Information Architect, User Experience Designer, User Interface Designer
Live link: www.sydneytheatre.com.au
The Sydney Theatre Company underwent radical rebranding with the introduction of Cate Blanchett and Andrew Upton as artistic directors in 2011. A new website was required to improve their current subscription process and ticket allocation interface.
Brief
Translate the newly established branding and print collateral (the example shown below) into an engaging digital experience that reflects their stature as the leaders of Australian theatre. Using the Tessitura CRM platform, design and build an AA compliant accessibility rated ticketing system, that includes a Select-Your-Own-Seat interface usable by all ages. Provide users with a creative way to explore the latest in Australian theatre.
STC was created in an agile-scrum environment. The project was to last 8 months with fortnightly sprints.
Image credits: collider.com.au
User experience design
We began with a content and IA audit of their existing website and then primarily focused on user journey mapping of the single ticket & season ticket purchase path. Auditing the content and information architecture of the existing STC website was done with a sequence of card sorting and tree testing activities.The season ticket purchase existed only in paper format submitted via mail. The challenge here was to bring season ticket purchase online in an engaging and informative way and separate the single ticket purchase path into a different experience.
At this point, after assessing the types of content we introduced The Magazine. Aligning with the strategic vision, this was to become a way of bringing the behind the scenes action of STC to the forefront creating a vibrant tangle of interviews, features, videos, podcasts, profiles, photo galleries, essays and archival material, shining light on the work that STC do and the talented people working there.
Using the 6 personas we established, we tested and refined each user journey creating a giant web of possible paths. We agreed to do two types of prototyping of the ticket purchase path: Paper-prototyping and then HTML prototyping. I sketched multiple solutions for the paths on paper as a protptype and tested them with an external usability agency. Using the best solution from this, I facilitated the development team to create an HTML prototype that was tested again. It passed usability “with flying colours”.
While the HTML prototype evolved into wireframes for the ticket purchase path, the rest of the website needed to be wireframed according to the IA we had previously determined. As each new page began, a new story and set of requirements for that page were created. Wireframes and interaction maps were sketched. As the designs were completed, they were built iteratively.
User interface design
Working closely with the brand team at Collider, we translated their print collateral into a brand that was feasible for the digital space. The design needed to be flexible so that as the years passed and brand evolved, the site could cater. The brand used coloured blocks and type lockups and we emulated this successfully on the website.
I opted for clean white backgrounds with black text and highlight colours representing each performance. All colours were tested for accessibility compliancy.
The website now stands as the voice for Australian theatre.
Interactive date picker
The interactive date picker was to be on each production and event page. It was the doorway unto which they began their purchase path. Working with the developers, we perfected the animation for the interactions and created a unique, intuitive and interactive date selector for users.
Drag ‘n’ Drop season ticket builder
The Drag ‘n’ Drop Season Ticket Builder is the fun and engaging season ticket creator. We created a Drag and drop interface for returning users to select a minimum of 6 performances and build their custom ticket for the year ahead. Showcasing chronologically the performances for the year, the user was guided down the page and instructed to drag performances into their ticket.
Modular Homepage
Using blocks and type lockups taken from the print brand, we created a vibrant and colourful landing page that was a cross-section of the entire site. Surfacing various types of content on the website. The coloured blocks translate well for responsive devices and proved to be an engaging introduction to the new STC.
STC Magazine
Sydney Theatre Company’s online Magazine is a vibrant tangle of interviews, features, videos, podcasts, profiles, photo galleries, essays and archival material. It provides users with a way to immerse themselves into the upcoming and past performances and create a forum to discuss the world of theatre, exploring global themes in the arts and cultural landscapes. Each article is tagged with a date, category and performance to aid users in discovering content.
Select Your Own Seat Custom Interface
The Select-you-own-seat interface is the simple and intuitive solution to a complex set of requirements. Users are given the option to further customise their tickets by choosing the physical seats, in the section of the theatre they desire, for each performance they select.
Custom Horizontal Calendar
I created a custom horizontal calendar to help users explore the season by date. Results can be manipulated further by toggling the category tabs.
