Design and code an interactive app to introduce yourself. Students choose symbols, write their meanings, and code navigation paths, blending personal reflection and coding.
How can thoughtful planning, design, and code make About Me Symbols App 🎨 work for its audience?
The through-line for every task in this lesson.
Students will be able to
Reflect on personal aspects through symbolic representations.
Write detailed descriptions of the significance of their chosen symbols.
Code navigation paths to design and guide their interactive stories.
Key vocabulary
eventnavigationparallelsequence
Assessment
Formative
Use milestone checks, organizer responses, and daily test evidence to guide feedback.
Summative
Assess the published About Me Symbols App 🎨 with the analytic rubric.
The student journey
This is a build — not a worksheet packet
Every lesson runs like the story students are about to make: read it, write it, build it, polish it, publish it. The printables scaffold each stage — the published Elementari project is the destination.
1
📖
Read
Students read a short, high-interest passage — a real-world hook, not a dry textbook definition — to spark ideas for what they'll make.
📖Read Before You Build: About Me Symbols App 🎨
An interactive informational app combines a clear idea with instructions that respond to an audience. In About Me Symbols App 🎨, each page has a job and each milestone adds one testable part. The designer should make the expected action vi…
SourcesCode.org — Programming Concepts and Tool DocumentationCode.org — Responding to User Input
In the studio, students bring the project to life — adding art and following the exact writing and coding steps shown below. The Studio Compass walks them through it, one step at a time.
🧭Studio CompassStep 1 / 9
Create Your App's Title Screen with a Start Button! 🌟
Start off with the ready-to-go title page. Put your own spin on it and jazz it up with a "Start" button. We'll code the button to work later.
Key words — tap to learnobject block
Each step checks off & advances on its own
All 9 studio steps · dynamic to the project
1Create Your App's Title Screen with a Start Button! 🌟~5 min
2Designing Your Symbols Page 🎨
3Your First Symbol ✏️~2 min
4Your Second Symbol ✏️~2 min
5Your Third (and Final) Symbol ✏️~2 min
6Coding Your App's Title Screen! 🖥️~4 min
7Coding Your App's User Navigation~8 min
8Returning to the Symbols Page~3 min
9Extension: Lock the Navigation~3 min
4
🔁
Polish
ongoing
Teacher and peer feedback pin right onto the project — students revise until it's ready to share.
Feedback on the project2 pins
🍎
Add one more sentence here so readers get the full picture.
👍 2Teacher
A
The interaction is clear — it helps the reader follow the project!
CCSS · ELA4CSTA7ISTE83 frameworks · 19 standards · DOK 3
CCSS · ELA
Common Core — English Language Arts
4 standards
CCSS.ELA-LITERACY.W.7.5
With guidance and support from peers and adults, develop and strengthen writing as needed by planning, revising, editing, rewriting, or trying a new approach.
CCSS.ELA-LITERACY.W.9-10.5
With guidance and support from peers and adults, develop and strengthen writing as needed by planning, revising, editing, rewriting, or trying a new approach.
Also addressedCCSS.ELA-LITERACY.W.7.6 · CCSS.ELA-LITERACY.W.9-10.6
CSTA
CSTA K–12 Computer Science
7 standards
2-AP-17
Systematically test and refine programs using a range of student-created inputs.
3A-AP-16
Design and iteratively develop computational artifacts for practical intent, personal expression, or to address a societal issue.
2-AP-13
Decompose problems and subproblems into parts to facilitate the design, implementation, and review of programs.
3A-AP-19
Systematically design and develop programs for broad audiences by incorporating feedback from users.
Also addressed2-AP-15 · 2-AP-19 · 3A-AP-23
ISTE
ISTE Standards for Students
8 standards
ISTE 1.4.a
Students know and use a deliberate design process for generating ideas, testing theories, creating innovative artifacts, or solving authentic problems.
ISTE 1.4.c
Students develop, test, and refine prototypes as part of a cyclical design process.
ISTE 1.6.d
Students publish or present content that customizes the message and medium for their intended audiences.
ISTE 1.5.d
Students understand how automation works and use algorithmic thinking to develop a sequence of steps to create and test automated solutions.
Also addressedISTE 1.2.d · ISTE 1.1.c · ISTE 1.6.b · ISTE 1.5.c
Full task-by-task mapping — including Depth of Knowledge — is in the answer key.
Differentiation & accessibility
Built to reach every learner
One lesson, three built-in paths — with accessibility baked into the materials, not bolted on afterward.
Extra support
Emerging readers & writers
Read-aloud and multilingual support in the Elementari build
Studio Compass highlights one task at a time — including the coding
Sentence frames and a word bank so it is never a blank page
On grade
The core lesson
The passage and storyboard exactly as written
Model answers and “look-fors” in the answer key
Self-check chips at every milestone
Ready for more
Extension & challenge
Challenge vocabulary and a real-world extension question
Deepen one existing page or interaction — without changing the required mechanics
A longer, evidence-based reflection prompt
Accessibility, built inPredictable step-by-step structureOne task at a time · Studio CompassHighlighted response areasLow-stimulation printMovement-friendly pacingDesigned so every student can design, write, and code — with ADHD, autism, and dyslexia in mind.
Questions
Teacher FAQ
Do I need to know how to code?
No coding experience needed. Studio Compass guides students through Guided Steps — each names the exact block and checks itself off — while you facilitate.
What devices does it work on?
Any modern browser — laptops, Chromebooks, and tablets. Nothing to install.
Do my students need an account?
No student email addresses required. You roster your class in a couple of clicks, and students join with a simple class code.
Is it standards-aligned?
Yes — each lesson shows national frameworks and supported state codes from your Standards setting, with specific standards and DOK levels called out in the answer key.
Can students work at different levels?
Built-in read-aloud, sentence frames, and task-level word suggestions meet students where they are, and the self-checking steps let each student work at their own pace.
How do students share their work?
They submit to you for review; you publish the best to your class showcase, each with a public link.
Ready when you are
Bring this lesson to your class
Import your class, assign in one click, and watch them build — the whole kit comes with it.
