Designing a calculator-Why are we stuck with the standard calculator design?
This question has haunted me for so long; why are we still stuck with the age old design of a calculator. I used to use calculator when I was 4–5 years old to look like I am smarter than anyone in the room because punching some random numbers and signs was badass according to a 5 year old (I am now 25 years old and I still feel it is badass, I feel empowered using a calculator like I am adding up my taxes or some shit!)
ANYWAY! Long story short, the design has stayed pretty much the same with numbers in the middle and operators to the right. So I did some research and found a blog on medium which ya’ll should definitely check out here.
HISTORY
I am not giving you the history of how calculator was invented. Please check here, here and here if you want to know how that happened. Also, calculator was not known as calculator when it was invented. They called it the “adding machine” which honestly makes sense.
Moving on to the design history of “adding machine”
Now from the looks of it, we know how bizzare Mr. Hopkin’s standard is because everything is one line and very to difficult to use if you are multi tasking. Some of our compact laptops still have these keys instead of the Sundstrand design and it is annoying to type numbers on it. Moving on to Dalton’s design, this design actually lead to less typing errors and less time too which is weird.
Are we on the same page? I mean if it was not for this advertisement where he mentions that you can multitask with my adding machine we would still be stuck with Dalton’s design. They showed how you can use one hand to type and the other to follow the copy which increases your speed. He thought of the UX part of it which lead to this design.
But this is not the end of it. There were so many iterations done with the design later on but somehow still stuck to the 123 456 789 0 pattern. Also keeping in mind that these were huge ass machines unlike what we have now which are portable. So you can imagine the number of keys it would have had for different operations.
What is M+ and M- on calculators?
Well, I suck at math so for the longest of my life when I used calculators, I didn’t know what was M+ and M- for because whenever I touched (by mistake, of course!) the M+ and M- button nothing would really happen and I used to wonder what was this for (never cared to check what it did because I didn’t think its important for someone who can’t remember the table of 12 to know what M+ or — would do)
Now that I had to design this calculator I had to know what the buttons meant so I had to google *sigh*
“M” here stands for “memory” so basically,
“M+” stands for add a memory
“M-” stands for delete a memory
Still wondering what is it used for?
So if you are from India then you have definitely heard of “BODMAS”. I don’t know how was it taught in other parts of the world. This basically means, Bracket Of Division, Multiplication, Addition and Subtraction. But our poor calculator works just like humans. No brackets, no correct value.
If you type in,
2x3 + 3x5, it will give you 45 as the solution which is definitely wrong.
Now because there are no brackets or commands given it will read the input as 2x3=6+3=9x5=45
And that’s wrong!
SO “M+ and -” were used in such situations. You will type in,
2x3
press M+
3x5
Press =
Press M+ too add this to the original sum.
As the machines got smarter, we didn’t need the memory buttons anymore and instead we gained a new button which is the “%” making it easier to calculate our sorry grades in school.
What did I learn from all of this?
From all the research that I had to do to know what exactly each of those buttons meant, I learnt one thing for sure and that is to keep things as easy and clear as it can get.
- The most important point here is that the calculator has to be something which can be used with one hand.
- The operators has to be color coded or at least the important ones.
- With technology in hand we can ignore few buttons since the use of it is not really crucial which gives us more button space to make it look cleaner and neater.
MY DESIGN
Getting to my designs, I have tried to keep it very minimal with just 4 colors to work on. I have kept the numbers white and operations (/-+x) orange, “C” which the clear button is red because “mental model” and “=” which is the equal to button is green because again, “mental model” Our mind has the capacity to link colors with our pre-determined notions of certain colors. For example; red implies stop, danger, no entry and green implies a positive sign.
I mainly played with the history, delete, . and 0 in all the three iterations. It was at step 3 that I decided I have to put brackets somewhere for easy calculation and it cannot be a separate button as that will eat up my button space for = which is why i neatly placed all the 4 buttons on the screen since that is where it will be used the most. I placed 0 in the center for design balance next to which I placed the button for scientific calculator and “=” to the right of it
Since we don’t have memory buttons anymore I have incorporated brackets on the screen hence not eating up anymore button space. I have also added a history section which is also editable and a delete button on the screen. I wanted to emphasize more on the “C” and “=” because we all know where the numbers, the basic use of a calculator is to finally get a solution which is given by “=” hence coloring it green and keeping the button bigger than the rest of the buttons.
The history icon changes to a calculator icon; pressing on it will bring me back to my actual input.
Which brings us to the end of the blog!
So that’s about it. I hope you get some insight when you get down to work on a similar topic. Thank you so much for getting to the end of such a long article. Hats off to all the calculator enthusiasts who have written blogs about the history of calculators which helped my design.
I never knew calculators would be so interesting to study!
Follow me on Behance if you would like to see my work :)
