Archive for September, 2009

Seek And You Shall Find: follow up on “Calculator Program UI Design”

September 30th, 2009

A week ago I posted a rant about the lack of innovation in UI design of calculator programs. Turns out my buddy Nik had thought of the same thing a while ago which led him to created Soulver:

[I] was just reading [your blog] and noticed that the latest entry was about calculators, and how much the UI on computers suck. Me and a friend had the same realisation back in high school, and ended up writing a program called Soulver.

In the original version we used to have a way to map any key on the keyboard to be any operator/number just like you describe. We’re planning on bringing this back one day.

Well Nik, I hope you do bring back custom keyboard mappings. Typing maths just feels too awkward on a laptop keyboard without a proper number pad. In fact, if you find a good set of key mappings, consider making it the default (or at least a one click preset). Chances are, most people aren’t going to spend the time customizing key bindings, because it can be very fiddly and time consuming. Then again, learning a new set of key bindings can take some time as well, especially when there doesn’t seem to be a natural way to design a UI for a calculator that just ‘feels right’. At least not in the same way that zooming in and out on a touch screen UI feels on a mac.

From a quick read of the description, Soulver does a far more than the average calculator app.

Clever English functions – Soulver includes some “English” math functions. For instance you can type “10% off $200″ and get $180

Reminds me of google calculator and wolfram alpha. Some of my favorite Google calculator searches:

Once in a blue moon = 1.16699016 × 10-8 hertz

Number of horns on a unicorn = 1

The answer to life the universe and everything = 42

Calculator Program UI Design

September 22nd, 2009

Every calculator port to a desktop computer I’ve seen uses the same UI that a hand-held calculator would use. The hand-held calculator was designed to be used in your hand or on the desk. It has big buttons so you won’t miss them. The operators are on the right or left side so you can easily reach them with your thumb. This is far from how a calculator app should be used on a computer. There haven’t been much innovation in calculator UI design since Kilby, Jerry D. Merryman and James H. Van Tassel, invented the first hand-held calculator at Texas Instruments in 1967.

First hand-held calculator invented at texas instruments

First hand-held calculator invented at texas instruments

TI 89 "Titanium edition" graphing calculator from Texas Instruments

TI 89 "Titanium edition" graphing calculator from Texas Instruments

Sure there are more buttons now, and you can draw graphs, but the main set of number keys haven’t changed very much, the buttons are just thrown at the top almost without any consideration. For a physical calculator, we can argue that there’s not much we can do if we wanted all the functionality that a modern graphics calculator has. But a calculator on the keyboard has more potential. A modern keyboard already has over 100 keys. Yet the UI on a computer mimicks that of the physical calculator.

Windows 7 calculator

Windows 7 calculator

The calculator UI works well with the number pad if it only features the four basic arithmetic operations (+, -, x, /), but it doesn’t work if you’re using a scientific calculator with more buttons than you have keys on a number pad. It also doesn’t work on a laptop where most people hardly ever turn number pad on to use the number pad because those keys are shared with the normal keyboard layout. There are no obvious keyboard shortcut keys to any of the advanced operators.

It’s time we redesigned the calculator UI to work more efficiently on a computer. The number keys should be split between the middle of the keyboard where both hands can be used to maximize finger utilization. Commonly used operators should be near index and middle fingers. I propose T, Y, G, H for +, -, *, / and ASDFJKL:RU keys be the number keys. That should be a good start. It might take some experimenting before we add the advanced keys. Regardless, since there haven’t been any UI innovation in calculators, it wouldn’t take much effort to come up with a better arrangement of keys for the keyboard.

The 2 Cake Cutting Problem

September 17th, 2009

Here’s a fun little brain teaser. There are two cakes of the same size, a chocolate cake and a strawberry cake. Ted and Kim are planning to share each of the cakes, but being the perfectly rational greedy agents they are in an imaginary universe contrived in the twisted mind of a puzzle maker, they both want to divide the cakes in a creative way, and they each want as much cake for themselves as possible, no compromises.

choccake

Ted proposes a plan. He says,

“I’m going to cut the first cake into two pieces, and after you see the cut, you get to decide which one of us gets the larger slice. Then I’ll cut the second cake, the person who got the smaller slice of the first cake gets to have the larger slice of the second cake”

Is this a good deal for Kim? If so, what should she do to maximize the amount of cake she gets? If not, what can Ted do to maximize the amount of cake he gets?

NOTE: Yes, this is what I can remember of an exam problem, if you did this subject with me and know the answer, please let some other people have a go before answering.

I’ll post the answer in a few days :)

UPDATE: The solution is in the comments!

Levitation

September 10th, 2009

There has been news of scientists levitating mice to study the effects of bone loss…never mind why they were doing it; how cool is that? A levitating mice!

The news article only says that magnetic fields were used to levitate the mice, but it doesn’t go into any details. Last time I studied biology and physics, living things aren’t very magnetic, so I had to find out if this is a hoax. Turns out it is possible, but it requires a very powerful magnet.

From wikipedia

A substance that is diamagnetic repels a magnetic field. All materials have diamagnetic properties, but the effect is very weak, and is usually overcome by the object’s paramagnetic or ferromagnetic properties, which act in the opposite manner. Any material in which the diamagnetic component is strongest will be repelled by a magnet, though this force is not usually very large.
Diamagnetic levitation can be used to levitate very light pieces of pyrolytic graphite or bismuth above a moderately strong permanent magnet. As water is predominantly diamagnetic, this technique has been used to levitate water droplets and even live animals, such as a grasshopper and a frog. However, the magnetic fields required for this are very high, typically in the range of 16 teslas, and therefore create significant problems if ferromagnetic materials are nearby.

The alleged first living animal to be levitated by this technique was a frog Here’s a short video of one:

I wonder we’ll see this done to humans. The frog is levitated using 10 Tesla magnetic fields, so it would take a much stronger magnet to lift a human being–much stronger than the current strongest man made magnet which is only 45 Tesla.

Aside: Yogis in India claims have been able to levitate as a result of spiritual powers, but they weren’t being completely honest.

Papercube: scientific paper, citations, and references visualization

September 6th, 2009

Scientific papers are incredibly difficult to read if you’re not someone who’s already an expert in the field. It’s even worse when that paper leaves out a lot of details and background information by citing other papers.

A collegue and I where looking for papers on computer vision when we ran into this problem. So we asked,

Wouldn’t it be cool to have a visualization of all scientific papers and automatically linked the references and citations to other papers?

It looks like Peter Bergstorm asked the same question, so he started his masters thesis with the aim to solve that problem by inventing papercube.

Looks like it currently only searches papers up to the year 2004, but it’s looking very snappy so far.

Websites Stuck In The 90s

September 6th, 2009

Websites in the 90s have a lot of clutter. Yahoo is the typical example. A page full of links to every topic imaginable, poorly arranged in seemingly arbitrary order. It’s a good thing they were a search engine too, but you might forget that sometimes.

yahoo

yahoo

In the 90s websites were new to people, like a new puppy everyone wanted their own. The problem was that the web wasn’t ready for all this attention. People rushed to get a website for every topic you can imagine which led to internet proverbs like “if you can think of it, chances are you’ll find it on the internet!”

The result was clutter. People were creating too much junk and it became too hard to find something you need. Search engines were invented to reduce clutter and help us find what we want.

Search is by no means a solved problem, but it was remarkably successful at filtering out clutter. The problem with search engines is that they can’t read your mind (yet), they don’t know who you are or what you like. So to use a search engine, you have to already know what you want, and you must be able to summarize it in a few key words. People soon ran out of interesting things to search for, which led to content aggregation websites to spawn up everywhere collecting interesting links from all over the web. This eventually led to the rise of social media and user filtered content websites like digg and twitter which is the next step in solving the pin-of-useful-content-in-a-haystack-of-clutter problem. Although it seems to be creating a lot more clutter problems of it’s own. Everything we invent to solve the clutter problem on the internet seems to create more and different kinds of clutter. Twitter I would argue is the biggest collection of useless clutter on the internet. I’ll save that rant for another post.

There is another problem that search engines doesn’t solve. Yahoo and many news websites dealt with clutter by creating more clutter. They put every topic imaginable on their home page, and by trying to cater to everyone’s needs, they ended up catering for no one. Yahoo is still like that today, so was msn search until Bing came along a few month ago. These websites are stuck in the 90s. Search engines and social media doesn’t solve this problem because the problem is isolated on individual webpages, not entire websites.

Luckily, you can safely ignore news websites with too much clutter. It’s the crappy websites that sell good products that are annoying (not crappy websites that sell crappy products, because you can safely ignore them too), because you’re forced to use them. A general way to know if a website has too much clutter is with what I call the “control-F” index. F for find, but also F for frustrating. The more times you have to use ctr+F on a website just to find the link you’re looking for, the more frustrating it is to use.

Pop-up menus are off the charts in the ctr-f index because you have to mouse over them to find what you need, so are complicated company websites built in flash. It’s impossible to find any information on them.

The original website that inspired this rant is this website. Allegedly, they make a pretty good product (the best one out there for anyone developing GWT applications in eclipse), but you wouldn’t know it by looking at their website. They have both a good product and a crappy website. This is inconsistent.

gwtWeb2.0 websites are simple and elegant. When you’ve filtered out and ignored the ones that sell crappy products, what you’re left with are websites with good products and good web design. That’s consistent. Consistency makes a huge difference in the user experience, and user experience matters–just ask Apple. People often confuse good user experience (something they like) with benevolence (something else they like), so it came as a surprise when Apple rejected the Google voice app for the iPhone which was going to make phone calls much cheaper for the user.

To companies with good products and crappy products out there: If you provide users with something they like, users will automatically assume that you’re benevolent and likeable as well! If you’re selling a good product, you should use this to your advantage. Upgrade your website and make it consistent with the quality of the product you’re selling. It’ll be a better experience for users which will turn into better marketing for you.