As we discussed yesterday in Part I, what happens when many of the slick visual elements we've grown so accustomed to using are no longer usable?
Here are a few thoughts on user interfaces in a direct-manipulation world.
First, it's obvious that rollovers won't roll, because there's no on-screen pointer to roll over them. You're either touching the screen, or you're not. In such an environment, how do you indicate that "this" is actionable, and "that" is not?
Well, for one thing "hidden" interfaces are out. The user is going to need a clear indication that "something" can be done here and not there, because they're not going to poke anywhere and everywhere in the faint hope a hidden menu or some other widget may appear.
Consistency counts too. But judging from from the current iPhone interface (yes, I stood in line for one) Apple's not quite as consistent as could be.
Some 3D-looking user-interface widgets are obviously buttons, thought flat 2D rounded-corner panels containing phone numbers or addresses may be clickable too. Then again, squared-off rectangular panels like those used in lists can be also be poked.
Some list item boxes, like those in Address Book and iPhoto, have greater-than symbols (>) to the right of each item as a visual indication that this item is a gateway to more stuff. Some of the same boxes in the iPod application, however, do not.
Drop-shadowed round-cornered icons can be clicked, but apparently square photos can be too, as can mere symbols when embossed and used in a panel or border. Although I'm pretty sure I saw one application where a non-embossed symbol (a plus sign) was actionable too.
So 3D and 2D. Rounded-corner and square-cornered. Embossed and non-embossed. Icons and pictures. Text and graphics. Anything and everything. Maybe.
I have no doubt that many of these issues will be worked out and refined over time. But for now they serve to illustrate that a significant amount of attention needs to be paid to your design in order to prepare for a future without cursors and pointers.
Like what?
Well, consistency is obviously important. And as discussed earlier hidden "rollover" features are problematic. In fact nearly any kind of rollover or popup effect needs a hard look.
If you're prepping your site or a subsite for visitation by iPhone users, I'd also look at any "miniture" interface element, like the tiny rotating triangles commonly used in tree controls to expand and contract nodes and subnodes. Same for widget "close" and "edit" boxes. A mouse pointer may be able to nail a 3px by 3px interface element. A fingertip most definitely can not.
Multi-level flyout dropdown menus probably fall under the "bad thing" category as well. Especially those that use flyspeck-condensed fonts. (Actually, ANYTHING that uses flyspeck-condensed fonts. Remember accessibility?)
And frames are still most definitely out, along with plaid Bermuda shorts. (Actually, I think the shorts are coming back. Will mankind never learn?)
Elastic designs may need some consideration, especially in terms of the screen being too narrow. Too bad many browsers still fail to correctly implement minimum-width CSS attributes.
Check out your forms, especially any that may use Javascript dialogs for input validation.
Gestures are another significant portion of the iPhone interface. Flicking and scrolling and dragging and tapping and double-tapping and two-finger tapping and... use your imagination. But until Apple opens up the iPhone API we're probably stuck with the ones Safari knows about and supports, so it's probably a moot point.
I'd brush up on your drag-and-drop Javascript code though, as direct manipulation of objects is the iPhone way.
This may appear to be a lot of work, especially when we're talking about a single phone that's just now starting to ship.
But the future is coming. There will be more iPhones, and probably iPads and ePads and eReaders and even Jeff's full-sized desktop. And who knows? Thinking about these issues and solving those types of problems may even make your "normal" sites more user friendly.
If one thing's for sure, the computer and the graphical user interface and the web browser have an interesting future in store.
The lowly mouse pointer, however, may not be so lucky.
Comments