Archive for February, 2010

there are no web pages anymore

Friday, February 26th, 2010

I need to start just writing down about half the things I say, apparently. I am constantly finding some other brilliant blog post or tweet that makes me go “of course. We already do that.”

Kate Rutter at Adaptive Path recently posted about no longer using the word “web page.” I think that post went on a bit much about the philosophical underpinnings of the original term, and I’m not loving a lot of the terms she came up with. It reminds me more of some terminology I have created in the past couple months regarding eBooks (settled on “page” as a reference to the original book only, and “leaf” as the unitary, non-scrolling content in the current viewport).

As a general rule, I agree with tossing the term “page” for interactive products. I still think you have to know your audience and I use “page” and “web page” periodicially. It’s okay, as long as you know it’s wrong and work towards the right solution.

And here’s where it matters. Semantics matter, because they carry meaning. Replacing one word for “a fixed piece of content” with another is not that helpful. As I address briefly in my book on design process there is no difference now between applications and hypermedia. The whole concept of a page, leaf or card is suspect. More importantly, it constrains you as a designer.

My terms are along the lines of “state” and “view.”

I’ve started trying to clearly talk lately about the difference between interface design and interaction design – and other types, but these two get confused a lot. And interface design is not bad, but too many interface designers think they are interaction designers. Interface design is good and important, but (as I define it) it’s about the relationship of items within a single view.

Interaction design begins when the view changes, or between different views and states of the system, or related systems. Thinking entirely about decks views lets you loose sight of the basics of interactive design:

  • Information
  • Interaction
Nothing else is basic. So everything is up for grabs in the design. Why, therefore, does a new piece of information get a new page? Why can’t it modify the display properties of the application as you are currently looking at it? That’s a new state of display.

I fell into hating the term “web page” years ago, but not because I felt it was dated or over-used or because someone told me it was. It was a natural outgrowth of thinking about design from the ground up. Flowing directly from problems, to information design, to interaction design, to interface design… and having the revelation that there are no web pages anymore.

micropayments and so-called micropayments

Wednesday, February 24th, 2010

Somewhere in my Twitter feed, I was pointed to Rita McGrath’s Why I Hate Micropayments on Harvard Business Review. A nice read, and points to several problems. But I’m not ready to throw the baby out with the bathwater.

When originally conceived, micropayments were pennies, fractions of pennies, or maybe small fractions of dollars. This has unfortunately migrated into $0.99 or even $2.99 “micropayments.” Maybe these are “centipayments?” Nah, too geeky. “Minipayments” is better.

I think the minipayments evolved because you can’t make micropayments work financially for a single site. With credit card fees starting at $0.30, a $0.05 payment isn’t going to fly. Even Paypal’s current offering is $0.05 + 5% for micropayments.

I’ve seen some attempts to create cross-site micropayment systems, but they were way too small and folded soon after. At one point I had sent $10 on each of three systems, but only ever got $3 worth of content out of any of them.

Premium SMS is great, except that you only get at best 25 cents on the dollar.

Problems with minipayments

Right now, minipayments have business and user experience problems.

  • They are large enough to make you think about clicking, to actually track the money. I could have gotten a song for that! Or a cup of coffee! Or a turnpike toll!
  • Each micro-purchase is made with a separate financial decision, unlike turning on a light switch, sending a text message, or driving to the store. Each of these other decisions have financial consequences, but few of us think about it.
  • Most of these decisions also have a high time and attention cost. Entering credit card data, for example, is slow. Even password entry creates a barrier to entry. These extra user steps remind the user of the dollar cost as well.

There are places where minipayments are making sense. Apple’s iTunes store is clearly an example. Arguably, other app stores are also successful.

These success stories have addressed part of the minipayment problems. Customers have a single iTunes account, they aren’t really paying attention to how much they are spending, and Apple is left to get the money to the content creators.

But a central store for web content simply won’t work. The “store” needs to be highly distributed.

Other successful models

For sites with known value, small annual payments are useful. Flickr’s professional account is $25 for a whole year; $2/month is invisible to nearly all.

Monthly fees are more problematic, as customers get reminded every month of the cost. We subscribe to a few services, and seeing $50 here, $25 there, and $100 over there every month is painful. I find myself stripping down services like this.

Annual payments could work for some content companies, but customers would have to know the value. I’d happily pay $20/year for Harvard Business Review content, but I will not pay $4/article on nearly any site.

Making micropayments work

In short, we need an ecosystem for acquisition and payment of content, especially long-tail content of all flavors. If done correctly, the ecosystem could allow bands to sell their songs directly, application developers to sell their apps directly, and of course some web pages to be behind paywalls.

Micropayments need to be beneficial to the content owners, the payment providers, and to the end users. Here’s one way how:

  1. A large brand, such as Visa, Paypal, Google, or mobile operators, creates a micropayment platform. Actually, we need to see several of these.
    • Mobile operators would simply use their payment gateway. For more, check out Visionmobile’s Why mobile can bring back the value to the internet
    • Google and Paypal may need to require the account to be primed with a small amount of cash, which can be withdrawn at any time and also applied to other purchases.
    • Visa and Mastercard could make micropayments available to good customers carrying a balance, or perhaps add an annual $10 fee
  2. Payment providers create a signup for content owners intended to be fast and simple, more like signing up for Adsense than for an App Store.
    • Protecting against fraud may involve a refundable deposit, scaled against projected sales volume, for unknown providers
    • Content owners should sign up for as many payment systems as possible
    • Payment provider provides buttons for their call to action
  3. Credit or debit cards associated with micropayments get charged once per month, or similar, perhaps just refreshing the account balance. It could vary by provider.
  4. A pre-pay option could be cash-based, much like buying minutes
  5. Content behind a paywall would have an array of payment buttons next to it, much like the social media share buttons on blog entries right now.
  6. Purchases are one-click or click + passphrase, based on security settings
    • Purchases are limited to one per 3 minutes (fraud protection)
    • More than, say, $5 spent in an hour triggers an authentication request
    • No purchase can exceed $3 without an authentication request
  7. The payment provider returns an approval code that allows the content to be displayed.
  8. Payment providers have easy-to-integrate code for hiding and revealing the content, ideally using a standardized micropayment API

By batching the transactions to a weekly or monthly level, we reduce the effects of transaction fees. The same function makes the price effects of the purchase less visible to the customer.

By allowing purchases with a click or very short code, we reduce transaction friction for end customers. By providing several types of accounts, we provide flexibility for end customers to choose the right type, such as mobile phone, debit, or prepaid.

I agree, this isn’t the way to save the newspaper industry. But it’s more likely to help than to require that I pay $5 for a week’s access and have to sign up for a specific site. And it could be highly disruptive for a number of long-tail publishers.

best practices in interactive help

Monday, February 22nd, 2010

The other day the team here at Little Springs working on [the other big project] were talking about one of their next phase deliverables, a help system. So I jumped in and intruded with all my ideas. Open plan offices are great for this.

Especially in my time at Sprint, building large scale account management systems, I've run through a lot of serious help systems, that had to meet specific financial and satisfaction goals. So, I've not just designed a lot of help stuff, but had some user research, and metrics on effectiveness. I am therefore pretty confident these methods all work. It should also be mentioned that this is not mobile-specific. That's a subset which I haven't worked out quite as well, but will try to someday. This is more like application and web systems help.

And after I gathered all my best practices to present to them, it occurred to us that these seem to be published nowhere else.

My guiding principles are that most help systems suffer from two distinct problems:

  1. That you need help at all.
  2. Internal organization and jargon.

Solving these will guide you to the right design.

Problem: That you need help at all

What I mean here is that customers don't want help. They usually don't want to pay bills, or change their settings. In their heart of hearts, they just want everything to work, seamlessly. When it doesn't that's a problem, and help gets called on in these dark times to get them out of it.

To solve for this fundamental problem:

  • Design as though you have no help system — I almost never design a help tab or little question-mark icons into my basic system designs. Any user going to help is a failure of the design, so work to avoid that with other design principles. Don't throw errors. Make everything clear. Set expectations, and follow them up.
  • Pre-empt help questions — When you come across a problem, very often you can solve it by sticking the "help" content on the page. Whether it's explanatory intro text, hint text below the form fields, or a balloon that pops up when you fill in that field wrong, you can tell the user how to avoid errors, or that something is wrong before it's a serious problem.
  • Simplify errors — Though back to system design, this is the sort of thing that often tends to come up only when detailed help documentation is being created. One example serves to illustrate this best: A web-initiated SMS sender I designed once, which attached to a number of different back end systems. Any number of them could fail, in a number of ways. Development had cut down the 80-some errors to 15. But the user can't fix them and they all meant "something is wrong, try again" or "something is very wrong, try again later." So we cut down to two messages, with basically that text. If you have more than a handful of error messages, something is certainly wrong.
  • Place help content contextually — "Help" does not have to mean a pre-packaged, self-contained knowledge base. Often, it should not be. I covered this some in the pre-emptive stuff above, but the principles apply more universally. If the user calls for help, it can appear on the page. When browsing help, make sure it's a new window, and you can regain focus on the application (or browser window) so the customer can follow along with your recommendations. Make sure interactive help is at least no worse than a book open on their desk.
  • Contextually link to and within help — Launching help should pretty much never just open a help home page. Take the user to the help topic, or section, for their current location in the system. Sure, there will be a search, and other navigational elements to help them move around, but most of the time help is related to the location from which it was launched.

Problem: Internal organization, and jargon

All too often I encounter, or have to build, systems that are communicated in the way the company works, instead of the way the user perceives things.

  • No FAQs — We've all seen it: the "Frequently Asked Questions" section of a brand new website. Frequently asked by who? And it's true, that almost all of these are just what some marketing team or other has dreamed up. Users see through this. They are as cynical about FAQs as you can imagine, and disregard them whenever they can find a better solution. Not that the concept is bad. If you can actually talk to the customer service arm of the company, and get the top 100 call reasons, go right ahead and narrow them down to the top 10-20 basic problems. Be sure to highlight them somehow (whether inline or as a topic area on the help landing page). But don't call them FAQs if you want any users to read them.
  • Gather and organize information carefully — The best way I have found, on anything like a reasonable budget, to get help topics written is as follows: Get "help topic writing" to be a task on each developer's checklist. Right after successful unit testing, he has to write up the topic. These all get gathered up, and the product manager (or account manager, or development manager, depends on the dev team) reviews them to make sure nothing is totally unexpected. They can also turn impossible jargon into something useful, or reject them as too dense and ask for rewrites. Then the UX team organizes them in a sensible manner (see next bullet) and gives the final result (with reference back to the original topics) to the tech writer to clean up. With more time or money, you bring the writer in earlier and earlier. To the UX meeting, to review, even to interview the developers directly about what they wrote.
  • Organize help like the application, site or service — Assuming that you have managed to build your product correctly, do not then fall back on the way the business is run for your help system. In fact, once you have all the help topics in hand, laying the product information architecture on top of them is often a good organizing principle for the topics. Sub-organize and cross-link all you want, but make the topics reflect the product. This also helps when you want to link to the help system from any location; there's a heirarchically-relevant location in the help architecture to send them to.
  • Use common terms, not jargon and brand terms — Unless of course, your product is full of jargon and brand terms. And even then, also use the more common terminology along with it "Super FrogConnect, high speed 802.11g WiFi, can be configured..." Be sure to use several levels of terminology, to appeal to experienced and novice users, as well as tying it to the product.
  • Teach the users, using good educational practices — I am not an instructional designer, but I know some. All I remember is that I have encountered normal distributions with visual learners on one end, and textual on the other; and on one help system I included diagrams of the new account management structure. Which worked great. And is especially important if something about your system is new, or breaks previously-established expectations. Be sure to hire a good writer, at least, and someone like an instructional designer if you can. They'll tell you more about this.
  • Don't make users classify themselves — In theory, knowing the knowledge level, or intended use of the customer is a great thing. You can give them the correct experience, or here the correct sort of help language. In practice, this is a total non-starter. Even when people can classify themselves in useful ways (which is rare) they usually resent it. You don't need more ways to annoy customers, so just present the information and take your best guess as to how to communicate to them.

Be trustworthy

There's a sort of third principle that emerges when you look closely at these, and that's Trust. Sure, it's a common principle of all interactive design, but as I explain in my book on design process it's good to identify which of these principles are most important to the targeted users of your particular product.

Certainly, help systems need to be easy to use, transparent, preserve user data, identify them personally and so on. But trust is the biggest problem. Customers seeking help are (almost always) having a problem. You are already in a hole, and any friction is going to add to the frustration.

Aside from informing the rest of the design, this leads to one last best practice:

  • Let your customers call you

This is rejected a lot by folks looking to cut Customer Care costs. Phone calls cost money, so anything to redirect them is good. But it's one of those where the conventional wisdom is wrong.

I'm not saying calls don't cost money. But customers already on the website are (generally) trying self-care anyway. They want to solve the problem themselves. Putting the phone number at the bottom of every screen doesn't drive more calls, it gives customers the confidence that they can try to solve the problem themselves. If they can't figure it out, they know there's someone to help them. Call rates often go down the more you add the number to the website.

This is not a theory. Several times I have seen this borne out by data, and I've heard the same from others, in all sorts of industries.

So, in summary, my best practices for interactive help are:

  1. Design as though you have no help system
  2. Pre-empt help questions
  3. Simplify errors
  4. Place help content contextually
  5. Contextually link to and within help
  6. No FAQs
  7. Gather and organize information carefully
  8. Organize help like the application, site or service
  9. Use common terms, not jargon and brand terms
  10. Teach the users, using good educational practices
  11. Don't make users classify themselves
  12. Let your customers call you

the speed of the mobile web, part 2: tips for content providers

Monday, February 15th, 2010

Lots of “speed” tips are focused on content providers. Plenty of information available. Here’s a starting point.

In general, tips for speeding up a web site will help for at least some devices, but there are some extra niceties for mobile optimization.

Start with the giants: check out

Some specific tips:

  • Each fetch request adds to latency, even more than most desktop users’ requests. Collect images into a single file.
  • Design and develop as if all users were using satellite connections.
  • Whenever you see a desktop maximum size recommendation, guess that you should multiply the number by 10%.
  • Understand “make sure your size is no larger than 25k because that’s what the iPhone can support” type advice is not helpful for anything other than the iPhone. And 25k will take a while to download even on an iPhone.
  • HTML 5, while not yet a standard, is becoming available for high-end mobile browsers. Local data cache can really speed things up.
  • Design efficiently. Do you really need the JQuery library? It’s nice, but it’s big. Could you get away with a smaller framework?
  • Use progressive enhancement. Design a great experience for less capable devices, and enhance it for more capable.
  • Don’t get carried away with progressive enhancement: don’t send down code that a device doesn’t need.

Speed and effectiveness

Speed is not just about speed; we have to consider perception of speed. We talked about that quite a bit in part 1 of the series.

Good design is about more than just speed; sometimes slower speed can result in faster perceived speed and higher satisfaction. If a user is having fun or is easily achieving her goals, she will perceive the site (or application) as being faster.

And not all speed is the same. In general, interfaces that mimic physics, such as the buttons, sliders, and scrolling in most touch interfaces, must respond immediately. The illusion of physics must not be broken. But the parts of the experience that do not mimic physics, such as following a link, can have a delay.

So the design team must design well (there are lots of tips over at Design For Mobile), and must help the entire team decide when to break the speed optimization discussed above. For example, delivering larger image sizes than strictly necessary can enhance the experience. Using the occasional gradient can enhance the experience.

It’s a balancing act.

Paper or Plastic? e-readers vs mobiles vs book

Wednesday, February 10th, 2010

With all the latest announcements for e-readers and book pricing, I’ve been thinking a lot about the nature of reading recently. It seems like each company’s reading experience presumes everybody and every bit of content is the same experience.

Amazon is quite proud of their $9.99 pricing for e-books. They claim that it is cheaper than paper. And it is … for one type of reading. If you read mass market hardbacks or trade paperbacks (the ones that are the same size as the hardbacks) then $9.99 is cheaper than $15.99 or $25.99.

I do that type of reading, but only for professional-related books. These books I might want to learn from, cross-reference, make notes for adoption at the office, and so forth. I will read while traveling, but not relaxing in the tub. I don’t really share these books with my friends, though I share some of the ideas with my colleagues.

In contrast, my personal reading time is spent almost exclusively with cheap paperbacks. They’ve increased in price to $7.99, which I think is too much, but I pay it anyhow. I actively share these with people I live with, and share with friends. These are the books I take into the tub, and are more likely to come to bed with me. I keep them for a long time, but if they get lost on a trip or wet in the tub, it’s okay.

Several of these books currently live on the shelves of the people I lent them to, and while I’d like to have them back it’s completely livable. You can tell which series I really enjoy, because I no longer have the first book in the series. It’s been loaned elsewhere.

Then there are newspapers and magazines. This content is temporary by its nature, and at least for me is more akin to skimming online news and blogs.

These are not the only types of reading out there. One of the key lessons in graduate school was how to read research papers. Reading for learning or book clubs might also look very different. Reading business documents, at least in my product development world, really needs a large screen and a strong social connection. The documents do not live in a vacuum, and their business context must be considered while reviewing the product requirements document. I suspect that legal reading is different again.

Each manufacturer/provider has presumed one type of reading. Kindle is targeting trade paperback/hardback reading, largely for pleasure. The Que is designed for business use. Hearst’s Skiff is targeted more at newspapers. Apple is going after content deals galore, including textbooks and newspapers. None appear to target my pleasure-reading needs.

I’m not really worried about device fragmentation in the e-reader market. We know how to design and develop for that. I’m more worried about the purpose fragmentation. Is one going to win?

Clearly the mobile phone will continue to win here. The Kindle’s ability to continue reading on the phone where you left off on the device is brilliant. But the problems with sharing and moving content to other places still plague them; I only want to purchase material I know to be temporary. This is an industry DRM problem, but Kindle appears to be extra protective. Still a no-go for me.

In the meantime, I’m still reading the occasional book on my phone, and carrying several paperbacks on trips.

Are you wasting your mobile advertising dollars?

Wednesday, February 3rd, 2010

I was in a game on my Android. I kept seeing this kinda-teasing ad for a game; I thought it might be relevant to me as a casual puzzle game player.

Finally, after hours of play, I clicked on the ad. Many users do this, in higher rates than on the desktop-based web. The advertiser paid for me to click this link.

What should the link do?

  • Take me to a landing page directly related to the ad
  • Already know my region and device
  • Be optimized at least for mobile
  • Have a call to action on the page
  • Give me access to other information in mobile-accessible format

What did it do instead?

  • Site home page, not landing page
  • With no information about what the game was, not even platform(s)
  • Demanded that I go through a two-step process to enter my region
  • Took me to the product information page, coded in Flash