It's important to remember when programming you are not just writing instructions for a computer, but also for a human. Unique, meaningful element IDs help humans remember and understand the purpose of various elements.
Overview
Students work through a progression of levels to build an understanding of how to use Design Mode to layout an app. The final level has students setting up the screen of an app by attempting to copy an image of an app.
Purpose
This lesson introduces students to Design Mode in App Lab and the different kinds of screen elements and properties at their disposal in this tool. This lesson not only builds up skills in designing a user interface but also sets students up to begin designing an app of their own in the following lesson.
OBJECTIVES
Students will be able to set up the User Interface of an app including buttons, text, and images
Students will use meaningful names to label element ids
ESSENTIAL QUESTION(S):
How does the design process you will use to complete this part of the course allow you to create visually appealing and functionally useful interfaces for an application you are building? Who could you collaborate with to make your project better?
DISCUSSION QUESTIONS(S):
1. What is a common APP that you use?
2. Take a Minute to Sketch the User Interface of the Main Screen. Label Inputs, Outputs,
and parts of the User Interface.
3. How does the USER Interact with the APP
(❗️) PROJECT / LESSON TASK(S)
P. Make sure you have completed CSP Unit 3, Lesson 1 "Intro to Apps"
1. Participate in Class Discussion
2. Complete the GMAIL Reflection Activity
3. Complete ALL ONLINE TASKS for CSP U3L2
4. Send in the "Check For Understanding" (Circle 8 Online)
5. Complete your Student Journal Entry
(❗️) GMAIL REFLECTION / ASSESSMENT ACTIVITY
What type of APP's do you use most on your cell phone? What parts are Input, Output, and what parts of the APP are most interesting to you? Try to describe the design features, colors, and other items that you think make this APP appealing. (2-3 Sentences)
Example Gmail
TO: harvey.scribner@techfreire.org
SUBJECT: CSP U3L2
Body of Message: Answer All Questions Listed Above (Copy/Paste Questions into Gmail)
R.A.C.E.S. Method R - Repeat the Question, A - Answer the Question,
C - Cite Evidence, E - Examples / Explanation, S - Summarize your Thoughts
Example Gmail
TO: harvey.scribner@techfreire.org
SUBJECT: CSP U3L2
Body of Message: Answer All Questions Listed Above (Copy/Paste Questions into Gmail)
R.A.C.E.S. Method R - Repeat the Question, A - Answer the Question,
C - Cite Evidence, E - Examples / Explanation, S - Summarize your Thoughts
KEY TERMS
LINKS & RESOURCES
(❗️) POST-LESSON JOURNAL ENTRY
Open your Student Journals and create a brief entry about this lesson. Make sure to note anything about the lesson you liked, parts you struggled with, and who you might teach these skills too outside of school and why.
Students work through a progression of levels to build an understanding of how to use Design Mode to layout an app. The final level has students setting up the screen of an app by attempting to copy an image of an app.
Purpose
This lesson introduces students to Design Mode in App Lab and the different kinds of screen elements and properties at their disposal in this tool. This lesson not only builds up skills in designing a user interface but also sets students up to begin designing an app of their own in the following lesson.
Standards
CSTA K-12 Computer Science Standards (2017)
3A-AP-16 - Design and iteratively develop computational artifacts for practical intent, personal expression, or to address a societal issue by using events to initiate instructions.
CSTA K-12 Computer Science Standards (2017)
3A-AP-16 - Design and iteratively develop computational artifacts for practical intent, personal expression, or to address a societal issue by using events to initiate instructions.
Students will be able to set up the User Interface of an app including buttons, text, and images
Students will use meaningful names to label element ids
Students will begin to understand how to make adjustments to various design elements.
Preparation
Review the programming levels to ensure you understand the fundamentals of Design Mode in App Lab and how elements are created and their properties are modified.
Preparation
Review the programming levels to ensure you understand the fundamentals of Design Mode in App Lab and how elements are created and their properties are modified.
JUST FOR FUN!
Using the links below, check out the Coffee Bunny Original Game and the modified version I created using APP LAP! Use the original game and create your own version. Once completed, post it to our class padlet for others to try at
