Backstage, Task management website for theaters
Role : Research + UX Design + Prototype + UI Design
A system to future-proof the way Graz national theater manages different task and communicate with its staff
The Client
Schauspiel Grazs is one of the leading theaters participating in AcuTe European project. It is the third-largest theater in Austria. Every season, various entertainment programs, namely Classic, Musicals, and Dramas, are played on its stage. They organize more than thirteen shows per year. This means a handful of task managing, emailing, meetings, and rehearsals are involved for each play.
User Research
To better understand our client and their needs, I did some desk research focused on the theater industry. I also interviewed Karla Mader, the head of the dramaturge in Graz theater. During this structured interview, she walked me through the creation of a play, from idea to rehearsals, the people involved in each project, the amount of communication taken for each play, and the difficulties that are found along the way. Based on this interview, I created an empathy map to identify the pain points she faces daily. This was helpful in the next step, which was making a Persona that is a reliable representation of our audience. Based on the outcomes, I created a user journey map for the persona. My goal was to create an obstacle-free path for the users and highlight new pain points that might not have been found in the earlier stages. It also helped me to identify further improvement opportunities.
Empathy Map
Persona
User Journey
In the next step, I defined the problem statement as followed:
Analyze
After an interview with Karla, we created a workflow of performance in Graz and all the steps they take to make production go to the rehearsal phase. They also provided us with an example of their current yearly scheduling system on Excel. I analyzed this sheet carefully to find room for improvement and changes.
Work Flow of Graz
Excel Sheet Example
Ideation
Based on the problem statement and results of the analyzed, I managed a brainstorming session with other classmates focused on UX design to develope ideas and main features of the website. The result of this brainstorming session can be found in this picture:
brainstorm session
Design
A site map was necessary to define the taxonomy and the connection of individual pages. All the parent/child relationships in the websites are included in this sitemap.
Site Map
The next step started with designing lo-fi wireframes of the website. These wireframes helped me to map out the functionality of each page and run A/B tests and usability test to collect valuable feedbacks.
Wireframes
Design System
Regarding the size of the project, creating a design system including a collection of design guidelines, components, and patterns was important. This design system created a consistent look and feel across the website.
Stylesheet
