phonezilla

The iPad’s been in that unique “not quite a laptop, not a phone” zone since day 1. While we collectively have decided that it’s a tablet and it’s something new, lots of website detection scripts haven’t gotten the memo.

In using the iPad I’ve come across a number of bothersome anti-patterns when simply browsing the web. These aren’t ranked in any way, but they’re sure annoying to me. Some of these apply to the iPhone as well. I’ll try not to rant much.

1. Not allowing access to your “full” site. It’s 2011; phones can handle things like CSS and JavaScript now. (Flash? Not so much, but your experience doesn’t hinge fully on Flash, does it?)
2. Serving your phone-oriented site to the iPad. While comical and still technically usable, it makes me feel dumb.
3. Breaking permalinks due to another anti-pattern. This is a good one. I go to a specific page via Google and somehow end up at your mobile homepage. I can’t get to the actual thing I want to see because you’ve decided, “Ah, this person’s coming in via mobile! Let’s give them the homepage.” No! The “perma” stands for “permanent.”
4. Showing an interstitial for your iPad app. If I wanted your iPad app, I would have gone to the App Store. I just want this one page. Your app might not even offer it.
5. Displaying a JavaScript prompt telling me you have an app every time I load your page. This, I believe, is a part of some popularly-used forum software. I go to a forum and am told via a modal (!) that an app is available. I tap Cancel and am on my merry way. Then I visit the page and it happens again. Bad! Bad. Bad.
6. Not offering the same content between your iPad-geared website and your website. You can (and should!) enhance the content, but what’s offered on your “regular” website should be available via the iPad. C’mon.
7. Offering a site in an app wrapper. This is, maybe, a little more controversial but websites aren’t apps. When sites try to do native app things they tend to end up in an uncanny valley. Interactions are off just a little (maybe less responsive?), spinners and things don’t look quite right, and so on.
8. An instructions screen. I’m with Khoi. But instructions on a website? Whew.

Examples

Netflix: The good? It’s Netflix. The bad? How am I supposed to know anything about any of these episodes? I can just play them and can’t access individual episode info. Whew.

Peapod: This is a pretty standard interstitial. Too bad it’s really for the iPhone (and they have an iPad app!)

Northwest Herald: My local newspaper offers up a completely different experience for tablets. This in and of itself isn’t bad but, to be honest with you, the first time I saw this I had no idea how to scroll anything. Turns out that it requires the usual scrolling gesture, but the question of what can be scrolled is also a big one. The answer: everything except the ad and top navigation!

Also, they do have a one-time intro/instructions screen that one can never return to.

Upshot: While I singled them out, this is pretty standard. It looks goofy and is goofy. Also: no way to get to the full site; for more information, text on the page instructs you to visit their full site on your computer! How 2006.

The latest version of the iWork suite for iOS includes a document manager. This serves as the springboard for file management within each app. It’s an enormous step up from the prior carousel of documents, but continues to underscore the sore spot that is organization of files in a hierarchy-free environment. There are a few nitpicks I have with the manager but first, a look back.

The Carousel

Bluntly, the carousel sucked for any serious usage of the tool. Did you make 5 documents? Maybe 10? Then you were fine. But 25, 50? You’re stuck with a single chronological thumbnail list which you can’t reorder in any way. This isn’t a problem specific to Pages et al - iA Writer has a similar, maybe worse implementation - but to me it was the most glaring instance of it.

The New Model

I’m glad Apple abandoned the carousel for the document manager. The presentation is nearly identical to Springboard (your home screens) and the Photos app.

The screen allows you to sort by date or name (scroll up from the top of the thumbnails) and group documents into folders. You still can’t organize these documents arbitrarily, as you can with your apps. Folders are single level only - no nested hierarchies. I think this is fine, honestly, and I’d guess it covers a majority of use cases.

The interactions for creating a folder are the same as Springboard: press and hold a document until it does the wiggle jiggle, and then drag it onto another document to create a folder. The folder gets the useless title of Folder (or Folder 1, 2, etc.) and if your display is sorted by name, the new folder immediately finds its way to the F’s. Next, you can rename it, add more stuff, or close it.

(Above, “Unnamed Stuff” is the folder. It looks and acts like a Springboard folder. Note the lack of easy distinction amongst documents unless there’s a radically different design.)

In contrast to Springboard, the document manager doesn’t try to give your folder a useful name out of the gate; it follows the Mac OS generic name model. It’s too bad. While Springboard’s names might not always be perfect the automatic naming is a nudge in the right direction. Let the computer assist you.

Multiple Selects

Unlike Springboard, the document manager allows for the selection of multiple items. Once you’re in jiggle mode, tapping another document makes it your selection and, annoyingly, your original selection becomes unselected. Boo. But now you’ve got a number of documents selected.

(This was difficult to capture, but here is a stack. Note the 4 slots where the documents in the stack used to be; these could serve as natural drop points… but they aren’t.)

My first thought with these selections was, “I can make these into a folder.” But I can’t. If you have multiple selections and then tap and hold any one of them, they all converge into a stack. The animation is beautiful and made me “oooh” out loud. But all you can do with this stack is drop it into a folder. You do this by dropping the stack onto yet another document which isn’t a part of the stack. Oddly, you can choose to duplicate or trash these documents when they’re individually selected but not when they’re a stack.

This is a weak spot in the interaction but, again, it does follow the OS X model. When you’ve selected multiple files in OS X you can create a ZIP of them but not create a new folder with all of them.

As with the naming convention, this leans too heavily on OS X in my opinion. Once I have a stack of documents, I have already grouped them. They are now one thing to me - and the app represents them that way! - so having to put them onto another thing is silly. A stack should be folder-able, period.

A Side Note on Consistency

Multiple selection within iOS isn’t consistent in Apple’s apps. Consider the Photos app: a user has to explicitly press the share button to enter multiple selection mode. Then, you tap the items you want to manipulate and press a button (copy, print, etc.) to do something with them. Holding down a photo - which really should enter wiggle jiggle mode - just pops up a Copy contextual menu. Note that the document manager includes an edit button, which is the equivalent of the share button in Photos; it enters jiggle mode for you.

In Photos, you can’t create a stack of photos nor a folder, which is a glaring oversight. The photo manager in Photos is woefully basic. I am half-expecting an update for this in iOS 5.

Visuals

One metaphor shines through all of these managers: Apple is pushing hard for thumbnails as the main way of interacting with documents. It’s true even in iTunes, where album art gets first class treatment.

That’s all well and good for visual documents like photos and presentations, but it falls down for word processing documents. Why? Well, look back at the image atop this piece. Go ahead, I’ll wait.

While I can make out the text on these documents, these thumbnails are substantially smaller than they were in the carousel and of diminishing use here, so I need to rely on the filename and metadata. Oh, but if you use long names like I do, then your names get truncated. Frustratingly there is no way to see a document’s full name until you’ve opened it.

The manager does allow you to rename a document by double-tapping its name, but then you have a tiny input area to work with.

(I’ve got this great giant screen, and this is the thanks I get? This document’s full title is, “Kindle and I Get Off on the Wrong Foot.” It’s like Writer’s focus mode gone awry.)

Thus, if you want the full name of the document you need to go all the way back to the Spotlight screen. But then you can only find the filename and not any of its contents, as iWork’s documents aren’t indexed at all by the system - still.

All is Not Lost

Once you’ve gone to a flat, non-hierarchical situation, ensuring easy access to stuff is difficult - as these very different interactions demonstrate. The fact that the carousel was retired is a good thing, a very good thing: Apple is still willing to scrap what doesn’t work.

The document manager is a step in the right direction. I have a few suggestions on how it could be improved.

• First, for goodness sake, index the damn files. Even if the document manager becomes perfect, it’s a basic expectation that a search facility on a device will search everything on a device. Spotlight for OS X does this; here’s where you steal from OS X.
• Let a stack of documents become a folder.
• Give folders a useful name by default.
• Allow arbitrary organization of documents.
• Introduce some sort of interaction (maybe on press-and-hold?) which shows a document’s full name.
• Full-on tags and labels would be overkill, but a simple favorite/starred item model could work here. One could then allow iWork to group items by favorites.

I’m really excited to see where all of this goes, in any case. Throwing away traditional files and folders was a bold move and I’m certain that as this new model matures, it’ll only improve. And if it can still make me say “oooh”, all the better.

One of the things I believe in when it comes to experience design deliverables is the practice of doing enough and no more.

Lately I’ve found the best way for me to get an idea across isn’t to create multi-page clickable prototypes; rather, I draw the interaction on paper using Sharpies and/or my favorite Muji pen, take a photo of that, and then send it off to people for discussion. This is a bit different than the oft-expected high-fidelity prototype. So here’s why I do it:

Ultimately, tools and technology should not get in the way of explaining the model.

For getting an idea out, sketching is the way to go. I’m totally comfortable with OmniGraffle (and HTML/CSS, and… and…) but it adds a layer of complexity I might not want when I’m exploring ideas and defining overall interactions. The mental block for most people is seeing the sketch as the deliverable, and not taking it back to Axure, Visio, or OmniGraffle for solidification.

With every single thing you add to a sketch, wireframe, or mockup, you need to ask if it really is doing anything. Do you need to create all 58 variations of how an error message will look, or will 2-3 suffice? Do you need to identify every piece of text which will wrap on a page, determine the break point, and then document each one? And is there value in having a sketch, a wireframe, a mockup, a clickable prototype, and a mock data prototype in addition to the actual code?

What you need depends on your situation, corporate structure, client, and ability. But adding complexity can diffuse an idea. Remember that you should only do what is absolutely necessary and no more.

Maybe even bigger than I thought.

In case you aren’t familiar with Now!, check the great video created by Adam Lisagor.

Until this, Groupon hadn’t been doing anything terribly new from a conceptual level: it’s all moderately-targeted deals with a time-sensitive component. Open this checking account now and get a free toaster. Do this now and get a bonus. Stuff like that. This is part of the reason why there have been so many copies out there; it’s not hard to take this idea and do it in-house. (Groupon is arguably winning at branding within tech circles though, and obviously they’re enormous and getting bigger.)

That all said, Now! changes the playing field a bit and it’s something that wouldn’t have existed even 3 years ago. This first version is pretty straightforward, too. It says, “Here’s what I’ve got. It’s not going to last long. Buy it now.”

But let’s look down the road just a bit. Your smartphone knows where you are and knows who you are, right? Groupon and Facebook are amassing good knowledge about you based on purchases and activity. So it seems like a natural progression for Now! to blossom into a highly customized marketing platform. Eventually, those Groupon Now! offers will be just for me. That’ll be based on what it knows I like, and what I’ve bought, and also based on what it thinks I might want to try.

It also seems natural to tie this into some sort of rating system… say, Yelp. That way, Groupon Now! can say, “Ah! Paul! You and a friend went to that awesome biscuit place for lunch today. Did you know there’s another place you might like just a few miles away? And it’s got a $10 for $5 offer right now?”

Foursquare and its ilk are kind of there, but the interaction is slightly different in that it focuses on social instead of the transaction.

This type of cross-site intelligence isn’t hard to harness, technically, and it opens up a myriad possibilities. I’m really pleased that it’s looking like the future of super duper localized, personalized marketing isn’t going to be a bunch of text messages or annoying alerts as one walks by a business. Instead, it’s going to be more subtle and extremely effective. I’ll take that over ads in YouTube videos and OSes any day.

I have never searched my network’s updates on LinkedIn, but they’ve gone ahead and changed the way the widget and interaction work. This is now the default state:

“Search Updates” is a link. Clicking that link…

Boom! Now you’ve got a search box. All right. That’s a little odd, I’ll admit, and I’m not sure (yet) why they didn’t go with the tried and true input type=”search” deal:

Interestingly, too, in the original state one can click the magnifying glass button to conduct a search - even when the search term hasn’t been entered. All this does is take the user to a broader updates page with filters and the like. But, if the text box has been activated and text entered therein, it acts as a traditional search button.

The first iteration of Jackson Script, a spiffy new font, is now available. Go get it!

I know it rolled out sometime earlier this year or late last, but Lands’ End now has a really lovely order history page. All of my orders for the past three years are in one place with full pricing and tracking information. I think I prefer this even to Amazon’s treatment of order history. Well done.

An area of design which I’m really fascinated by is car interior design, particularly the dashboard. There’s an incredible amount of… stuff… which must be accounted for, and yet if the whole thing looks or functions poorly, it could be critical.

Thinking about aesthetics, I mostly dislike my current car’s interior:

It’s mostly a boxy, angled mess. The knobs should be buttons (particularly on the HVAC) and the buttons should be knobs. It all is just too much, and the UI for the nav/stereo could be better. Also: there are buttons on the back of the steering wheel, either side, which are totally unlabeled. You just have to read the manual and/or know what they do. Silly madness.

Chrysler did upgrade the interior for 2011:

This is a lower trim model than my car, but man - what a difference. Aesthetically, it’s streets ahead. I checked one out at the dealer and found most items felt better. The quality was much nicer, and the entire experience was just more pleasant.

What originally sparked this post wasn’t a critique of my current car - although I may write one - but the revised Volvo XC70 and S80 interiors. Check it:

Awesome. What a color palette! Reminds me of my first car, an 88 Dodge Shadow, except that the color is executed much better.

And:

Definitely feels cool, maybe even cold… but it is lovely.

When it comes down to it, obviously the design goals and ideals aren’t far off from what I do: there’s a balance between functionality, interaction, and beauty. But because these are tactile objects I have a much different reaction to them.

It seems to me that Apple should consider merging the iPod and Remote applications on iOS.

A few days ago I wanted to listen to some music on my iPad from my Mac’s library. So I hopped over to Remote and… uh… hm. I got lost pretty quickly looking for buttons I thought should be there. They just weren’t! The problem was that this functionality was within the iPod app, and not the Remote app.

So to clarify, if I want to play music on my iPad from a remote library, I need to use the iPod app. If I want to play music on AirPlay speakers from a remote library, I need to use the Remote app.

It seems to me that both the iPad and AirPlay speakers are functioning in the same capacity here, and this seems like an arbitrary and weird distinction. Compounding it, I can access my Mac’s library via a remote connection to the Apple TV (which has no library!) via the Remote app, because I’ve told the Apple TV to look for my libraries. Whew!

There ultimately needs to be one app for playing music and media anywhere, including on one’s iOS device. That app should be iPod, not Remote. Let Remote just be a control for Apple TV.

iTunes isn’t in iTunes; it’s in iTunes

I find myself occasionally going to the iTunes app on my iPhone in order to access my music library because the Mac application for this purpose is called iTunes. But really, the iTunes app on iOS is for the iTunes Store. Thus, I have to jump out of iTunes and back to iPod.

I suspect this is less of a problem for people living solely or mostly in iOS, but it does throw me. It’d be nice if iTunes on iOS was labeled “iTunes Store,” which would give it parity with the App Store.

Back in the PowerPC era of the Mac, it was really difficult for Apple to compete with Intel’s chips on pure numbers. This led to the promotion of the megahertz myth, videos mentioning gigaflops (particularly the G4 Cube intro video - god, I miss that machine,) and lots of talk about the user experience and the operating system. When OS X was where Apple was headed, they needed to focus on that because they couldn’t, frankly, compete on raw speed nor price back in the day. And those numbers are what drive PC sales to this day (although, arguably, the CPU speed has been supplanted by price as the most important number to an average consumer.)

So Apple did something smart. While they did switch to Intel to compete on that front, they also said, “We’re not going to play that game tomorrow.” Instead, they started building closed consumer electronics: the iPad, the iPod, and the iPhone. What CPU runs the 2nd generation iPod? How much memory does it have? How much memory does the iPhone 3GS have? Honestly, you might know these things only if you’re a geek or a technologist, or both.

The mass market - the consumer market - shouldn’t care about numbers other than storage space, because those other numbers ultimately serve to alleviate buyer’s remorse and sell future products but speak very little to meaningful usefulness of a device. The way PCs are marketed have trained us to “care” about those numbers. Telling a person that a device has a 2.6GHz CPU is meaningless unless they are able to get what they want done. That’s all that matters. Everything else is just means to an end.

Now, in the PC world, this doesn’t fly. It’s a numbers game. But in consumer electronics? Ah, now you’ve got something. The precedent is there: no one, or perhaps 5 people, care what CPU drives their clock radios. With tablets, you’ve taken away the entire abstract of a computer - including the baggage that goes with it! - and replaced it with an appliance which “just works.” And yet, I see promotional blog posts for the PlayBook, Xoom, and cast of thousands of tablets talk about numbers, resolution, and all that crap.

That’s not how tablets have been sold thus far and I truly hope we won’t go down that path. Tablets are not computers, so selling them like computers is foolish. Putting computer operating systems on them is silly. Treating them like computers - wanting them to be computers - fundamentally misses the entire point. They’re something else, and any company which decides to focus on numbers is clearly stuck in the past.

Last week I traded up from my Android phone to an iPhone. One of the joys of iTunes integration with these devices is that all of the apps I already purchased for my iPad transferred without fuss over to the iPhone, assuming the apps were meant for both platforms.

The first app I set up was Instapaper. I had to log in. Not a big deal. Then I set up the iTunes Store. Had to log in. Facebook. Log in. Twitterrific. Log in. Starbucks Card. Log in. You get the idea.

This process is surprisingly painful and time consuming. As I mentioned in my prior piece on eliminating the login form, my phone already knows who I am - and I even synced it with my Mac; in theory, apps had a chance to verify me via those means.

Instead, when setting up a new device users have to enter usernames and passwords a lot. It’s surprising to me that there isn’t a better way to do this yet.

Collectively, we use analogies to simplify concepts and, potentially, make them more relatable. But if you’re discussing an analogy and find yourself nitpicking over the smallest details… stop.

Instead, back up and consider if the analogy is valid or even necessary. Don’t underestimate your audience’s level of understanding.