Algebra Explorer is a tool that lets you freely explore algebra without worrying about making mistakes. Our aim is to give students an intuition for questions like:

• In $1+2\times 3$ why does $2\times 3$ go first?
• Why is $1+2-3$ different since either $1+2$ or $2-3$ can go first?
• Why does $1-2+3$ equal $(1-2)+3$ but not $1-(2+3)$?
• Why does $1+2$ equal $2+1$ but $1-2$ does not equal $2-1$?

We do this by visualising the notation via a building blocks representation. For example, $1+2$ is: The underlying structure is known as an abstract syntax tree.

Where $1$ and $2$ are stacked on top of $\mathrm{+}$, implying that $\mathrm{+}$ depends on $1$ and $2$.

Similarly, $1+2\times 3$ is:

This alternative representation shows more clearly that $2\times 3$ must go first, using levels as an analogy for the dependency relationship between operations, similar to the game Tower of Hanoi.

But the best part of the tool is the interactivity! The rest of this article serves as a tutorial with that in mind, and along the way we hope to reveal some insights you might not have thought about before.

Enjoy Algebra Explorer!

Commutativity and Associativity

How can I move around the blocks?

Commutativity and Associativity are quite long and scary words, but in Algebra Explorer they are represented via dragging.

Commutativity Reordering

It may seem obvious that

$a+b=b+a$

but this is a special trait of $+$ and $\times$ that is crucial to algebra. Generally, functions cannot reorder their inputs. Consider the sentence

My friend enjoys maths.

where the verb “enjoys” is a function with “My friend” and “maths” as its inputs. Swapping the order gives:

Maths enjoys my friend.

which doesn’t make any sense at all!

In Algebra Explorer this can be performed by dragging blocks horizontally, just like reordering tabs in your browser:

Associativity Grouping

It may also seem obvious that

$(a+b)+c=a+(b+c)$

but this time consider the sentence

I have a friend with a cat who enjoys maths.

compared to

I have a friend (with a cat) who enjoys maths.

This time both sentences make sense (who knows what cats are doing when we’re not looking…) but they have very different meanings.

This is performed by dragging vertically up to group, and down to ungroup:

Inverses

Why can I not reorder $-$ or $÷$?

Subtraction

Let’s have a look at what $1-2$ looks like in the block representation:

You will notice that there is an entire block with only a minus symbol inside it. This is because subtraction is defined as adding with the negation, which is a function with a single input. Reordering the blocks on top of $\mathrm{+}$ here results in

Which in standard notation is $\mathrm{-2}+1$. This reveals why we cannot reorder the inputs around a minus: the full notation for $1-2$ is $1+\mathrm{(-2)}$ and you must move the entire $\mathrm{(-2)}$ to obey the rules of the previous section.

This can be confusing because standard notation removes any $+$ preceding a negation. This is similar to how “do not” is abbreviated into “don’t” in English. Explicitly keeping the minus separate also reveals why we cannot add brackets anywhere when there is a minus involved, taking $1-2+3$ as an example:

There are two ways of grouping the blocks:

Grouping the left-hand numbers results in $(1-2)+3$, however grouping the right-hand numbers is $1+\mathrm{(-2}+\mathrm{3)}$, not $1-(2+3)$. Explicitly showing the minus is useful for explaining the basic rules of algebra, even if the shorthand version is usually more useful for manipulation.

Division

Division is to multiplication what subtraction is to addition: multiplying with the reciprocal, also a function that takes one input. The beauty of the blocks representation is that the exact reordering and grouping rules apply. Let’s see what $2÷3$ looks like:

Now where things might feel a bit strange is if we reorder the blocks on top of the $\mathrm{\times }$ to get

How would we write this in standard notation? The answer is

$1÷3\times 2$

but somehow an extra 1 has appeared that is not in the blocks!

Standard notation also usually uses fractions to represent the reciprocal, resulting in $\mathrm{⅓}\times 2$, but this also still has a $1$. In fact, we could even argue that the ‘complete’ representation of $\mathrm{-2}+1$ from earlier should be $0-2+1$ if we wanted to be completely explicit about what is being subtracted from what.

These are all examples of pitfalls in standard notation that can be confusing, but hopefully seeing and playing with the blocks can help students learn to avoid them.

Brackets

Why do we need brackets?

BODMAS/BIDMAS/PEMDAS

As we have seen from the examples in the other sections, brackets help us to understand the order of operations. Anything inside brackets is always handled first. Keeping all the brackets looks like this:

$\left(\right((1\times 2)+(3\times 4))-(5÷6\left)\right)$

Almost half of that is now written with brackets! And why can we remove the brackets without changing the meaning? Let’s also look at using a lot of brackets in English:

The (grumpy) cat eats dinner (with a grin (on their (rather fluffy) face)).

The sentence is now too hard to read. Removing brackets reduces clutter, and that is where BODMAS/BIDMAS/PEMDAS comes in. It is an agreed convention for the order of operations, so that we can cut down on the number of brackets:

The example above works without any brackets because operations inside the brackets have priority over the outer ones. The brackets are redundant.

The only time we need to use brackets is if we want to perform an operation first, even if it does not have priority, for example in $\mathrm{(1}+\mathrm{2)}\times \mathrm{(3}+\mathrm{4)}$. In the blocks it looks like:

There are never any brackets in the blocks! This is because the blocks are a fully explicit representation of the underlying structure.

Standard notation can also be ambiguous, for example $f\mathrm{(}x\mathrm{)}$ usually means a function $f$ applied to a variable $x$, but it could mean a variable $f$ multiplied by $x$ since adjacent variables can indicate multiplication. In the blocks this ambiguity does not arise:

Factorisation

Factorisation is a rule where brackets are introduced. Instead of keeping the expression where multiplication goes first, we rewrite it so that addition comes first. Since multiplication has priority over addition in BIDMAS/BODMAS/PEMDAS, we insert brackets to say we want addition to happen first.

The Science of Patterns

What is algebra?

Language

On the surface, languages are simply letters on a page or sounds you make to convey information. Maths notation is exactly the same: it represent concepts, but you see numbers and symbols.

Just like there are many spoken languages to describe the world we live in, there are also other languages to describe maths. An example of this is Polish Notation, where the equation

$(1+2)\times 3$

is instead written as

$\times +123$

This works by placing the operator to the left of its inputs instead of between, which means you not need brackets since an input cannot ‘choose’ between two operators on either side of it.

However this is not commonly used because it is not as easy to see patterns, for example in

$a\times b+a\times c$

it is easy to see that $a$ is a common factor between two terms, but in Polish Notation it is

$+\times ab\times ac$

where it is harder to see because the $+$ is all the way to the left.

Matching patterns

Maths is sometimes called the “Science of Patterns”, and algebra can be seen as the process of transforming one pattern to another.

Consider these two sentences:

I have a dead cat and an alive cat.

I have two cats, one dead and one alive. If this sounds morbid to you then you likely have not heard of Schrödinger's cat!

Both have the same meaning despite being written differently. The pattern is that the word cat appears twice, so we can collapse them into two cats.

We have factorised the cats! To do the same in algebra we must now make the pattern abstract. Abstracting the cat into $a$ lets us write it as the following rule:

$ab+ac=a(b+c)$

Here are some examples that fit the pattern, and some that don’t:

In the blocks an abstraction is represented by anything stacked on top of a lower block. As long as an entire stack is the same, then the pattern will match. Here are the same examples in block format:

Equations

So far we have only seen operators and their inputs, but the goal we have been working towards is solving an actual equation.

You probably won’t be surprised to find out that the $=$ sign is also represented by a block. However it is special in that it can never stacked on top of any other block, so we placed it in between stacks to match standard notation:

But it behaves like a normal block that can be selected to apply actions to. This includes ‘Operate on both sides’ which looks like this:

The two sides can also be reordered just like addition and multiplication, which can be useful when matching patterns:

You now have everything you need to know to solve an equation! It will feel strange solving equations like this, specifically you may feel like it takes many more steps than expected to achieve ‘simple’ transformations.

We hope that this illustrates just how many steps we usually skip when solving equations, but also that freely experimenting with these steps will lead to deeper understanding.

Enjoy solving the problems below!

Extensions

What else can I do?

Topics

This project is designed to be as flexible as possible, and apart from the main operations in BODMAS/BIDMAS/PEMDAS, they are all defined by custom topic files. These specify a list of functions and constants to include, along with a collection of rules with patterns to match and transform.

Here is a gallery of rules from topics that can already be loaded:

All topic files can be found on our Github. You may notice a lot of backslashes, and that’s because we rely on that for functions as well as long variable names.

You can also make your own custom topics if you follow the same file format! These can be uploaded via the menu from a local file or url.

Rock, Paper, Scissors

Rock, Paper, Scissors is a simple example topic with 3 rules (ignoring draws)

• Rock beats Scissors

• Scissors beats Paper

• Paper beats Rock

This is a fun illustrative example because inputs can be reordered but can not be grouped. In order words, Rock, Paper, Scissors is an example of a function that is commutative but not associative.

Explore

We highly encourage you to explore the tool yourself to see what you can discover. You can use this link to open the tool in full screen.

About Us

Who are we?

We’re Derek and Jonny, two Electronics and Information Engineering graduates from Imperial College London. We share a passion in math, computing and education!

If you have any feature requests or problems with the tool, do create an issue using the link:

https://github.com/Dreksh/algebra-explorer/issues