StageIt
GR2 - Designs
Scenario
Janet is a college student choreographing a dance for her school’s Culture Show. Her dance will have 10 people, 5 guys and 5 girls. She navigates to StageIt to complete this task!
She first chooses and sets up stage, marking off any areas in her dance that would help her in making the formations.
She then creates each formation. She adds the dancers and any props to the stage and moves them to their correct positions, and draws arrows on the stage to indicate movement. She does this for each different formation on stage she intends to have, adding additional information and comments where she sees fit. Once done, she saves the formation, and after practicing on the stage with her dancers, she makes any necessary modifications to the existing formations, and saves them to a viewable format.
Designs
<insert personal designs>
Design 1
Storyboard
Janet navigates to StageIt, where she can view the previous projects she has made. She clicks the "create" button to start a new project.
She is first prompted to choose a stage and so she choose the stage that closely resembles the stage that her dancers will be performing on. She then clicks start.
She creates her first formation by clicking on the People mode. She chooses a shape and color for the dancers from the nav bar near the top of the page. Clicking on the "Add" button, a new dancer is added to the middle of the stage, and she can move the dancer around to the desired position
.
She is able to move groups of dancers and props around by navigating to the Select mode. Once she is done arranging everyone, she then clicks on the + button in the formations panel to create a new formation.
She is prompted to keep existing dancers on the stage. She clicks yes, and starts to edit the second formation.
Switching to the Line mode, she now draws a line on the stage indicating a direction of movement for one of the dancers.
For this formation, some of the dancers will be waiting on different sides of the stage so that they can be accurately positioned when they come in the next formation. She drags the dancers to these areas and positions the rest of the dancers on the stage.
She has one prop for this dance, so she switched to the Prop mode, and since her prop isn't listed in the available prop types, she uploads an image of the prop and moves it on the stage.
Once her formations are complete, she is able to save them and export them to an easily viewable format so that she can show to others.
Usability Analysis
Learnability
Pros:
- External consistency with Adobe Photoshop and other image editing software will make it easy for users that are familiar with these products to learn the interface
- Since actions such as adding dancers or adding props are categorized into different modes, these actions will be easy to pick up
- Affordances in the interface, such as a + sign for adding and a trashcan for deleting, make it easy for users to figure out what to do and how.
Cons:
- For users that aren't familiar with Adobe Photoshop or other image editing software, there is a lot of information on the screen
- For users who don't understand the concept of modes, it will be difficult to learn to use the system
- Users may not understand icons that aren't designed well
Efficiency
Pros:
- It is easy for users to switch between the different actions
- The select tool allows users to move multiple items on the stage at once
- In keeping the dancers that have been added to the stage when creating a new formation, users will not have to re-add all of the dancers and props to the stage unless requested
Cons:
- Adding a lot of new dancers to the stage requires frequent button presses
- Users will have to color specific nodes that are on the stage
Safety
Pros:
- Users will be able to undo changes
- Since users have to physically drag items to the trashcan to delete them, it is unlikely that users will accidentally delete many items
- Formations created by users are always modifiable
Cons:
- If users are in the wrong mode, ie. drawing instead of dragging, then they might do an unintended action
Design 2
Storyboard
Javert's first choreographing project:
We titled this design task-oriented because we wanted the user to feel comfortable, and increase learnability as much as possible. So each step is outlined clearly and judiciously, with some affordances.
After selecting a stage, they have the option of adding props or not, in this case Javert wants a big tree in the middle to make a ring around the tree, so the chooses one from the menu.
Something that is not seen here is the color. Color is key to the safety of the design.
Here we illustrate where the user has full control of what goes in and out of the design, and can add and delete as he pleases.