Lesson 6.1: Design Basics

Learning Objectives

Students will be able to…

  • Identify the key considerations when designing a piece of software.

  • Describe methods for prioritizing features, use cases, and/or scenarios.

  • Explain why design and planning are necessary steps in the software engineering process.

Emphasize with students

Curricular Competencies - understanding context, defining, ideating

In this course, we are not actually typing out any code. In our case, “coding” would refer to the stage where we actually drag-and-drop in the Snap! design environment. Later when we learn other languages, “coding” would refer to when we start typing out code in a specific language like Java or Python.

When we first learn computer programming, it may seem fun to dive right into coding. Resist the urge to do so! Software development is a process. It begins with carefully thinking about, and planning out, your design. This includes envisioning what the final product might look like, and planning out the steps needed to implement it. Remember, “design then code”.

Pacing Guide

Duration

Description

5 minutes

Welcome, attendance, bell work, announcements

15 minutes

Introduce final project, demo examples

25 minutes

Sample Design activity

10 minutes

Debrief and wrap-up

Instructor’s Notes

Introduce project

  1. Talk about how far students have come this semester.

    • Ask students to think back to the start of the semester and remember how little they knew about programming.

    • Briefly list a bunch of the things they’ve learned (drawing, animation, variables, loops, conditionals, loops, etc.)

    • Maybe show a lab or assignment from early on and remind them that, not that long ago, this was challenging, whereas it now seems nearly trivial (hopefully).

  2. Explain that, for their final project, the students will get to design and build a program of their own choosing.

    • Point out that this will involve more than just writing code-* there will be planning, design, scheduling, and other project management tasks.

    • Emphasize that students will be graded on not only the program they produce, but the process they used to design, plan, and implement it.

  3. Demonstrate a few example projects (with as much variety as possible).

    • Try to hit a bunch of different types of programs. Many students will gravitate towards games, but other options include simulations, productivity tools, musical projects, animations, and more.

  4. Distribute the project rubric and point out key aspects of the requirements.

    • Point out the steps in the process and that each one is equally important.

    • Specifically mention the large number of points for things not related to coding.

    • Remind students that, as they are now Snap! experts, there are high expectations for the depth, complexity, and completeness of their projects.

What are the different categories of software applications? When looking at an application, what type of functionality does it have? Who are the end users, or target audience? What do you like, or not like, about it? What do other users/reviewers say about it? How does it compare to, or stand apart from, other similar apps? As we study and analyze sample applications, we gain experience that will help us design our own.

Sample design activity

  1. Tell students that, as a class, they will now practice some of the design and planning tasks for the project on a well-known app.

    • Pick an app that both you and most of your students have a deep familiarity with, but that is not too complex. Twitter, Instagram, Pinterest, or other relatively small-scope social media work well here.

    • If necessary, scope down the app by focusing on only the core features (e.g. only consider public, text-only Tweets to start).

  2. Walk through each of the design steps in the project rubric for the chosen app:

    • Pitch - describe the basic functionality of the app in one paragraph of less.

    • Define - List the features/scenarios the app will support.

    • Sketch - Draw a very basic wire frame sketch of the main “screens” of the app.

    • In this step, try to keep students from fixating on making their app look exactly like the existing app.

  3. Expand - Build a spec using the Final Project Plan Organizer.

    • In this step, emphasize completeness and detail. Leaving out steps or requirements will make it difficult to plan effectively and will likely force major changes or cuts later.

  4. Plan - Based on the feature list and spec, create a full development plan using the Final Project Development Plan.

    • As tasks and costs are listed, remind students to keep an eye on the total amount of time required and to include buffer for things going wrong. Be sure to prioritize tasks so that cuts can be made if necessary.

Debrief

  • Once all documents have been created, ask students what the next steps should be.

  • Get more detail than “start coding.” Students should be focused on the highest-priority tasks and should understand the plan for evaluating progress throughout the project.

  • Preserve the documents created in the activity to give to students as examples when planning their own projects.

  • Emphasize that both the spec and the plan are “living documents” and should be updated as the project progresses (when new features are thought of, tasks are cut for time or complexity, priorities are reorganized, etc.)

Accommodation/Differentiation

  • This lesson could easily take two or even three days depending on the class. Take as long as is necessary to ensure students have a complete understanding of the steps necessary to create their final project, but try not to get too bogged down in the details of the sample app.

  • For classes with a large number of self-sufficient students, consider having students complete this activity in small groups rather than as a full class. Along the way, have groups share their progress and provide feedback to each other.

Forum discussion

Lesson 6.1 - Design Basics (TEALS Discourse account required).