Interactive Media and User Experience

Active learning works because interactive media design is a hands-on discipline. Sixth graders learn best when they touch, move, and test ideas rather than just listen. These activities turn abstract concepts like affordance and feedback into visible, testable moments.

• 6th Grade
• Visual & Performing Arts
• 4 activities
• 20 min–50 min

Learning Objectives

1. Analyze the visual hierarchy and navigation of a given website or app to identify elements that enhance or hinder usability.
2. Evaluate the effectiveness of affordances and feedback mechanisms in a digital interface for a target audience.
3. Design a simple interactive element, such as a button or navigation menu, for a hypothetical app, justifying design choices based on UX principles.
4. Compare and contrast the user experience of two different digital products, citing specific examples of good and bad design.

Think-Pair-Share

⏱ 20 min·Pairs

Think-Pair-Share: App Audit

Students open a familiar app or website (school-approved) and spend five minutes independently noting two things that make it easy to use and two things that create friction or confusion. Partners compare observations, then pairs share findings with the class to build a collective list of what makes an interface work. This grounds abstract UX vocabulary in concrete, personal experience.

Prepare & details

How does user interface design impact a user's interaction with digital media?

Facilitation Tip: During App Audit, assign specific app categories (e.g., games, social media) so students compare tools with similar purposes rather than random selections.

Setup: Standard classroom seating; students turn to a neighbor

Materials: Discussion prompt (projected or printed), Optional: recording sheet for pairs

• Understand
• Apply
• Analyze
• Self-Awareness
• Relationship Skills

Problem-Based Learning

⏱ 50 min·Small Groups

Paper Prototype: Three-Screen App

Small groups receive a simple design brief (a homework tracker, a classroom library check-out system) and sketch three connected screens on paper index cards. Groups then swap prototypes and attempt to navigate the other team's design without any explanation from the designers. Designers observe silently and take notes on where users hesitate, then receive verbal feedback before revising one screen.

Prepare & details

Analyze the elements that contribute to a positive or negative user experience.

Facilitation Tip: When guiding Paper Prototype, enforce the 'designer silence' rule strictly so students practice observing user behavior instead of explaining their designs.

Setup: Groups at tables with access to research materials

Materials: Problem scenario document, KWL chart or inquiry framework, Resource library, Solution presentation template

• Analyze
• Evaluate
• Create
• Decision-Making
• Self-Management
• Relationship Skills

Gallery Walk

⏱ 30 min·Small Groups

Gallery Walk: Before and After Interface Comparison

Post paired screenshots of the same interface -- a before and after redesign -- at four to five stations around the room. Students rotate with a structured observation sheet, identifying what changed, why each change likely improved usability, and what they would still adjust. The debrief focuses on which specific changes had the biggest impact on clarity.

Prepare & details

Design a simple interactive element, justifying your choices for user engagement.

Facilitation Tip: For Gallery Walk, provide a simple scoring rubric (e.g., 1-5 scale) so students evaluate interfaces based on clarity and efficiency before discussing as a class.

Setup: Wall space or tables arranged around room perimeter

Materials: Large paper/poster boards, Markers, Sticky notes for feedback

• Understand
• Apply
• Analyze
• Create
• Relationship Skills
• Social Awareness

Problem-Based Learning

⏱ 25 min·Individual

Design Journal: Interactive Element Sketch

Students choose one interactive element (a navigation menu, a submit button, a search bar) and sketch three different design versions for the same function. Each sketch includes annotations explaining the visual choices and how each version communicates its purpose to a user. Students select their preferred version and write two sentences explaining why it would work best for their target audience.

Prepare & details

How does user interface design impact a user's interaction with digital media?

Facilitation Tip: During Design Journal, require students to label each sketch with the UX principle they applied, linking theory to their work immediately.

Setup: Groups at tables with access to research materials

Materials: Problem scenario document, KWL chart or inquiry framework, Resource library, Solution presentation template

• Analyze
• Evaluate
• Create
• Decision-Making
• Self-Management
• Relationship Skills

Teaching This Topic

Experienced teachers approach this topic by making UX concepts visible and testable. Avoid lecturing about affordances; instead, have students hold a physical button and describe what it suggests they can do. Research shows that user testing reveals design flaws faster than explanations. Keep activities short and iterative so students experience the impact of revisions in real time.

What to Expect

Successful learning looks like students using UX vocabulary to explain their design choices, testing prototypes with peers, and revising based on real user feedback. They should move from saying 'It looks good' to 'The button is large and red, so users know to click it, and it changes color when pressed, so they know it worked'.

Watch Out for These Misconceptions

Common Misconception

During Think-Pair-Share: App Audit, students may assume that interfaces with more icons or animations are more sophisticated.

What to Teach Instead

During Think-Pair-Share: App Audit, challenge students to time how long it takes their partner to complete a simple task (e.g., finding a setting). Ask them to note which interface elements slowed them down or caused hesitation, linking complexity to task efficiency.

Common Misconception

During Paper Prototype: Three-Screen App, students may believe that if they understand their own prototype, everyone else will too.

What to Teach Instead

During Paper Prototype: Three-Screen App, remind students that the 'designer silence' rule forces them to rely on visual cues alone. After testing, ask them to identify one point where their partner hesitated and revise that section based on the observed confusion.

Common Misconception

During Gallery Walk: Before and After Interface Comparison, students might think that flashy colors or animations automatically improve user experience.

What to Teach Instead

During Gallery Walk: Before and After Interface Comparison, have students use a checklist to evaluate each interface on clear affordances and immediate feedback. Ask them to note which designs made tasks feel effortless and which required guesswork.

Assessment Ideas

Quick Check

After Gallery Walk: Before and After Interface Comparison, present students with two screenshots of similar apps. Ask them to write down two specific elements that make one interface easier to use, using terms like 'affordance' or 'visual hierarchy' from their Gallery Walk notes.

Peer Assessment

During Design Journal: Interactive Element Sketch, students exchange sketches with a partner. Partners provide feedback using prompts: 'What does this element suggest you can do?' (affordance) and 'How do you know it worked?' (feedback). Students revise their sketches based on this peer input.

Exit Ticket

After Paper Prototype: Three-Screen App, ask students to identify one digital product they use daily. On their exit ticket, they should name one aspect of its design that creates a positive user experience and one aspect that could be improved, explaining why using UX principles they practiced in the activity.

Extensions & Scaffolding

• Challenge: Ask students to redesign a familiar classroom tool (e.g., a sign-out sheet) using UX principles, then test it with a younger student.
• Scaffolding: Provide pre-printed interface layouts for Paper Prototype so students focus on placement and labeling rather than drawing skills.
• Deeper exploration: Introduce accessibility tools (e.g., screen readers) and have students test their prototypes with these tools to identify gaps in feedback and navigation.

Key Vocabulary

User Experience (UX)	The overall feeling a person has when interacting with a product, system, or service. Good UX makes interactions easy and enjoyable.
User Interface (UI)	The visual elements and controls a user interacts with on a digital device, such as buttons, menus, and screens.
Affordance	A visual cue that suggests how an object should be used, like a button looking like it can be pressed.
Feedback	Information provided to the user to indicate that an action has been completed or is in progress, such as a button changing color when clicked.
Visual Hierarchy	The arrangement of elements on a screen to show their order of importance, guiding the user's eye to what matters most.