9-10 Digital Technologies: Designing user interfaces and experiences Hangman

The 25 key terms

1user interface

The part of a digital system that you see and use. You give input by touching, clicking or typing, and the screen shows you output.

2user journey

The series of steps a person takes to complete a task, from start to finish. It shows how they feel at each step (their user experience, UX) and where pain points slow them down.

3text box and label

A text box lets the user type in an answer. A label is words on the screen that tell the user what to type (prompt text) or show the result (output text).

4menu, slider, checkbox

Interface elements that let the user pick from set options instead of typing: a menu lists choices, a slider picks a value on a range, a checkbox turns an option on or off.

5layout

Where items are placed on a screen. Good layout groups related items together, lines them up and leaves space between them, so the screen is easy to scan.

6consistency

Consistency means similar things look and work the same way on every screen, like buttons with the same style and a menu in the same place, so users always know what to do.

7contrast

How different the text colour is from the background colour. High contrast, like black text on white, with large enough text, makes words easy to read.

8accessibility features

Design choices like alt text, captions, keyboard-only controls, adjustable text size and not relying on colour alone, so people with different abilities can use a system.

9different users, different needs

One digital system can suit one user well and fail another, because users differ in age, ability and experience. Features like read-aloud and large text help.

10design criteria

Checkable standards, such as easy to read, easy to navigate or meets the requirements, that an interface is designed to meet and then judged against.

11Ideation technique

A structured method used to generate a wide range of possible solutions to a problem before one is selected for development

12thumbnail sketches

Small, quick drawings of different design ideas. Make several, compare them, then choose the best one to build.

13screen sketch

A simple drawing of a screen. It has an outline, then a box or shape for each button, text box or label, drawn where it will go. You draw one sketch for each screen.

14Mock-up

A static visual representation of a solution's interface, showing layout and design before development begins

15Storyboard

A sequence of visual panels showing how a user moves through and interacts with a solution, step by step

16Sitemap

A diagram showing the structure of a website or app, displaying pages and how they connect to one another

17annotation

A short note on a design that says what an element does or what happens when it is used, like a label on a button or an arrow showing which screen opens next.

18interactive prototype

A clickable model of a design where buttons link screens together, so users can try a task before any code is written. It is used for testing, not the final product.

19Proof-of-concept, Prototype, Product

Three progressive stages of solution development: proof-of-concept tests feasibility, prototype demonstrates function, and product is the final polished release

20present a design

To show your sketch, explain how each part helps the user, and ask others for feedback. Listen to what they say so you can improve your design.

21User testing

A testing technique where real users try a solution and give feedback, helping identify usability issues before release

22Expert review

A testing technique where a knowledgeable specialist examines a solution against established guidelines to find usability and design issues

23evaluate a design

To check a design against criteria, like easy to read, easy to use and meets the requirements, using a checklist, user feedback and evidence to show if each one is met.

24decision matrix

A table that scores each design idea against each criterion, then totals the scores (weighting key criteria) so the best design can be chosen using evidence.

25modify a design

Change one thing in your design, like size, position or wording, because of feedback. Then check it again. Change one thing at a time and save each version.