DANCE TROUPE

Collaboration tool for dance instructors

CONTEXT

DATE: Spring 2018

ROLE: UX Designer 

PROJECT: Design an application that helps dance instructors share ideas and connect with each other.

Designed with a group of four UX Design students for Introduction to User-Centered Design (HCDE 318)  at the University of Washington. 

TEAM: Asikur Rahman, Eksanie Ghattas, Alice Li, Alyssa Spickermann

THE PROBLEM

Dance instructors experience a difficult challenge of finding new choreography ideas to teach their student and this process can be mentally and physically draining. Currently, there is also no dedicated central hub to connect dance instructors and students for collaboration. DanceTroupe aims to help build a supportive community that makes gathering new choreography ideas for dance instructors easier and encourages students to practice more outside of class.    

USER RESEARCH

We conducted four semi-structured interviews with dance instructors teaching various styles such as ballet, modern, ballroom, and tap. After interviewing, we used affinity diagraming to sort important categories relating to our user's daily life, pains, goals, and the technology they use. With our gathered data, we were able to create two personas that represented our user group. 

We found that dance teachers struggle with:

  • Balancing multiple skill levels and learning styles in a class

  • Finding new choreography ideas

  • Finding music to fit the exercise routines they create, due to rhythmic changes

PERSONA

After researching about our user group, we created two personas based on our findings in the interviews. The polished personas allowed us to understand our users’ needs and create an application that focused on their day-to-day lives. We created one persona that focuses on a social dance teacher, and one for a performance dance teacher. The persona helped us create a user journey map of their feelings, letting us visually understand their mental states while performing similar actions to those included in the scenarios.

P2_Persona Edits.jpg
P2_Persona Edits2.jpg

USER JOURNEY MAP

A journey map was created to allow us to understand and analyze a typical day of our target user. We identified touch points between Cathy and her dance studio environment and pinpointed how each of those interactions affected her actions and emotions by setting three emotional variables: frustration, enjoyment, and motivation. The journey trends are based off of what we learned from our interviewees. The user journey map allowed us to learn which part of the dance instructor's routine was most frustrating and those touch points helped determine the design requirements in the next step.

Screen Shot 2018-06-04 at 10.07.54 AM.pn

DESIGN REQUIREMENTS

The following design requirements are generated based on our user journey maps and research. The design requirement features are included based on our users’ pain points. These requirements are created so that we have a clear goal on what kind of product we want to design.

 

With design goals in mind, we would be able to create product storyboards. In the storyboards, we can brainstorm how we can approach each design goal, and express it through drawing. The following are some design requirements we came up with.

  • Allow instructors to upload dance videos for feedback

  • Allow instructors to search for music for their choreography

  • Allow instructors to give feedback to other user's videos

  • Allow instructors to connect with students outside of studio 

  • Allow instructors to see comments for their uploaded videos 

  • Allow instructors to create their own company which is their network of friends, students, and instructors. 

STORYBOARD

A storyboard serves the purpose of exploring designs in a visual way. Through storyboards, we would be able to visualize how users could interact with a potential product. At the same time, designers will be able to explore possible ways to address the design requirements. We learned that designers could draw out possible interactions between the user and the product so that the user's experience could be presented in the form of comic panels. With the help of storyboards, we were able to create a information architecture map explaining the information flow of our design.

StoryBoard_final-2.jpg

INFORMATION ARCHITECTURE

Information Architecture (IA) map is a diagram which consists the hierarchy, navigation and information flow of a design. The IA map is a intuitive diagram which shows how users will navigate in the design. We created the IA map to visualize the whole user navigation process. Also, what kind of screens we might need, and how we should format our design to meet all the needs. We used the storyboards we made previously to help us decide on the features we need in the application we are designing. The IA map creates a good “Table of Contents” for what screens we should make for the application, which helps in making the paper prototypes. Through the IA map, we learned the different screens we might need in the application.

Final.png

TITLE OF THE CALLOUT BLOCK

PAPER PROTOTYPE & USABILITY TESTING

Paper prototype is a low fidelity prototype for designers to quickly draw out ideas for designs. We drew paper phone screen to express our ideas about the app’s layout and where the buttons are. Referring to IA map we made, we knew which screens we were supposed to make. We were able to create our entire system through the use of paper prototypes. The prototype can give our tester/user a good idea of what the application will look like. Afterwards, we will gain important and intuitive feedback on our application. 

The three tasks we asked our testers to complete were: 

 

1. Critiquing and providing feedback on students' videos 

 

2. Finding choreographed dance series for learning

 

3. Inviting a student/instructor to their company 

TITLE OF THE CALLOUT BLOCK

USABILITY TESTING FINDINGS

We gathered feedback by conducting usability tests with participants we did our initial user research with to see if our design met our intended users expectations. Conducting these usability tests helped us understand what worked, didn't work, and was not intuitive with our design. Through our feedback, we were able to identify many improvements, the most prominent being: 

 

1. Critique feature was not clear and confusing to find 

 

After asking users to critique and provide feedback, we immediately noticed users were very confused. Most users took a very long time to make a decision and some chose the “message” button instead of the “comment” button. Several users mentioned that it is not clear which button is for providing critique. They recommended providing an icon relating to providing critique so it is easy to differentiate each unique button.

 

 

2. Users are interested in seeing full choreography pieces instead of dance series

 

Most users found it easy to navigate to the list of choreographed dance series they could learn about and mentioned they found the navigation process simple. Users mentioned that they would be more interested in being able to see other instructors full choreography pieces for inspiration rather than learning about a specific dance series.

 

 

3. Unknown terms such as "Company" needs to be defined 

 

During the third task, we asked the users to add “Alex” to their company. We noticed that when we mentioned the word, “company”, users looked confused and it was clear that they needed more clarification on what that term meant. After we explained to our user that a company is another word for their network, the user understood it clearly and was able to complete the task of adding Alex to their company. If we had mentioned the word “company” to our primary users they would have understood the language.

 

 

 

 

 

 

TITLE OF THE CALLOUT BLOCK

ANNOTATED WIREFRAMES

Collecting the usability testing findings helped us improve the layout, information architecture, and symbols included in our app. Wireframes were created based off of our research, initial paper prototype, and testing which allowed us to conduct more interactive user testing and identify pain points. 

1/2

TITLE OF THE CALLOUT BLOCK

HIGH-FIDELITY MOCKUPS 

Creating the high-fidelity mockup screens is the last step of our design process which was created based on the iterative feedback gained through user testing.  The following screens we created display Dance Troupe's core functionalities: Home feed, personal company, and music searching. These screens represent our final iteration of our design that helps address our user’s needs. 

TITLE OF THE CALLOUT BLOCK

WHAT WOULD I DO DIFFERENTLY NEXT TIME? 

This group project provided a great look into the UX process and how it is applied. After going through the entire UX process, there were many learning lessons I gained that I believe will help improve my design process as a UX Designer. Listed below, are few of the things I have learned. 

 

 

DEFINE USERS BETTER 

 

 

Throughout our design process, we tried creating an app that would focus on two users: dance instructors and students. As we designed the app, we realized that it was becoming difficult for our users to understand the difference between how a student would use this application vs a dance instructor. We tried creating one solution that fits multiple different types of user needs. In doing so, our application failed to address the needs of our original user: dance instructors.  Moving forward, I believe it would be helpful to define one type of user to help show an accurate representation of that user's experience. 

 

 

FOCUS ON LESS FEATURES 

 

Our app included too many features such as creating a network, music searching, and having a personalized  home feed which led us to lose sight of our initial goal due to scattered focus. If we were to redo this, we would focus on showing the social aspect of how dance instructors can connect with students and provide helpful feedback, and showing how dance instructors can collaborate with other instructors for choreography inspiration. 

 

 

HIGHLIGHT FRUSTRATIONS IN USER JOURNEY MAP

 

Our user journey map focused on areas of frustration that did not seem very relevant. The user journey map could be improved by focusing more on the pain points of the dance instructors experience with teaching students and struggling to find new choreography ideas for their class. Highlighting these specific pain points would better support our design requirements. 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Like what you see?

Let's chat.