The Client

Seattle Children's Theatre (SCT) is one of the most prominent theaters for young audiences in the United States and the world. The SCT brand values evoking “big feelings” by masterfully balancing entertainment with provoking thought and conversations around important issues.

With that in mind, SCT asked a group of SVC students to come up with ideas to encourage educators to actively engage with productions and initiate discussions on significant contemporary issues.

My Role

Interaction Design, Prototyping & Testing, Presentation Design, User Research

Collaborators

Chris Lafferty (PM, IA, Wireframe)

Regina Anderson (Content Design, User Research)

The challenge

In the past, they provided educators with an Active Audience Guides in both digital and printed formats. The guide would help them to prepare for pre-, during, and post-show experiences, aka “wraparound experiences”. However, SCT wants to change the format to a more interactive and less text-heavy approach, anticipating that educators will share their experiences with others — leading to more attendance and revenue growth. With that, a question was asked:

How might we create an interactive and engaging solution that eliminates the necessity for the traditional teacher guide?

Goals

To facilitate educators in gaining a better understanding of the play they are about to see, currently seeing, or have recently seen, we needed to enhance their experience with a interactive material. This will deepen their understanding and appreciation of the content, enabling them to enrich the field trip experience with interactive teachable moments.

The Research

What can we learn from the previous experiences?

In this research, our aim was to delve deeper into educators' experiences with SCT and theater performances in general. Our objective was to understand their pain points, particularly regarding the Active Audience Guide provided to them (available for viewing here). We wanted to discover:

  • What are their opinions on the Active Audience Guide?

  • What could make the SCT experience more engaging?

  • What did they find challenging about the field trip experience?

  • What motivated educators to go to theatrical performance?

  • How did they prepare their students for a field trip, and what aspects did students enjoy the most?

We conducted surveys and user interviews, with all 12 participants being middle school teachers who had previously taken a class to a theatrical event.

And what did we learn?

100% of educators stated that children need to learn proper behavior in the theater, as many of them have never been in one before.

100% of educators said having materials about the play available well ahead of time would help them incorporate it into their curriculum.

80% of educators said videos are most engaging to kids, since they have short attention spans.

75% of educators identified historical context resources as a teaching necessity.

Behind the scenes videos would be a welcome addition to show kids how things are done in a play.

70% of educators stated that they don't use the Active Audience Guide because it's text-heavy. Additionally, one of them mentioned that they didn't even know it existed.

Data-driven insights

What did the data tell us?

Educators don’t have time to gather teaching resources

Kids require teachable moments in short, bite-sized chunks

So we aimed for a centralized place for:

The Portal, aka ✨ Solution

After analyzing all the data collected so far, it was clear to the team what the solution was: a teaching portal housed within the SCT site that would have all the teaching resources an educator would need to give their students an enriching field trip experience.

Design

Time to design wraparound experiences

Wireframe

In order to facilitate testing procedures, my team and I created a wireframe, following the pre-existing design framework implemented on the SCT website and their guidelines. We aimed for a centralized place full of teaching resources.

Filter

The feature I was most excited to implement was the Filter.  The idea is to give educators tools to find the exact content they’re looking for in an easy and practical way, without having to scroll and navigate through different pages to find it.

The filter had the following sections:

(1) Apply Button: Action button for the options selected be filtered.

(2) Shows: List of shows of the season

(3) Type: Either PDF or a video.

(4) Age: Divided by 3 to 13 years old.

(5) Subject: More specific subjects, like “About the Play” or “Activities”

(6) Cards: Available resource materials about the plays.

The portal also included two different types of pages, accessible through the Teaching Portal homepage: 

(1) The play page, having the complete information and available content about a specific play of the season in just one place. 

(2) Theatre Etiquette, a page where videos about how to behave in theatres are available to watch. Another similar page was the Video Hub, same structure, except it contains videos about behind the scenes or how the production works.

User Testing: what is working and what isn’t.

A cohort of seven participants engaged in a series of six tasks. These tasks were strategically designed to assess the effectiveness of navigation, filters, breadcrumbs, categories, and labeling, as well as the overall visual user experience of the wireframe. All tests were online, via Zoom. The results were:

“Apply” Doesn’t Apply

Most testers didn’t know to use the “Apply” button to activate the filters.

Confusing Labels

Over half of testers couldn’t find correct content due to unclear category labels.

Content overload

4 out of 7 testers said the portal page was too busy and caused confusion.

Portal Name

All testers said the “Teaching Resources” label was the most accurate name for the portal.

“I like the filtering by age. That can be really useful for my demographic of students.”

- Quote from a 5th Grade Teacher during the testing.

We were on the right track, but still have some fixing to do. The user testing was able to show me what issues the portal has, and that’s what I started doing in the next stage of the project.

High Fidelity Design

The realistic preview of the portal experience

How was the Portal features improved?

Taking the User Testing in consideration, I improved the Filter feature. I explored a variety of different ways for the Filter Content Cards, always with the focus on giving the information for the user without clustering the card.

(1) In response to negative feedback obtained during User Testing, I eliminated the 'Apply' button to streamline the user experience. Instead, the filter will instantly change the results as soon as an option is selected. However, the Search bar remained in this version.

(2) An interactive drop-down menu was added. I optimized the filter functionality to be dynamic and minimalist, aiming to enhance user clarity and avoid confusion.

(3) Filter chips were added, allowing the user to unselect an option or even know what is being filtered.

(4) I included the play title so the user knows from which play each material originates.

Clear and intuitive cards

One aspect I aimed to address was the content overload and the confusion caused by labels that users experienced during the User Testing. Taking this into consideration, I implemented changes to create clear and intuitive cards.

Organized individual play pages

Breadcrumbs and Information Architecture

In the initial wireframe version, buttons were incorporated at the top of the pages (1) with the intention of enhancing accessibility and saving users time as they navigate through the pages. Despite the good intention, this approach did not adhere to a well-structured Information Architecture hierarchy.

Keeping this in consideration, I added breadcrumbs (2), aligning them with the SCT visual guidelines established by the current website.

Presenting the solution

Following the completion and refinement of the prototype, I created the presentation slide, and alongside my team, I showcased the Teaching Resources Portal to the client. I was proud and happy with the solution we offered to SCT, and the feedback received was overwhelmingly positive. The client was pleasantly surprised by the delivery, as it exceeded their initial expectations. The Portal's interactive and engaging features fulfilled their needs for providing educators with a superior experience, resulting in increased attendance and revenue growth.

Client’s Feedback

“Really love the archive idea, especially thinking about work that’s been done in support of different hobbies and interests. We currently don’t have a way to go back, so it would be so great to offer this.”

- Kevin Malgesini, SCT Managing Director

Presentation Feedback

“Andressa, you’re an excellent presenter. You come across as knowledgeable and speaking from your heart and brain – not notes. Also, you’re modulating your voice well and keeping eye contact going with the camera/audience. Your enthusiasm for your recommendation is shining through very nicely. Good step-through of the problems uncovered in the usability testing.”

- Larry Asher, School of Visual Concepts Director

Reflections

If I had more time, I’d have designed a mobile version. While the initial emphasis was on desktop (based on research), incorporating a mobile version would ensure the website's accessibility across all platforms.

This project holds a special place in my professional journey, as the project I am most proud of. I enjoyed every step of the way, from research to the final prototype and presentation. The process not only allowed me to contribute significantly to the project but also gave me huge learning opportunities, giving me experience collaborating with others in a UX setting, expressing my opinions, and making design decisions.

Educators Portal