User interface design: Controllers for all
About this lesson
This lesson idea was created by Rebecca Vivian.
Year band: 5-6
Curriculum Links AssessmentCurriculum Links
Links with Digital Technologies Curriculum Area
| Band | Content Description |
|---|---|
| 5-6 |
Design a user interface for a digital system (AC9TDI6P03). Evaluate existing and student solutions against the design criteria and user stories and their broader community impact (AC9TDI6P06). Select and use appropriate digital tools effectively to share content online, plan tasks and collaborate on projects, demonstrating agreed behaviours (AC9TDI6P08). |
Assessment
In this lesson, teachers could collect evidence of learning and progression by the form of their artefacts, including: design documents, presentation feedback, presentation recordings, photos of the final product and development stages.
| Quantity of knowledge | Quality of understanding | ||||
|---|---|---|---|---|---|
| Criteria | Pre-structural | Uni-structural | Multi-structural | Relational | Extended abstract |
| User-interface design | Standard controller - no consideration of the user. | A simple controller that explains general design consideratio ns, but not necessarily unique to their user. | A controller with consideration made toward the user, as explained through a feature. | A controller that has considered the user through two or more design features supported by justification. | A controller that has addressed multiple user needs, with multiple features, and has a high level of complexity and justification for design features. |
| Design | No design used. | Basic design with no features identified. | Basic design with some features identified, but not linked to design justification. | Detailed design with numerous features identified and linked to design justifications. | Detailed design that brings in prior learning and/or independent learning beyond the task and possibly includes requirements, specifications, constraint factors. |
| Language | When describing their interface, no specific vocabulary is used. | The terms ‘controller’’ may be used as a general description. | The terms user-interface /interface is used as a general description. | The terms user-interface is used confidently with specific reference to learner’s work. | Specific vocabulary like ‘requirements’, ‘specifications’ and ‘constraints’ is used, going beyond the set language. |
Overview
Description
In this lesson, students design and implement a new user-interface that allows a user to interact with a digital program.
Resources
- Computer/laptop
- Scratch by MIT
- Makey Makey
- Access to conductive materials (alfoil, playdough, etc).
- Access to craft materials (cardboard, glue, paper, paints, etc).
- Stationery: scissors, pencils, paper, etc.
- Example(s) of good and bad user-interface or game controller designs
Prior Student Learning
In this activity, students design a user interface for an existing Scratch project that either the teacher or student has found in the Scratch community, or for a more extensive project, students can design and implement their own Scratch program for a particular user, and include the design of the user interface as part of the design and development process.
If this lesson is for a program that the student has created, it is assumed that they have prior learning in designing and implementing algorithms and having had some exposure and experience with visual programming.
Learning hook
- The teacher begins the lesson by showing students some “bad” user-interface designs. Some of these could be humorous to spark interest. They could be local school or community examples.
- The teacher invites students to point out what they notice about the designs and discuss ways that they could design it better.
The teacher stresses the importance of considering the user when designing solutions. Computer Science is about people, as we are designing for users!
Learning map and outcomes
- Students consider accessible designs for a user to interact with a Scratch program they have made (or that has been selected to remix).
- Using Makey Makey, they design and create their controller for their game.
- Students come up with principles and justifications for their own designs.
- Students share these designs online with peers for constructive feedback, that informs the final version of their interface. Students test and evaluate one another’s designs.
Learning input
The teacher displays a range of photos of user-interface designs - both physical interfaces (vending machine, coffee machine, bus ticket machine, car dashboard, game controller) and digital interfaces (tablet device/smartphone screen captures). The class reflect on the question:
- What makes a good design interface?
- What are the main differences between a digital interface (software) and physical (hardware)?
The teacher selects one example and invites the class to think about how they might redesign the interfaces for someone with a particular disability, such as vision impairment.
- Does the design cater for this user? What would be the challenges for the user?
- How might they improve the design?
Learning construction
The class are now asked to consider how they might design an accessible controller (using Makey Makey) for a person with a disability for a Scratch program that they have made, or a Scratch program that the teacher has selected.
Students select and research a type of disability and design considerations that improve accessibility for this user.
Students consider how they might design the physical controller for a user to make it more accessible for all users.
Students are required to first design their interface with pen and paper and upload their photo to a shared drive/classroom community for peer feedback.
Using this feedback, students design their final interface and begin using available craft materials to construct it, in combination with the Makey Makey. If a 3D printer is available, students could use this technology with their designs. However, craft materials are also suitable.
This section could possible be divided over 2-3 lessons.
Learning demo
- Students showcase their designs, in combination with the program that they have created. Students have 5 minutes to explain and “pitch” their designs to their peers.
- Students need to explain: who they have designed the controller for; the features of the controller and justifications for the design decisions they have made.
- After this, students test one another’s designs.
Learning reflection
Students reflect on their initial designs and the feedback they received, and reflect on how they used this feedback to inform their final design. They reflect on the progress that they have made in comparison to their first design, and how their learning experience has informed their understanding of designing for diverse users.
Resources
- Download entire lesson plan: PDF version.
- Download entire lesson plan: Microsoft Word version.
- Makey Makey projects and information
- CS Unplugged Interface Design
- Designing for users with disabilities
- This lesson plan corresponds to professional learning in the following CSER Digital Technologies MOOCs: F-6 Digital Technologies: Foundations
- Unit 4: Digital Systems