Technologies · Year 8

Active learning ideas

Visual Hierarchy and Layout

Active learning works because accessibility design is best understood through lived experience. Students need to feel the frustration of a poorly designed interface to truly grasp why visual hierarchy and layout matter. Simulations and role plays create empathy, while collaborative investigations let students test solutions in real time.

• ACARA Content Descriptions
• AC9TDI8P05

• 40–50 min
• Pairs → Whole Class
• 3 activities

Activity 01

• Simulation Game
• 50 min · Pairs

Simulation Game: The Accessibility Audit

Students try to navigate a popular website using only a keyboard (no mouse) or a screen reader with their eyes closed. They record the 'pain points' and then work in pairs to propose three specific design changes to make the site more accessible.

Explain how visual hierarchy influences a user's interaction with an interface.

Facilitation Tip

During the Accessibility Audit, provide students with screen readers or color filters to simulate impairments, but circulate to ensure no one feels singled out.

What to look for

Provide students with a screenshot of a website homepage. Ask them to identify three elements that demonstrate visual hierarchy and explain why they are effective. Then, ask them to identify one area where the layout could be improved and suggest a specific change.

• Apply
• Analyze
• Evaluate
• Create
• Social Awareness
• Decision-Making

Activity 02

• Inquiry Circle
• 45 min · Small Groups

Inquiry Circle: Inclusive Innovation

Groups research a technology originally designed for people with disabilities that is now used by everyone (e.g., voice-to-text, electric toothbrushes, or curb cuts). They present their findings as a digital poster explaining the 'curb-cut effect'.

Compare different layout strategies for presenting information effectively.

Facilitation Tip

For Inclusive Innovation, assign roles (e.g., researcher, designer, tester) to keep discussions focused and prevent one student from dominating.

What to look for

Display two different website layouts for the same type of content (e.g., two online store product pages). Ask students to vote or write down which layout they find more effective for quickly finding product details and why, referencing terms like hierarchy, alignment, and whitespace.

• Analyze
• Evaluate
• Create
• Self-Management
• Self-Awareness

Activity 03

• Role Play
• 40 min · Small Groups

Role Play: The Diverse User Panel

Assign students 'user personas' with different needs (e.g., a color-blind gamer, an elderly person with shaky hands, a student with dyslexia). They 'review' a classmate's app prototype from that perspective and provide constructive feedback.

Design a simple interface screen that demonstrates clear visual hierarchy.

Facilitation Tip

In the Diverse User Panel, give students role cards with specific needs to ensure all perspectives are represented, even if they differ from the students’ own experiences.

What to look for

Students will share their wireframe designs for a simple interface screen. Partners will use a checklist to evaluate: Is there a clear focal point? Are related elements grouped using proximity? Is alignment used effectively? Partners provide one specific suggestion for improvement.

• Apply
• Analyze
• Evaluate
• Social Awareness
• Self-Awareness

A few notes on teaching this unit

Start with low-stakes simulations so students experience accessibility barriers firsthand. Avoid lectures about guidelines until after they’ve grappled with the problem themselves. Research shows that empathy-driven learning sticks, so let students struggle with a task before guiding them toward solutions. Use real-world examples, like government or education websites that fail accessibility checks, to ground the discussion in relevance.

By the end of these activities, students will confidently explain how visual hierarchy supports accessibility and apply inclusive design principles in their own prototypes. They will articulate why alignment, contrast, and grouping are not just aesthetic choices but ethical necessities in digital design.

---

Watch Out for These Misconceptions

• During the Accessibility Audit, watch for students who assume accessibility only applies to screen readers or motor impairments.

  Use the audit’s impairment simulation tools (e.g., grayscale filters, high-contrast modes) to show how visual hierarchy affects users with low vision or cognitive disabilities, emphasizing that many temporary situations (like bright sunlight) also require clear contrast.

• During Inclusive Innovation, listen for students who dismiss accessibility as extra work without practical benefits.

  Ask them to compare two wireframes: one designed with accessibility in mind and one without. Then, have them test both with the class using simulated impairments to highlight how inclusive design improves usability for everyone.

---

Methods used in this brief

• Simulation Game
• Inquiry Circle
• Role Play