Inside a Computer

Run the Inside a Computer MicroSim Fullscreen
Edit in the p5.js Editor

About This MicroSim

This MicroSim shows the five main components inside every computer: CPU, RAM, Storage, Input Devices, and Output Devices. Each component is color-coded and connected by arrows that show how data flows between them. It's a great way to build a mental map of what's happening inside the box on your desk.

How to Use

Hover over any component to see a description and a real-world analogy.
Click a component to select it — its connecting arrows turn red so you can trace the data path.
Press the Show Data Flow button to watch animated dots travel along the arrows, showing how data moves between components in real time.
Click the button again to hide the animation.

Iframe Embed Code

<iframe src="https://dmccreary.github.io/computer-science/sims/inside-a-computer/main.html"
        height="510px"
        width="100%"
        scrolling="no"></iframe>

Lesson Plan

Grade Level

9-12 (High School Computer Science)

Duration

10-15 minutes

Prerequisites

No prior computer science experience needed.

Activities

Exploration (5 min): Hover over each component and read the descriptions. Try to explain each analogy in your own words.
Guided Practice (5 min): Turn on Data Flow and trace the path data takes from an input device to the CPU, then to an output device. Discuss why RAM and Storage both have two-way arrows with the CPU.
Assessment (5 min): Without looking at the tooltips, name all five components and describe what each one does in one sentence.

Assessment

Can the student name all five components from memory?
Can the student describe the role of each component using their own words?
Can the student explain why data flows in both directions between the CPU and RAM/Storage, but only one direction for Input and Output?