U of M - SMTD


user research, interaction design, visual design, project management


Viviana Hernandez, Lucy Lee, Wu Wang


Founded in 1880, the University of Michigan School of Music, Theatre & Dance is one of the finest performing arts schools in the United States. Encompassing programs in dance, music, musical theatre, and theatre, the school is consistently ranked among the top performing arts schools in the country. The school's performance calendar features over 450 performances a year, while the University Musical Society offers world-class artists who represent the diverse spectrum of live performing arts. Students across the U of M campus obtain information about these performances via a calendar of events on the school’s website. Unfortunately, this calendar is hard to navigate and visually bland, which makes it ineffective and extremely difficult to use.


The objective of this assignment was to build a mobile application to serve as a dynamic, visually pleasing and easy way for patrons to view, decide, and learn about upcoming events sponsored by the School of Music, Theater, and Dance across the several venues in Ann Arbor.


We conducted five interviews with art patrons to understand their motivations for attending events, their decision making process and information they sought about events prior to attending them.

Affinity Mapping

We created an affinity map to gather insights from our interview data. We found that the core motivation to attend performances was the opportunity to get together with friends while secondary motivations were tied to convenience factors like location and price.

Persona & Scenarios

We used personas and scenarios to step into the shoes of the end user and transition to the design phase. More importantly, personas and scenarios proved to be ideal as a communication tool to elucidate our findings from the user research phase to the client.

Design Brainstorming

We used the personas and scenarios to brainstorm ideas as a group collectively. The objective was to get as many ideas out with no filters. Subsequently, all of the ideas were discussed in relation the goals and motivations of the end user and streamlined.


We turned some of the ideas from the brainstorming session to paper sketches. In this phase we started paying a little more attention to product features and started discussing interactions and flows.

Annotated Wireframes & User Flows

We pieced together wireframes and annotated features and interactions for developers to get a holistic understanding of the product. The user flow described interactions in detail. Throughout this process, the personas and scenarios guided our design decisions. Below is a snapshot of the user flow diagram.


Once the wireframes were finalized we used our graphic design skills to generate visuals keeping in mind the Michigan (Blue) theme!