Students will be able to...
- Define key scenarios for a project and the features required to implement each scenario
- Explain the importance of wireframing when designing an application
- [Final Project Plan Organizer](Final Project Plan Organizer.docx) handout
Duration | Description |
---|---|
5 minutes | Welcome, attendance, bell work, announcements |
10 minutes | Review pitches |
20 minutes | Scenario definition |
15 minutes | Wireframing |
5 minutes | Debrief and wrap-up |
- Review pitches
- Have students look at their revised pitches from yesterday. Tell them that they will be choosing one to pursue as their final project.
- If desired, give students a few minutes to rework their pitches or get more feedback from a classmate or instructor.
- Ask students to choose which idea they want to pursue, and write it down on the top of their [Final Project Plan Organizer](Final Project Plan Organizer.docx).
- Defining Scenarios
- Defining the term "scenario" for students:
- scenario: a description of a set of interactions and/or tasks that describe a start-to-finish example of how a user might want to use the application
- Explain that defining scenarios helps a programmer focus on what features are actually necessary to enable the key user interactions for their application
- Instruct students to write down at least 3 scenarios for their project describing, from start to finish, interactions a user might have with their program to accomplish a specific goal
- The scenarios should have a moderate level of detail in the description of the user interaction (e.g. "push a button," "type in their name," etc.) but should not include any design or implementation details.
- Once students have written their scenarios, they should review them and develop a list of the necessary features to enable each scenario
- Again, there should be minimal technical detail in these descriptions, instead focusing on details of the user experience. The feature lists should should be more about requirements than implementation.
- Defining the term "scenario" for students:
- Wireframing
- Define the term "wireframe" for students:
- wireframe: a high-level sketch of an application's user interface intended to help visualize layout, interactions, and transitions
- Explain that wireframes do not include any details (such as specific graphics or text), but instead provide a broad impression of what an application will look like to aid in design and planning
- Students will complete page 1 of the organizer by sketching or wireframing the important screens for their project.
- If you have one available, a wireframing tool such as Balsamiq can be used instead of sketching by hand.
- As with all wireframing, students should not focus on the specific details of the sprites, images, etc. that will appear, but instead design the basic layout and main components of each screen.
- Encourage students to reference their feature lists to ensure they include all necessary screens for their project, including simple things like a splash screen, help screen, or exit ("game over") screen.
- Define the term "wireframe" for students:
- Debrief
- As class ends, ensure students retain their work as they will use it to construct a detailed specification and implementation plan tomorrow.