lesson 1.1 - text-based, menu and form interfaces
Text, menu, and form-based interfaces are fundamental ways of interacting with technology, ranging from the command-line for experts to user-friendly menus and data-collecting forms that are essential for web services.
Hey everyone! Ever played an old-school computer game where you had to type everything like "GO NORTH" or "GET LAMP"? Or used a cash machine, booked tickets online, or even just changed settings on your phone? These are all ways we 'talk' to computers, using something called a User Interface (UI). Today, we'll look at two of the originals: the text-only way and the world of menus and forms! Let's dive in!
Learning Outcomes
The Building Blocks (Factual Knowledge)
The Connections and Theories (Conceptual Knowledge)
The Skills and Methods (Procedural Knowledge)
Recall the names of different types of user interface.
Describe the key features of a text-based interface (command line).
Describe the key features of menu-driven and form-based interfaces.
Identify examples of devices or software that use text-based interfaces.
Identify examples of devices or software that use menu/form interface
The Connections and Theories (Conceptual Knowledge)
Explain how users interact with a text-based interface.
Explain how users interact with menu/form interfaces.
Compare the advantages and disadvantages of text-based versus menu/form interfaces.
Analyse why a specific type of interface might be chosen for a particular device or task.
The Skills and Methods (Procedural Knowledge)
Identify text-based and menu/form interfaces in different contexts.
Evaluate the suitability of text-based or menu/form interfaces for given user needs and devices.
Digital Skill Focus: C.1.1 Core Skills: Use a keyboard to interact with a simulated text-based interface; Use a mouse/trackpad to navigate menus and complete forms and C.2.2 Evaluating Information Critically: Analyse the purpose and suitability of different interfaces presented in examples.
1
Back to basics: The Text-Based Interface
This is the original way of interacting with a computer, using nothing but your keyboard and your brain! The most common type is the Command Line InterfaceI have no idea what this means (CLI), which you might have seen in films when a hacker is at work.
A text interface
🎯 Features
It's text-only – no pictures, no icons, no mouse pointer.
The computer displays a prompt (like > or $), which is its way of saying, "I'm ready for your command."
The user must type precise, exact commands for it to work.
It provides a text-based output in response to the user's input.
⛏️ Uses
Programmers use it to run code and manage software projects.
IT technicians use it to configure network devices like routers and servers.
It's used for advanced tasks inside modern operating systems like Windows and macOS.
👍 Pros
Powerful & Fast: For an expert, it's much quicker to type one command than to click through ten different windows.
Low Resources: It doesn't need a powerful computer to run, so it's great for simple or old devices.
Automation: You can write scripts to perform complex, repetitive tasks automatically.
👍 Cons
Steep Learning Curve: You have to memorise the commands, which is difficult for beginners.
Unforgiving: One small spelling mistake in a command and it will fail.
Not Visual: It's hard to get a sense of what you're doing without any visual feedback.
Come on...
Task 1 Terminal Tutor and other adventures
1
Terminal Tutor
Visit the 'Terminal Tutor' website and spend no more than 20 minutes on Chapter 1.
2
Write all about it
Write about what you've learnt in the space on your lesson sheet.
Outcome: I've used a simple text-based interface
2
Making choices: The Menu-Driven Interface
A menu-driven interface guides you by presenting a list of options. Instead of memorising commands, you simply select a choice, often by typing a number or letter. Think of an automated telephone service ("Press 1 for Sales..."), which walks you through a process step-by-step.
A menu-driven interface
🎯 Features
Displays or states a list of options, often numbered or lettered.
The user makes a selection by typing a number/letter or using arrow keys.
It guides the user through a process in a step-by-step way.
There is a limited number of choices available at each stage.
⛏️ Uses
Cash machines (ATMs).
Automated telephone booking systems ("Press 1 for sales...").
Self-service ticket machines at a train station or cinema.
Settings menus on older mobile phones.
👍 Pros
Easy for Beginners: You don't need any prior knowledge; the options are right in front of you.
Reduces Errors: It's impossible for the user to enter an invalid command.
Simple to Navigate: It requires very little learning.
👍 Cons
Inefficient: Can be very slow for experts who have to go through many menus to find the option they want.
Can be frustrating to use: If the option you need is buried deep in the menu system, it can be frustrating to find.
Inflexible: You can only do what the menu allows you to do.
Don't get confused...
3
Filling in the Blanks: The Form-Based Interface
A form-based interface collects structured information using labels and input fields, similar to a digital paper form. It's essential for online tasks like shopping or signing up for accounts, ensuring data is inputted accurately before the computer provides an output, such as a confirmation message.
A form-based interface
🎯 Features
Uses a combination of labels (to tell you what's needed) and input fields.
Includes various components:
Text Boxes: For short text entries like names or emails.
Text Areas: For longer messages.
Checkboxes: For selecting multiple options (e.g., "Select your interests").
Radio Buttons: For choosing just one option from a list (e.g., "Yes" or "No").
Dropdown Menus: A neat list of options that appears when you click it.
Buttons: To submit the form or cancel the action.
⛏️ Uses
Signing up for a new online account.
Booking flights, concert tickets, or a hotel room.
Online shopping checkouts.
Completing online surveys or questionnaires.
👍 Pros
Very Intuitive: Everyone knows how to fill in a form.
Prevents Errors: The form can be designed to only accept certain types of data (e.g., an email address must have an '@' symbol).
Efficient Data Collection: It's a great way to get lots of structured information from a user quickly.
👍 Cons
Can be Tedious: Very long forms can be boring and time-consuming to fill out.
Frustrating if Poorly Designed: A confusing layout or unclear error messages can make the user give up.
Security Risks: Information submitted through a form can be intercepted if the website is not secure.
Are they?
Task 2 Designing a Booking Experience
In this two-part challenge, you'll solve the same problem—booking a ticket—using two very different interfaces. First, you'll team up to design an 'old-school' menu-driven system for booking over the phone. Then, you'll design a modern, easy-to-use form-based page for the cinema's website.
1
Part 1: The Phone Line
Before fancy websites, people booked tickets over the phone! Your first task is to design an automated telephone booking system for The Majestic Cinema. This system will use a menu-driven interface where the customer presses numbers on their phone to make choices.
1
On your mini-whiteboard or paper, map out the entire booking process.
2
Start with a welcome message.
3
Give the user a menu of films to choose from (use the films from the project brief!).
4
Ask them for the date, time, and how many adult and child tickets they want.
5
End with a confirmation of their booking details.
For each step, write out the prompt the system gives (e.g., "Please press 1 for...") and the numbered options the user has.
2
Part 2: The Web Form
Now, let's design the modern version! Your second task is to create a design for the online ticket booking form for The Majestic Cinema's website.
1
Open a suitable drawing program (like Diagrams.net).
2
Using the project brief, add all the required fields to your form design. You will need:
Full Name
Email
Film Title
Date
Time
Number of Adults
Number of Children
For each field, choose the best type of form component. You must use at least three different types from this list:
Text Box
Dropdown Menu
Radio Buttons
Checkboxes
A 'Submit' Button
Arrange your form components on the page in a clear and logical order.
Outcome: I will have created a flowchart for a menu-driven telephone booking system and designed a digital wireframe for a form-based online booking page that uses a range of appropriate input components.
Application to the component sample PSA
The Majestic Cinema website project requires creating a user-friendly digital information point with four screens: Home, What's On, Facilities & Accessibility, and Ticket Booking.
Menu Interfaces (C1.A1.1.5) will be crucial for website navigation. Users will need clear menus (perhaps a menu bar or side menu) to move between the four main screens (Home, What's On etc.). Dropdown menus might be used within these sections, for example, to select film genres on the 'What's On' page. The design must be intuitive for a diverse audience, including families and teenagers.
Form Interfaces (C1.A1.1.5) are essential for the Ticket Booking screen. This screen will need form elements like text boxes (for name, email), dropdown lists (for film title, date, time), and number inputs (for adult/child tickets). Clear labels, potentially input validation, and an obvious 'Submit' button are needed to make the booking process simple and efficient. Accessibility features for forms must also be considered for users with specific needs.
Text-Based Interfaces (C1.A1.1.1) are less likely to be the primary interface for the customer-facing website, as ease of use is key for the general public. However, simple text input fields (a type of form element) will be used, for example, if a search function is included. A purely text-based interface might potentially be used for back-end administration by cinema staff, but that's outside the scope of the customer-facing prototype.
Out of Lesson Learning
⭐ The Majestic Cinema Ticket Booking form needs several pieces of information. List three specific data fields (like 'Full Name') that would be needed and suggest the best form element type (e.g., text box, dropdown list) for each one.
⭐⭐ Sketch a simple menu navigation structure for the Majestic Cinema website. Show the main menu items (Home, What's On, etc.) and suggest at least one sub-menu item that might appear under 'What's On' or 'Facilities & Accessibility'.
⭐⭐⭐ Although the customer website will use menus and forms, describe a situation where cinema staff might benefit from using a text-based (command line) interface for a specific task related to managing the cinema (e.g., updating film screening times quickly, generating a sales report). Explain two reasons why a CLI might be more suitable than a GUI for that specific staff task.
Last modified: October 20th, 2025
