StageIt
GR6 - User Testing
Design
<Describe the final design of your interface. Illustrate with screenshots. Point out important design decisions and discuss the design alternatives that you considered. Particularly, discuss design decisions that were motivated by the three evaluations you did (paper prototyping, heuristic evaluation, and user testing).>
Screenshot |
Explaination |
---|---|
|
|
|
|
|
|
|
|
|
|
Implementation
<Describe the internals of your implementation, but keep the discussion on a high level. Discuss important design decisions you made in the implementation. Also discuss how implementation problems may have affected the usability of your interface.>
Evaluation
<Describe how you conducted your user test. Describe how you found your users and how representative they are of your target user population (but don't identify your users by name). Describe how the users were briefed and what tasks they performed; if you did a demo for them as part of your briefing, justify that decision. List the usability problems you found, and discuss how you might solve them.>
User Population
As stated before, our target population was choreographers and dance directors who are looking for a better way to illustrate their designs. The users we tested are choreographers for various dance groups at MIT, such as Fixation, Dance Troupe, and the Bhangra Team. All 3 of them are all current MIT undergrads who do choreographing in their spare time, but they all do different styles of dancing: hip hop, contemporary, and bhangra. This being said, we were unable to test professional choreographers for this task, but with the trained hand of an MIT student, I think we got close enough.*
User Testing
We modified the initial test from our prototype to include some new implemented features:
- Create an account and make a new project with your first formation.
- Name this new formation Blues Enter.
- Create a semicircular stage in this first formation.
- Add 5 blue circle dancers to the center of the stage in a vertical formation..
- Give each dancer a different name.
- Save the current formation and create create a new one, with the same dancers on the stage.
- Name this formation Green Enter.
- Add 5 more dancers to the stage as green triangles.. Move all dancers into 2 horizontals lines in the center of the stage
- Add 2 arrows to the stage, pointing outwards from the lines of dancers.
- Make one last formation, so save this one and make a new formation titled Circle Time.
- Move all the green triangles off stage.
- With the remaining Blue circles, arrange them into a big circle.formation
- Add one last prop, a flag to the center of the circle.
- Save and logout.
We encouraged the user to explore the interface while performing the tasks, and we also encouraged mistake-making such that they would be able to use the undo and redo functions. We decided a demo was not needed, as one of the main focuses of our interface was learnability.
Usability Issues
These are problems that each user encountered as we did one final round of user testing with our final prototype:
Issue with... |
Users |
Severity |
Possible Solution |
---|---|---|---|
Renaming a formation |
The first impression of every user we encountered was to double click on the formations table to rename the formation. This is not permitted as we thought that it would allow users to misclick and click away from whatever their current formation is. |
Severity: Moderate |
Solution: Implement the double click as a way to rename the formation, in addition to the current implementation of allowing a click on the name at the top. We could also make it more obvious to the user that they could rename the formation through the current means. |
Formation Selecting |
When selecting the default arranging of dancers, the expected behaviour of the user is that they will be able to move all of the dancers at once as if they are selected, so they would essentially be moving the whole formation. This was not implemented. |
Severity: Moderate |
Solution: Implement selection such that an arrange with no one selected will select all. |
Select Tool |
Prompt to confirm select is not apparent to the user at first glance, as they will try to move the selected items without confirming the total selection. |
Severity: Moderate |
Solution: make the prompt more obvious by changing location to a more central location on the screen, for example the top left or top right. Or make the contrast greater, by changing the color with respect to the stage. |
Select Tool |
Having a multiple select box would be helpful. To maintain consistency with other programs like powerpoint, having a click and drag box such that you will be able to select multiple dancers at once without individually clicking them all does a lot for efficiency |
Severity: Major |
Solution: Implement a box with the selectable jquery class |
More select Tool Issues |
Select to arrange was unclear on first try, but on second try the user was able to figure out how to select in order to arrange only a couple of dancers, and not all of them. |
Severity: Minor |
Solution: link arrange and select together, allow the user to select some or all before prompting for a arranged formation, or move the select button to be clearer. Overall it would decrease the efficiency of the formations minimally by adding an extra prompt. |
Rename Project/Formation |
One user could not tell the difference between a project name and a formation name. Renaming the project name, which is under the Project Settings tab, |
Severity: Minor |
Solution: make the abstraction of formation and project clearer, don’t make this setting editable in a tab connected to the stage formation edit. |
Offstage |
The area for offstage is a bit unclear, and there might not be enough room to hold more than 10 dancers in each area of the offstage. |
Severity:Cosmetic |
Solution: make an offstage “drawer” on each side, such that you can stick dancers in each drawer and hide them, accessing them only as needed. |
Resize Ability |
When selecting multiple dancers, you could also allow resize, as well as move, delete, and arrange |
Severity: Minor |
Solution: Another feature that is expected that we could implement. |
Notes Box |
Clicking on the text in the Notes box does not allow the user to edit the box, clicking anywhere else will prompt text. |
Severity: Major |
Solution: make the text as well as the whole box clickable, so the user can edit the text box. |
Other feature suggestions:
Stage markers in the form of a grid, editable by the user to accomodate each stage.
Invert Selection possibility
Add more keyboard shortcuts, or a keyboard toggle for resize as well as more shortcuts.
Overall the program was very accepted for being an extreme improvement with respect to previous methods of choreographing, and everyone is very enthusiastic that this is a palpable object now.
Reflection
<Discuss what you learned over the course of the iterative design process. If you did it again, what would you do differently? Focus in this part not on the specific design decisions of your project (which you already discussed in the Design section), but instead on the meta-level decisions about your design process: your risk assessments, your decisions about what features to prototype and which prototype techniques to use, and how you evaluated the results of your observations.>