Archive for August, 2005

Wires and Cable Design

Aug 05
31

New cables, wires and connectors get invented all the time. Usually these new cables replace some standard, or update a common method of connection. Inevitably each cable design fails to learn from the cables that came before it.

Basic Principals for Cable Designers

  • Cables should be designed such that it can be plugged in and out without looking at the cable. For example an RCA cable is fairly easy to plug in without looking because the cable is round and the plug for the cable protrudes from the device making it easy to feel with your fingers. S-video on the other hand is harder to connect because the cable could be rotated in any number of directions and the plug opening is flush with the device.
  • If multiple inputs are designed to go to the same place they should be desinged as one cable. For example HD Component cables have three cables that always go together. You would never want to criss-cross the cables or connect one but not all. Instead of having three separate cables you should design one single cable.
  • Don’t reinvent the wheel – The world does not need another power cable connector or stereo audio plug. For some reason my cell phone provider decided to make a dedicated 8v power cable with an unusual plug that’s incompatible with every other charger in the world. There’s no good reason for this. If you’re building a new technology that needs a different plug ok, but if there is an existing technology that can handle your technical requirements try to use it.
  • Don’t fragment a new connector into multiple subsets- Some connectors such as Firewire and USB have several versions of the connector Small / Large / Male / Female, etc. It gets confusing. Pick a connector and stick with it.
  • Don’t have cable polarity – It’s hard enough for customers to find an Ethernet cable but to ensure that it’s a twisted or not twisted is silly. How is an end user supposed to know what happens within the wire? The hardware should automatically figure out polarity and adjust the hardware accordingly.
  • Color code your connectons and cables – Try to color coordinate the paint on the end of your cable with the matching connector. A few years ago serial PS2 connectors for keyboards and mice started to get color coded with blue and green. This make it much easer to make the connection correctly.
  • Positive connection feedback – If possible try to provide audio or visual feedback when a cable is connected correctly. One of the things I worked on was audio feedback in Windows XP for device connections. When you’re under your desk futzing with a cable in the dark hearing confirmation of your connection is very usefull. Same holds true for most other hardware devices.
  • Fail gracfully – If it’s possible to connect the cable incorrectly or into the wrong place anticipate this and fail gracfully. If you can detect the wrong cable and provide on-screen feedback on how to correct the problem that’s even better.
  • Transitive Cables – Try to enable transitive connections between devices. There are very few devices that have attempted this however if done correctly it simplifies both the wiring and the user experience. The idea is that if device A is connected to device B and device B is connected to device C then it’s as if device A and C are already connected.
    A —- B —–C

Screen Real Estate Prices are Dropping

Aug 05
30

I often hear the phrase “Screen Real Estate” some people treat screen space like a rare commodity that needs to be used down to the square pixel. Not true. The reality is that there is no limit to the number of screens or dialogs you can have, you can create menus, scrollbars, lists, tabs, windows and pages to hold secondary functions and information.

What does this mean? It means that you can design spacious luxurious screens that are simple and clean, it also means that you can use your acres of screen real estate to make the secondary pages clean and easy as well.

Rebranding XP

Aug 05
26

One of the projects I worked on while at Microsoft was re-branding Windows XP with the new logo and flag. It’s amazing how many different versions of the Windows flag there are. It’s in icons, dialogs, help screens, keyboard applications, fonts, printer test pages, setup files, boot screens, welcome screens, shutdown screens, start buttons and many more.

When XP shipped I was only aware of two ‘old flags’ in the system. The first was the windows logo in the Wingdings font: ÿ the second was an older Windows Media activeX control. Both were not changed because they where really subtle and could cause potential compatibility problems. Yesterday I was surprised to find the third ‘old’ flag that slipped through. This one was right under everyone’s nose but it was never found. Can you spot the old flag:

The top banner of explorer has two modes a thin and thick appearance and animation. Interestingly this old logo only shows in IE not in Windows Explorer even though they appear visually to be identical. To get the old logo to show you need to drag the fat back/forward toolbar into the flag region. Oops, my bad. That said I’m kind of amazed it took me almost five years to find this bug.

Making Help more Helpful

Aug 05
22

Most modern software has some notion of Help. It’s usually non-interactive text written by a technical writer to assist users in performing tasks.

Core problems with help

  • Help is not actionable. You can never actually accomplish anything from help you can only gain abstracted knowledge about how a possible solution could pertain to your situation
  • Help is removed from the actual application. It’s typically it’s own window and has it’s own user interface. To perform step-by-step instructions is difficult because you have to do window management to get see both the instructions and the application on the screen at the same time
  • People learn in different ways and help only addresses one of these
  • Learn by reading – help does this well
  • Learn by watching – help does not do this well
  • Learn by example – almost never done
  • Learn by doing – only if you want to risk practicing on your actual documents
  • Lastly many people use help to find functionality that they believe is in the application but they can’t find it. This isn’t actually help but an artifact of the fact that commands and functionality are not search-able. (Separate issue I may address in a separate article)

A different approach to help

What if help was more interactive, more actionable and more integrated into an application.

  • The ability to launch a “Show Me” where you could watch the mouse move to the menu, or dialog and perform the example action you are looking for. Helps people who learn by watching.
  • The ability to experiment and play within the help window with examples. For example imagine in photoshop help the ability to doodle with a particular tool or brush to get the idea of how it works. – Helps people who learn by doing.
  • The ability to see a scenario or tool in use on an actual product or document. Helps people who learn by watching or learn by example.

Why people have trouble with computers?

One of the reasons people have trouble with computers is that they are afraid they will break it. People are afraid that they will get the computer into a state where they will need someone else’s help to fix it and they are embarrassed to ask for this help. To alleviate some of these fears it’s important to have aspects of play and experimentation within a help context. Users should feel like it’s OK to screw it up because it’s just a workbook, just a help file and it can’t cause any damage. Once people begin to engage software and loose their initial fears it becomes easier to learn and use new features and tools.

Help files need to go beyond just documenting the features and go deeper to actually helping users get their tasks done.

Swipe this! Bank Card Problems

Aug 05
17

I have had a bank card for well over 10 years that I use on a regular basis in stores, ATM’s and super markets and the sad truth is that I don’t know how to swipe my card ‘correctly.’

The card is rectangular giving me a theoretical 25% probability of inserting the card correctly and a whoping 75% chance of doing it wrong. However I tend to do a little better because I’ve at least learned to insert the card colored side up. However on ATM’s where I either need to swipe the card my odds fall back to 25%. If I need to coordinate the card orientation with a designated swiping direction or motion I’m in serious trouble.

What’s the problem?
Let’s say that the ‘proper’ way to insert the card is logo up, with the magnetic stripe to the right side. Let’s say you want to draw an illustration to help people. If you draw the front of the card you don’t necessarily help people because their card may look completely different and if you draw the back of the card to show the side with the stripe you make it impossible to determine the proper way to reorient the image in order to insert the card.

atm card swipe diagram I found this inventive design on the web and have never actually seen this ATM design in person. It cleverly shows both sides simultaneously by bending the corner up. Bravo!

But even as I applaud this design I’m left asking myself:
“Why should I care about the orientation?”

When I hand my ATM card to a teller at a bank I’ve never had the teller reject the card because I handed it to him in the wrong orientation. Would it be so hard to have four magnetic strip readers and allow me to shove the card in any way I want?

GoogleNet, more likely GoogleHosting

Aug 05
16

A recent article in Business2.0 claims that Google is building a massive network in order to give people free wireless.  This article is a total puff piece. It’s true that Google has been buying dark fiber networks for the past year but the assertion that it’s for free wi-fi is groundless.

I believe Google is buying networks for two reasons:
- To reduce its bandwidth costs, not for searching but for indexing. Every month Google crawls every single web page in it’s index. I believe this bandwidth load is as great if not greater then it’s search traffic. Having a distributed network would reduce bandwidth costs for both indexing and searching.
- The second reason is to increase search speed and indexing speed. Google has always been relentless about the speed that it can return results. I believe it is hitting limits from the server side, by building it’s own fiber network it can increase the speed that it both indexes and the speed that it returns results.

Google is way more likely to enter the hosting market where it would be able to easily index files with no bandwidth cost.  It would instantly know when documents are updated and therefore keep it’s own results far more up to date.

3D Interface Design for dummies

Aug 05
15

The first dimension was the command line.
The second dimension was windowed interfaces.
Every two or three months someone decides that it’s time for the third dimension with a revolutionary 3D application that claims that it will change the way we will use applications forever. This month it’s this 3D interface a few months before that I remember seeing another design from Sun Microsystems, before that it was Microsoft research and the month before that it was something else. Remember a few years back when the web was taking off it was all about VRML. Yikes.

Why is 3D so compelling that we keep trying and failing?
We like to think of ourselves as Superman, able to multitasking applications and complex data structures in a single bound. Able to locate data with X-ray vision. We assume that the more data we can see at any point in time means we are being more productive. Many people see 3D as the logical way to achieve that productivity. Unfortunately we are not Superman and Superwomen, most people are just trying to do a simple tasks, 3D does not change the input that is required to accomplish tasks and it does not generally enhance the output or interpretation of data.

Some people think that people can think better in 3 dimensions because we interact in 3D all the time. I’ve heard theories that people will find and navigate applications and data faster because they will have better spatial memory. I don’t buy it. My keys get lost far more often in our 3D world then my files get lost in a 2D world. May I never find myself wandering through virtual rooms looking for a file.

Hollywood, paints futuristic 3D interfaces as glamorous and incredibly easy to use. From the touch screen in Minority report to the imersive interface in Lawnmower Man you only see the things that work in movies. It’s the perfect demo. You never see any of the real interfaces issues, dialog boxes, confirmation or even basic tasks like inputting data into a form, editing and saving a document, copying or moving data between applications.

When do you use 3D?
3D interfaces tend to force un-natural data abstractions. For example it may be very natural to model census data on a 3D map, this is a natural use of 3D because the data represents a 3D space but making file system objects 3D is a less natural model. People try to make their data fit the three dimensional model and this makes it harder to find, read and interpret data. People use computers to organize their files and data, why would you want to scatter files in three dimensions inside your computer?

If you are considering adding 3D, ask yourself… Can I do the same thing in 2-D without adding a new dimension? Almost always the answer is yes. There are only a few times when going 3D in an application can work:

  • The data you are representing is naturally three dimensional. (Maps, Architecture, CAD, Medical Scanning, etc)
  • You are building some form of first person game.
  • You are adding 3D for aesthetic reasons and not for interface reasons. Actual interactions are done in a 2D plane but rendered in an interesting 3D way.

The last one is where I see the interfaces of the future going. We will add another dimension to make the interface look and feel more attractive but in order to keep software easy to use the actual interface interactions will only be two or even one dimensional.

One dimensional UI or linear UI

Interestingly there are many new applications and products that use linear interfaces or one dimensional interfaces. This isn’t the old fashioned command line, it’s applications like Tivo, Ipod and even many cell phones. Application tasks are presented in a single vertical list. Selecting a task gives you a new list of tasks and choices. On each linear screen you can either go deeper down to a new list or back to the previous list. This type of interface is easy to use because only one choice has to be made on each screen.

As we add 3D for it’s aesthetic appeal I actually believe we will reduce the number of interface dimensions in many areas to make software easier to use.

Enable Callto links for Vonage phones

Aug 05
12

I recently got on a rant about telephone not integrating well with PC’s. For example if I have a phone number right on the screen there’s no way I can quickly place the call. Anyway I wrote a little application that sets the groundwork for this to actually work. It only works with Vonage at the current moment. If you have Vonage and could give it a try I would appreciate it:

http://www.raizlabs.com/Software/callme/Vonage_Callto_handler.exe

This will enable callto: links in webpages. Unfortunately at present there are few if any Callto links to be found in webpages. So how do you test it? After installing you should be able to type the command “callto:617-555-1212” either into the address bar of any browser or into the start run dialog box. Once I get the initial beta working I may write a plugin for Microsoft Outlook and Internet explorer to add a toolbar button to automate the creation of these links.

Give it a try, use at your own risk and let me know if it works for you.

Do you Telephone take this PC till death do you part?

Aug 05
9

I while back I started writing about the combination of a PC’s and Telephones. I started thinking more about this as I was designing some telephony integration into a customer relationship product. Here what’s in Greg’s head on the subject:

  • What if every time your phone rings your PC could use the caller ID and look up the contact information, perform a Google search and show me a recent call log.
  • What if every time your phone rings your music player knew to pause your music.
  • What if I could use a PC interface to decide if I wanted to take a call, put it on hold or transfer it to voice mail?

These are nice ideas but let’s think about this… What problem are we solving? In my opinion it’s a UI problem with telephones. In general phones come in two flavors:

They either have very few buttons and you are mainly supposed to dial your number, or they have a very large number of buttons, features and options that are likely to prevent you from dialing your number.

In either case the phone is totally isolated from your PC where all your phone numbers are stored. It’s isolated from the one device that has a full keyboard and access to a rich and graphical user interface to explain and simplify all your features and options.

On a phone the procedure to store a phone number into memory typically goes something like this: Press Store, Press the memory key where you would like to store your number then dial the number and press Store again to complete the interaction. The process has a beginning middle and end. What you are doing is putting the phone into a special mode to program the buttons. How could you do the interface on a PC? You would find the telephone number in a contacts list or a call log, and then right click and “Create a Shortcut” or drag the phone number to a toolbar and have it create a new button, or mark the number as a favorite. Regardless of how you decided to do it you would not need to put your phone in a special mode. Additionally because multiple techniques are valid you would increase the likelihood that a user would discover one of them.

In addition a PC allows you to demote and promote features. For example your most common functionality can be on a toolbar, in a button, and a menu and in a right click menu but more advanced options and features can be buried away so they don’t confuse beginners.

On a PC you could also reuse existing concepts that people already know. For example let’s imagine that phone conversations where represented on screen in a similar way to Instant Messenger Windows. If you had multiple windows open this would be multiple conversations. The currently active window would be the current conversation. Switch windows and you’ve placed one caller on hold and picked up the other one. If you invite someone to join the conversation it dials their phone number. If you close your window it hangs up.

Let’s try some scenarios the other way around:

  • Every time I see a phone number on my PC I should be able select it and click dial.
  • Every time I see a phone number on a website I should be able to click it and have it dial.
  • I should be able to see my call log on my PC
  • I should be able to transfer calls to someone else from my PC and type a short IM message as a way of introduction.
  • I shouldn’t need to remember strange codes like “Use *30 to cancel call forwarding” I should have an options screen with rich UI and preferences.
  • I should be able to receive my voice mail in my in-box
  • I should be able to place calls on hold, initiate conferences, transfer callers and be my own operator without needing to deal with 50 poorly labeled buttons and a tiny 2 line screen.

Next Step for Search Engines

Aug 05
7

There are several aspects to a modern search engine.

  1. Ability to index web pages
  2. Ability to search and rank web indexed page results
  3. Ability to display results in a meaningful way

So far most search engines have gotten a grasp at #1 and #2 but the best we have come up with for displaying results is just an ordered list. Sure lists are easy to read but this just scratches the surface about the data and information that we are searching.

Think about it, a search results for “ketchup” is displayed exactly the same as search results for “Massachusetts.” Today search engines don’t have context, they don’t understand the meaning of the search. To a search engine everything is just a web page and every web page can be the answer to your jeopardy question.

The next generation search engine will have far more semantic comprehension of the actual search term and results. In some ways Google has started to scratch the surface here. If I search for a current movie it gives me show times and if I search for “Weather” in a particular zip code or a stock symbol I get the appropriate responses. As search engines continue to collect and digest the world’s data it will become more important to customize the display, sorting and presentation of different types of searches. The world isn’t broken up into web/images/video and audio as many popular search engines believe. It’s broken up into people/places/events/things/commentary/opinions/fact/excerpts/etc. Currently a search engine can’t separate fact from fiction. As search engines mature they will begin to aggregate data together in results tailored to match the needs of the search.

Google, Yahoo and MSN still have a long way to go.