Every once in a while, you come across something that makes you believe that there are no new ideas. That everything you come up with was invented by someone else before you. James Gosling‘s video of the Star 7 Prototype is such a thing.

Last year (2009), while I was working on the Java Store, we were looking for a way to get users to understand the “drag to install” feature. Users could simply drag apps out of the store onto their desktop.  This would install the app for them. While this worked very simply once you knew about it, we were looking for ways to help the user discover and use the fea ture.

James suggested that we look at the Star 7 prototype video for ideas. He said that in the Star 7, the “complete user manual” was part of the boot up sequence. The Star 7 was built between 1991 and 1992 at Sun Labs, and the video dates back to 1992. It was a “prototype handheld device” that featured a wireless network, color touch screen, and sound.

When I looked at the video, it blew me away. There was, indeed, a “user’s manual” in the bootup sequence. But what grabbed my attention was how many UI conventions that are common today had been conceived in that UI nearly 20 years ago. I felt compelled to transcribe the video with timestamps and screenshots. Take a look at the video below. If you see something I’ve missed in the list below, post a comment.

UI Conventions from the Star 7

• Controls with inertia like sliders and spinners: A flick spins them, and the harder you spin, the more they go. Now popularized in the iPhone. Time stamp 4:27.
• Back button (called “wayback” button. Takes user back to location they came from. Now standard in browsers and many other UIs.) Time stamp: 1:45.
  • A feature from the wayback button that has not made it into current UIs is the thumbnail of the screen that the wayback button will take the user to.
• Sound to show that an object has been selected / is active. (Multiple instances in the video) Apple / Bill Gaver had an experimental product called the “Sonic Finder” that also used sound to provide the user with feedback.
  • Clicking sound when a spinner is moved. The iPhone inertial spinners use this. For example, when setting the time for an alarm, the iPhone clock UI uses inertial spinners. They give the user auditory feedback when the spinners are turned. The Star 7 did this in 1992.
• Help system is part of splash screen. Timestamp: 1:28.
• Panning: Screen pans to keep the “cursor” in view.
• Drag and Drop: Objects (e.g. schedule for a TV program from the TV guide) could be dropped on the Agent or on other objects (e.g. VCR).
• Magnifying glass with “+” to indicate zoom in, “-” to indicate zoom out. Time stamp: 5:02.
• Zoom in for detail / zoom out for a larger view. Time stamp: 5:09.
• Friendly Agent (as opposed to Clippy, Microsoft’s really annoying agent).
• Anthropomorphic UI (remember Microsoft BOB?)
• Dragging to an object and waiting for it to open before dropping. Mac OS X has something similar. If you drag a file to a folder and wait, the folder will open.
• Sketchy inrerfaces. Was part of James Landay’s PhD thesis. He and his students at Berkeley created “Denim” a sketchy wireframing tool. Now popularized by Balsamiq. What is amazing about the Star 7 interface is that it predates all of this work by years. In addition, Denim and Balsamiq use the sketchy style for wireframes. In the Star 7, it was the actual application, driven by “real” code.

Its fun to speculate what would have happened to the world of PDAs and cell phones if Sun had invested in such devices. The Star 7 also predated the Palm / Palm Pilot. According to Wikipedia, Palm shipped its first Palm Pilots in 1996.