Critical thinking on Progress Indicating Traffic Lights and a challenge to you

A few days ago The Red Dot Design Award Winners were announced. This is always such a great competition because the participants are so varied and different. The sky is the limit, its wonderful! This year there were 12,000 entries from 60 countries. Of the winners, one entry has gained some traction. The particular entry was progress indicating traffic lights.

Progress Indicator Lights

I like this design! Anyone who knows me, knows that “Wait UI” (ex.- Press and Hold) is the bane of my existence [constant source of irritation]. Making the user wait for any period of time is a bad experience. We should challenge designers to come up with things that are not Wait UI. On the other hand, there are examples like this, where waiting ISthe UI. The users have to wait, now its time to make it more intuitive. Let’s break this down into the psychology of the problem and the Mechanical part of the problem.

Occupied time feels shorter than unoccupied time or Queuing Psychology 101 (the UX)

“…a day full of waiting, of unsatisfied desire for change, will seem a small eternity.” —William James, 1891

MIT’s Engineering Systems Division has an ace in the hole, so to speak, when talking about Queuing Psychology. Dr. Larson or affectionately referred to as “Dr. Queue” has been studying the effects of queuing for more than twenty years. The team over at ESD came up with a few things that were very interesting and solved a few pain points for Disney and theme parks in general. If you have ever been to Disney and went on any of the rides, the lines are insane. The lines can be anywhere between 15 minutes to 2 hours per ride. The challenge was to find a way to make this necessary evil more fun. They had a few great ideas that involved a wonderful use for a “touch wall” and other short interactive games.

Short interactive games while waiting in line at Disney

Progress indicating lights have existed for 100 years (history)

When researching a design, we have to lean on what Bill Buxton always talks about in “new” designs. There rarely are any! They are just recirculations of old designs that we re-purpose for our current needs. This design is no exception. Marshalite Traffic Signals have been around in Australia since 1936 and still exist in a few places.

Marshalite - an analog version!

These lights already exist in the world, so what research can we gather? (current UX research)

So let’s look around and try to find some pain points for the current design. The progress indicator lights already exist in a few countries and obviously people are going to have some thoughts on them. In my very informal search and reading to look at what people think about them now, I found a few quotes.

They already have traffic lights and padestrian crossings in Manila with timers on them. As far as I can tell they don’t really help there.

… Delhi/Mumbai. … the last 5 seconds before the light turns green resemble the start of a NASCAR race. -both via Neatorama

So the reference here is that they also resemble Racing Trees and therefore will push the user to anticipate the light and may cause accidents. This is a problem that we should be aware of.

Racing Tree Lights

The first thing that comes to mind after seeing what we have seen so far, is that one solution will not solve all the problems. We are going to need a way for it to be configured at installation. We need to let the city engineers do the final stage of the design so they can customize it to fit their needs.

Why do we need to do this? (the greater design tenet with UX in mind)

The problem is that gasoline is getting more expensive and more scarce. If we continue how we are now, we will destroy the environment around us. We need to think green. You should always think low impact in your design solutions because it means they are less expensive in the long run. The more the design saves the company, the more apt they are at instituting it. So let’s look around at some of the current research on Hybrids and gasoline.

Question: Is it better to turn your car off for a 30 second stop or to leave it running?

Answer: Turn it off and it saves gas and its more wear and tear on your vehicle (starter, crank shaft, etc). Leave it on burns more gas and its easier on your vehicle.  –(1995) paraphrased from The Car Guys.

How does that compare to what the average is?

How long does the average American spend waiting at a red light?

Answer: 3min. and 18sec. via - WikiAnswers

There seems to be a gap. What about current technology with Hybrids?

Comparison of what Hybrids do

So it seems that all manners of Hybrids shut their engines off at stop lights.

Given all that we have learned, what changes would we make? (UX Design)

It seems that really, the only glaring thing we need to take into account is the final 10 seconds. When users would start to rev their engines and get ready for the green light. This revving would then eliminate any of the benefits of the engines being shut off in the first place. The other piece we need to keep in mind is have it configurable at time of installation. This would be very helpful for tuning and further refinement as the time of install progresses.

Here is the current design that won the competition.

Design Winner

and here is a blank slate for you to test out your designs.

Blank Traffic Light

You can download this Illustrator CS4 file here. If you happen to be using another type of program, I also uploaded the EPS file, and you can get it here. I created the outer circle in Live Paint, so all you need to do is grab the paint bucket tool and drop whatever color you want in there.

Let’s see your designs! Send me your concoctions and I’ll post them here. Also write a bit about your rationale and reasoning for designing it your way.

The fake Apple gestural movies, a critique by request

I’m subscribed to just about every RSS that contains the words NUI or Multi-Touch in the title. One of the better one’s is http://theclevermonkey.blogspot.com. He made a post the other day about how impressed he was with a set of videos on youtube of a mockup from an anonymous person based on what they thought Apple’s new tablet will consist of interaction-wise. It was titled “Move Over Jonathan Ive, Hear comes Jon Doe”. That grabbed my attention.

Jonathan Ives is one of the best designers working today. I think he has great talent and he got some wonderful opportunities that really allowed him to flourish. He is great, but the only reason he is great is because he has made several errors. Big errors, as we all do in our careers. Bill Buxton was talking to me about this very thing a few days ago. Great artists make errors, learn from them, and move on. Jonathan has made his share of errors, as well as his share of wins. So, no question about Jonathan’s skills, but who is this John Doe?

I made an offhand comment on theclevermonkey about how unimpressed with the gesture language that was demonstrated in the videos. He replied that I should write a constructive and helpful post to point out a few things. So here we are.

The first video in the series:

So, I will breeze over a few of the main concepts that I feel the person missed in their mockup. I only watched 2 of the videos, and will only comment on one, but here is what I gathered from it.

• In watching the gestures I see confusion between single tap and double tap. At around 4 seconds he does a single tap to change its state after he used single tap to get it into the state? Then does another double tap to zoom out? I’m not quite sure I understand the metaphor around each of the taps. If single tap is select, then how can it also be activate and unzoom/state change.  It seems here that the user is going through a pre-determined path of usability rather than real motions.
• At around 10 seconds after the OnScreenKeyboard use, he does a single tap all the way across the screen on a very small hit target. This seems problematic and does not obey Fitt’s Law.

Fitts’s law (often cited as Fitts’ law) is a model of human movement in human-computer interaction and ergonomics which predicts that the time required to rapidly move to a target area is a function of the distance to and the size of the target. Fitts’s law is used to model the act of pointing, either by physically touching an object with a hand or finger, or virtually, by pointing to an object on a computer display using a pointing device). It was proposed by Paul Fitts in 1954.

• The closing of the keyboard should be thought about in a broader term. Why have the button so small? Why have the button on the other side of the screen? Why not put buttons on both sides to accommodate ambidextrous bi-manual input. Why not change its color slightly to ease speed of use? A very thin row of black buttons is not conducive to a natural interface.
• at 17 seconds he uses double tap twice. Once to do an “execute” on the video clip, and then again on the File Explorer window to perform a maximize/full screen. Unless in this operation if you “execute” the File Explorer that also goes into a Slideshow mode? I’m hazy on this.
• at 20 seconds he does a double tap on an image in the slideshow and that propels him into a scatterview experience? Maybe that is a Mac thing that I am unaware of, but if he just performed an “execute” on the icon, why does it go into scatterview?
• at 22 seconds he uses two-fingers to draw a marquee around items which also produces a context menu. If you had a context menu pop up everytime you selected a group it would not be a good experience. Menus need to be deliberately activated, not activated as a secondary action. There would be emails sent. :)
• at 27 seconds he uses two-fingers to then move the carousel around? Why has movement now shifted chords? Two-fingers were just used to draw a marquee and do a group select, and now they are used for movement? This is a confused metaphor and not consistent.

Thats pretty much everything in the first video besides the simple movements with single touch. To really be critical I would also say that using single touch for movement on a background is a little easy don’t you think? Certain things need to be forgivable, the background being one of them.

My main critique over the set is that multi-touch means just that, Multi-Touch. That means more than just two fingers side by side, or even three fingers next to each other. It means thinking about systems in a whole new way. What about offhand manipulation? What about modifiers? Think about occlusion and ease of use. If you are playing a game do you really want to have 3 fingers on the screen to run? then keep them on the screen the whole time? As the author noted in the last movie he had doubts.

To be more helpful and instructive I’ll throw out a few ideas. Why not use the offhand as movement and the primary hand as action? So, with your left hand you place down a finger and hold it outside of the quick menu area, this establishes the center of movement, now with any other touch in a direction near your initial touch you are running. This leaves your other hand free to perform actions that might be needed. Now with another tap with your left hand your running is now ‘frozen’ forward so you can remove your hand. Your character is now running in a direction that you chose without much primary attention. Want to change directions? Use two-fingers and slide. Want to stop running? Two-fingers and slide down. Side-step? You get the idea. Using the initial two taps to set motion then two fingers at the same time to give more detailed instructions eases the attention you would need to give it. Think how fast you could do that?

That ends the lesson for tonight. Overall, great video. I was very impressed with the videos themselves actually. High quality for a mock-up. Now hopefully you understand my thoughts when I see a lot of passion in this effort, but not quite enough expertise. The thing is …. expertise can be learned. Passion cannot. I hope he continues down this path, we could always use more passionate designers out here.

InkSiene: New inking software from Microsoft Research, free install

InkSeine, Rethink your Ink!

If you don’t know what Microsoft Research does, go take a quick peek at their website. Microsoft Research is think tank at MSFT that explores, develops, designs, and tries to implement new technologies and thoughts. They are not harbored by having to make money. Its really just like a wonderful adult playground where your imagination is the only think stopping you.

They do some amazing work over there and some very interesting projects. They do everything from researching ways to display information, to ways to gather information from the bottom of the ocean. One thing I am particularly interested in is the project Ken Hinckley is working on, InkSiene.

Now the interesting aspects of this project are numerous, but he touches on some great things. Here is his list of features:

These are some of the cool features offered by InkSeine:

Blaze a super-fast trail by using radial menus for pen commands.
Just hover to preview the commands. Touch down in the center and
stroke towards the command you want to activate it.

Select existing ink right on the page to initiate a search.

Create queries in the context of your notes to keep track of searches,
reuse them, or return to them later.

Easily find emails, documents, ink notes, or web pages without
leaving your notes.

Drag links to the documents and web pages you find right into your
notebook.

and lots more…

I encourage everyone to go check it out and let me know what you think. To be honest, its not very often you get state of the art inking software for free, so go download and install it.

The interesting part about this is that Ken did this totally in a bubble based on user feedback. Rather than stick with the same methods as Windows, he went a different direction and innovated some remarkable things. I really like seeing something and thinking, “now that is smart.”

I currently have this running on a few machines to put it through its paces.

Check out his wonderful tutorial!

How the twitter attack happened ~ the short version

Here is the main story, http://www.techcrunch.com/..

Executive Summary: Hacker finds gmail address of employee. Goes to Gmail’s lost password function. Sees secondary email account is a hotmail account that is deactivated. Creates new hotmail account with that address. Recovers password. Changes password back for stealth. Then has access to Google Apps on the twitter.com domain.

Basically, here is what happened:

A young Frenchman named “Hacker Croll” got interested in web security, social engineering a few years ago. He is unemployed. He wanted to hack into Twitter.

• He starts doing web searches on Twitter, accumulating vast amounts of names and email addresses of Twitter employees
• From there he uses the “Forgot Password” on a Twitter employees gmail address.
• Unable to determine what it is by guessing, he asks for a hint. Gmail balances usability with security by offering users to have a second email account attached to the main email account in case of password resets. Gmail informs Hacker Croll that they sent a password reset to “******@h******.com”
• Hacker Croll guesses that it is probably a hotmail account, so uses the same username at hotmail.com to check the email address
• Hotmail recycles old usernames, so the username was deleted.
• Hacker Croll creates a new hotmail user account with the twitter employees username. Asks for the password reset from the Twitter Employee’s gmail and gets the reset.
• Hacker Croll then searches through the account and finds what the password was before he changed it, so he could reset it and not alert the Twitter Employee.

Now, he has completely shadowed a twitter employees account and has their ‘main’ reused password. He uses that password to gain access to Google Apps on the Twitter domain. There he hit the goldmine with emails, and email attachments. Then he took control of their personal email, work email, iTunes (iTunes has a security hole that you can see the complete credit card numbers), banking account information, ATT, MobileMe, Amazon, everywhere the person was a customer through the vast amount of emails he had control of.

Then the CEO of Twitter downplayed the attack, so Hacker Croll got offended and sent all of the documents to TechCrunch to prove the severity of the attack. Then, they published a wealth of internal Twitter memos, strategies, and other documents. Here is HC’s apology.

I would like to offer my personal apology to Twitter. I think this company has a great future ahead of it.

I did not do this to profit from the information. Security is an area that fascinated me for many years and I want to do my job. In my everyday life, I help people to guard against the dangers of the Internet. I learned the basic rules .. For example: Be careful where you click the files that you download and what you type on the keyboard. Ensure that the computer is equipped with effective protection against viruses, external attacks, spam, phishing … Upgrading the operating system, software commonly used … Remember to use passwords without any similarity between them. Remember to change them regularly … Never store confidential information on the computer …

I hope that my intervention will be repeated to show how easy it can be for a malicious person to gain access to sensitive information without too much knowledge.

Croll Hacker.

Here is Twitter’s Official Response:

Twitter, Even More Open Than We Wanted

About a month ago, an administrative employee here at Twitter was targeted and her personal email account was hacked. From the personal account, we believe the hacker was able to gain information which allowed access to this employee’s Google Apps account which contained Docs, Calendars, and other Google Apps Twitter relies on for sharing notes, spreadsheets, ideas, financial details and more within the company. Since then, we have performed a security audit and reminded everyone of the importance of personal security guidelines.

That begs to make you think about the balance between usability and security. The security as a whole is only as strong as its weakest link. Better check those secondary email addresses and ensure that they are just as safe and secure as your primary. Which reminds me, I need to go change some stuff… brb. :)

Twitter’s Internal strategy, http://www.techcrunch.com/…

The “Peanut Butter Manifesto” internal Yahoo Memo from back in the day, http://online.wsj.com/…