lesson 05 - graphical user interfaces (gui wimp)
A Graphical User Interface (GUI) enables users to interact with computers through visual elements like windows, icons, menus, and pointers, making technology more intuitive and accessible.
Point, Click, and Create: The World of Graphical User Interfaces (GUIs)
(Image: A dynamic, high-quality screenshot of a modern, well-designed operating system like macOS or Windows 11, showing multiple applications running in different windows.)
So far, we've explored interfaces that require you to type commands, navigate rigid menus or use natural language. But the type of interface you almost certainly use every single day is the Graphical User Interface, or GUI. It revolutionised computing and is the reason we can all use powerful devices without needing to be programming experts.
What is a GUI?
A GUI allows users to interact with a computer using visual elements instead of just text. If you can see pictures, buttons, and windows on your screen and use a mouse or your finger to interact with them, you're using a GUI!
The vast majority of modern GUIs are based on a principle known as WIMP.
(Video: Embed a short, engaging video from a channel like Computerphile or The Verge explaining the history of the GUI, from Xerox PARC to Apple and Microsoft.)
Breaking Down WIMP
WIMP is an acronym that stands for the four core elements that make a graphical interface work.
W is for Windows
(Image: A screenshot showing a desktop with several windows open and overlapping, for example, a web browser, a file explorer, and a music player.)
A window is a rectangular area on the screen that displays an application, a document, or a message. The key feature of windows is that you can have several open at once, allowing you to multitask. You can be writing an essay in one window, have a web page open for research in another, and see your files in a third. You can move, resize, minimise, and close them as you wish.
(Image: A screenshot showing a desktop with several windows open and overlapping, for example, a web browser, a file explorer, and a music player.)
A window is a rectangular area on the screen that displays an application, a document, or a message. The key feature of windows is that you can have several open at once, allowing you to multitask. You can be writing an essay in one window, have a web page open for research in another, and see your files in a third. You can move, resize, minimise, and close them as you wish.
I is for Icons
(Image: A close-up of a diverse set of modern, clear icons for different file types and applications.)
An icon is a small, simple picture that represents an object or an action. A picture of a bin for deleting files, a folder for storing files, or a company's logo for launching an app. Icons are intuitive; they are like a universal visual language that makes an interface easier to learn and faster to use.
(Image: A close-up of a diverse set of modern, clear icons for different file types and applications.)
An icon is a small, simple picture that represents an object or an action. A picture of a bin for deleting files, a folder for storing files, or a company's logo for launching an app. Icons are intuitive; they are like a universal visual language that makes an interface easier to learn and faster to use.
M is for Menus
(Image: A screenshot of an application like Photoshop or Word with one of the main dropdown menus (e.g., 'File' or 'Edit') open, showing the list of commands.)
A menu is a list of choices presented to the user. This could be the menu bar at the top of an application (File, Edit, View), or a 'context menu' that pops up when you right-click on something. Menus organise all of a program's commands neatly, so you don't have to memorise them.
(Image: A screenshot of an application like Photoshop or Word with one of the main dropdown menus (e.g., 'File' or 'Edit') open, showing the list of commands.)
A menu is a list of choices presented to the user. This could be the menu bar at the top of an application (File, Edit, View), or a 'context menu' that pops up when you right-click on something. Menus organise all of a program's commands neatly, so you don't have to memorise them.
P is for Pointer
(Image: An animation showing a mouse pointer moving across the screen. It changes shape as it hovers over different elements: an arrow on the desktop, a hand over a link, and a text cursor over a document.)
The pointer is the on-screen symbol that shows you where the action is happening. You control it with a mouse, trackpad, or other input device. It's your 'digital finger', used to point at, click on, select, and drag the other elements of the interface, like windows, icons, and menu options.
(Image: An animation showing a mouse pointer moving across the screen. It changes shape as it hovers over different elements: an arrow on the desktop, a hand over a link, and a text cursor over a document.)
The pointer is the on-screen symbol that shows you where the action is happening. You control it with a mouse, trackpad, or other input device. It's your 'digital finger', used to point at, click on, select, and drag the other elements of the interface, like windows, icons, and menu options.
The combination of these four elements created the intuitive, user-friendly computing experience that we all know and rely on today, and they will be the foundation of our design for The Majestic Cinema project.
Last modified: July 8th, 2025
