In his recent article in Library Journal (The Benefits of Less) Aaron Schmidt talks about simplifying library websites to make them more usable. He suggests that a good way to work on this is to think how the site would be designed for mobile devices:

Another way to brainstorm the most important parts of your website is to imagine you’re building a mobile version. Given the limited screen real estate available, what parts of your site are essential?

I suspect Schmidt is not aware of it — I haven’t seen it discussed much in library circles — but the idea of building the mobile version of a site first, before building the full desktop site, is more than just an imaginary brainstorming idea in the dotcom tech world — In 2009, Luke Wroblewski proposed his Mobile First idea that this is the best way to design a website — Design the site first for mobile, then work on the full site design. Last year, Google’s Eric Schmidt took up Wroblewski’s theme, saying in a speech at the Mobile World Congress that Google would “work on mobile first” in bringing new tools to the Web.

A few months ago, venture-capitalist Fred Wilson wrote an elegant summary of the Mobile First idea that resonates strongly with Aaron Schmidt’s ideas for designing library websites:

I was meeting with the team from one of our portfolio companies a few weeks ago and we were talking about a redesign of their new web service. I had told them I thought the initial design was too busy and too complicated to work well in the market. They showed me the iPhone app they were planning to release soon. I said “just do that on the web.” And happily they told me they were thinking the same thing.

Using the mobile web as a constraint to think about web design is growing in popularity. I see it in my own efforts and the efforts of our portfolio companies. When users spend more time accessing your service over a mobile device, they are going to get used to that UI/UX. When you ask them to navigate a substantially busier and more complex UI/UX when they log onto the web, you are likely to keep them on the mobile app and off the web app.

I’m starting to think a unifying vision for all apps should start with the mobile app, not the web app. And so it may also be mobile first web second in designing web apps these days.

Wilson could almost be talking about the same “busy, complicated” library websites that Aaron Schmidt talks about — Good website design for a venture capitalist is also good for libraries.

Related articles:

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

National Library of Medicine staffer Loren Frant gave a good presentation at the NLM Online Users’ session at the recent MLA annual meeting, on the development of the mobile version of MedlinePlus that launched in January. I was especially interested in Loren’s talking about the decision to make this a mobile-optimized web site instead of an app. This goes along with the trend that I’ve noted — The great disadvantage of making apps for library resources is that separate apps have to be made for each of the many different mobile platforms in existence. Instead of making apps, then, it’s more efficient to make mobile-optimized web sites that will display well on any mobile platform.

When I wrote an article on the newly-launched MLP, I missed the fact that it was an optimized web site instead of an app (being a newbie iTouch user ;-) at the time). After hearing Loren’s talk, I discovered that she wrote a good article on the MLP Mobile launch (that I missed because it came out one day after mine!), in which she discusses its being a mobile web site instead of an app, as at her MLA talk.

With the booming popularity of the iPad that was launched two months ago, of course the same discussion of app vs optimized web site is being repeated, although with the larger screen size there’s much less that needs to be done to optimize web pages than on the iPhone. I’ll be watching to see whether NLM does anything to tweek MLP for the iPad.

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

Holly Hibner’s tweet about John Blyberg‘s talk at the recent Computers in Libraries (#CIL2010) was one of the mostly highly retweeted posts of the conference. Blyberg’s metaphor captures the thought that I’ve had swimming around in my head for long — What’s the use of making an elegant, user-friendly library web site when the centerpiece of the whole library info-ecosystem — the catalog — is hopelessly difficult to navigate? I blogged about this in October when I found a great graphic (part of which is below left) that points to the striking contrast between the simple, inviting user interfaces of dotcoms like Google and Apple, and the much more complicated interfaces of libraries.

With the small screen of mobile devices the trimmed-down, mobilized library website makes the old, non-mobilized library catalog seem even more ghetto-like, using Blyberg’s phrase, so that it’s questionable to even link to the catalog from the mobile library site. With the constraints of mobile design, we have no choice but to take up the opportunity and simplify. Several libraries have now mobilized their catalogs, among them the clean, simple design from UNC below. Scroll down for links to a series of articles I’ve written on mobile design and libraries.

Flickr set has graphic above & the full version in other article, that shows the context of the library catalog caricature.

Articles on mobile design and libraries:

Holly Hibner’s tweet:

hhibner: Your web site is great, but when people click on the catalog link, “Boom! They’re in the ghetto!” John Blyberg #cil2010

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

Hardin MD Gallery pages’ simple design makes them intrinsically mobile-friendly. They work especially well on an iPhone because they fit well on the screen, as described below. To go to Hardin MD Mobile click logo:

In the rest of this article, I’ll discuss and illustrate why Hardin MD Galleries are especially usable on an iPhone. I’ll also discuss the process of mobilizing Hardin MD, describe which galleries are most usable on a mobile device now, and talk some about future development.

We’ve been pleased to realize that Hardin MD galleries work especially well on an iPhone because most images  have a similar aspect-ratio to the iPhone — 1:1.5 — which is relatively unusual for a computer screen, though very common in photography (4″x6″ snapshots).

We didn’t plan it that way, but it happens that most of the images in Hardin MD are about 720 x 480 pixels (the same 1:1.5 aspect ratio as the iPhone), in landscape orientation. So, as shown in the screenshots at left, Hardin MD images fit nicely on the iPhone screen in landscape view.

Most of the individual disease/condition galleries in HMD are fairly usable on a mobile device as they are, although the navigational thumbnail images for some are rather poor. The weakest aspect of mobile-usability is the broad-grouping super-gallery thumbnail directories — Thumbnails work well for individual galleries of pictures on a particular disease condition, but they don’t work so well for super-galleries, which have several different diseases. So we’ll be making scrolling-list menus, which work well on an iPhone, for the broad topic groups, as we work on improving the mobile navigation of the individual galleries within each group. For now, the first broad-group menu is public-domain, free-to-copy galleries.

Other super-galleries, for which we’ll make mobile menus in the future are:

Besides working to improve the mobile-accessibility of super-galleries, we’ll also be trying out a second type of mobile access for individual galleries, by putting pictures in a WordPress blog — WordPress (with a wide array of smart plugins) does a wonderful job in displaying pictures on blog pages, especially because it’s so smart in handling portrait and landscape orientation. The nice fit of Hardin MD images on an iPhone screen, described above for existing galleries, also works well in a WordPress blog. Our first one is here >> Measles pictures from CDC

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

In December 2006, Luke Wroblewski blogged a good discussion about The Complexity of Simplicity in user-interface design. Interestingly (in light of his recent articles discussed below), in the 2006 article he doesn’t mention MOBILE design. What makes this especially interesting is that the iPhone, with its game-changing elegant mobile interface, exploded on the scene just a month after Wroblewski’s article, in Jan, 2007. So … Jump forward to an excerpt from Wroblewski’s Nov 2009 article Mobile First, in which he first proposed the idea that all web pages should be designed first for a small screen, before considering their appearance on a large screen:

Mobile forces you to focus – Mobile devices require software development teams to focus on only the most important data and actions in an application. There simply isn’t room in a 320 by 480 pixel screen for extraneous, unnecessary elements. You have to prioritize. So when a team designs mobile first, the end result is an experience focused on the key tasks users want to accomplish without the extraneous detours and general interface debris that litter today’s desktop-accessed Web sites.

*   *   *   *   *   *   *

The link in the quote above goes to Wroblewski’s Aug 2009 article Mobile App User Experience, which has the image at left, a great “picture-is-worth-a-thousand-words” view of the words in the quote — Cut the crap and give the user the important part, what they’re looking for! Taken together, I think, the quote and the picture tell the story of what’s been happening in the world of interface design since the introduction of the iPhone –Though I’m sure this is something of an oversimplification, I think that the simple user interface that seemed so hard to attain on a large screen has now become easier with the forced constraint of the small screen.

Wroblewski’s ideas resonate with what I’ve been writing about simple mobile design for library sites. Although he’s not talking specifically about libraries, his ideas are certainly right on-target for us in libraries. The AP News example he chooses for the picture especially catches my attention, as I’ve been watching news sites to see how they’re adjusting to the mobile upheaval — I think they carry lessons for libraries, as we go through the same thing.

Note in the picture here that we in libraries have an advantage over news sources and other dotcom sites — We don’t have the extra baggage of advertising — This in itself would seem to make mobile friendly design a Great Opportunity for Libraries. The obstacle for libraries seems to be the longstanding culture of overly complicated design for our resources, especially OPACs. The good news here is that with mobile design there really is no alternative to simple design — As Wroblewski says, the size of the screen just doesn’t allow extra fluff. The constraints of mobile design, I think, level the field — This makes it easier for us in libraries to create sites as simple and easy to use as the big dotcoms. As I’ve written, there are encouraging signs that we’re doing this.

Less is more …

I better wrap this article up — It’s turning into a classic case of controlled serendipity … Just as I thought I was about finished, the “less is more” thought came into my mind, as a pithy epigram of mobile user design. Alas, I Googled, and found this, another striking quote, from Darja Isaksson (www.inuse.se), maybe I’ll expand more later, but for now, a good way to end:

So … Does the iPhone live up to its hype? [article title] … boldface added by me …
The results? Stunning. The iPhone has introduced a new interaction paradigm to the world, in an uncompromising way that proves that “less is more” when it comes to true user experience.

Related articles:

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

The list below has all the mobile library catalogs that I’m able to find now. The link for each library goes to the mobile version of the catalog, if it’s linkable — Some (e.g. NCSU) apparently don’t have a direct link, in which case the link is to a more general page that has a link. I’ve taken screenshots on my iPod Touch of the search, list of retrievals, and complete record screens, for all catalogs on the list, that I’ve put in a Flickr set (tag for each library linked on the list). Pictures for five representative samples are below the list (indicated by an asterisk*). The combined screen Flickr pictures for all libraries, in the same format as the samples below, are here. (Catalogs added after this article first published, as labelled, have No Flickr pictures, for now.)

Boulder [Flickr]
Brig Young [Flickr]
California St Univ [No Flickr]
Curtin U (AU) [No Flickr]
Duke Univ [Flickr]
Iowa City* [Flickr]
Jönköping U (SE) [No Flickr]
LINCCweb [Flickr]
Miami Univ [Flickr]
MS State [Flickr]
NCSU* [Flickr]
Orange Co [Flickr]
Oreg State [Flickr]
Oxford [Flickr]
Stark Co [Flickr]
Texas Chr U* [Flickr]
Tri-College* [Flickr]
U Amsterdam [No Flickr]
U Brit Col [Flickr]
U Gent (BE) [No Flickr]
U Minnesota [No Flickr]
U No Carol [Flickr]
U Rochester [Flickr]
U Virginia* [Flickr]
UCoL (NZ) [No Flickr]

The screenshots for each catalog are color coded — Red is the beginning search screen, yellow is the list of retrievals, and green is the complete record. The Flickr set has separate, larger screenshots for each screen, and the color is maintained in those to make it easier to pick out different screen types.

Iowa City Publ Lib [Flickr] is one of four AIRPAC mobile catalogs from Innovative Interfaces (Boulder, ICPL, Orange Co, & Stark Co tagged together in Flickr set), all of which have similar look & feel.

NCSU [Flickr] is one of the first mobile catalogs, and still an excellent design.

Texas Christian (TCU) [Flickr] is notable because it has only a list of brief records for retrievals, with no links to a more complete record for each one.

Tri-College [Flickr] is interesting because it has a brief “drop down” complete record, that opens while keeping the context of the list of other retrieved items.

I chose Univ Virginia [Flickr] because I like its pleasing, simple design.

If you know of other mobile catalogs, send them in, via comment or email.

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

The slide below (from a recent webinar on the NCSU mobile library site) does a great job of conveying what I’ve been saying recently about the importance of keeping mobile sites simple. It also brings to mind the bottom sketch from a recent post. Taken together, these two graphics give me hope that, with the advent of mobile tech, libraries are catching on to simple design. Traditionally, the design of library interfaces (especially OPACs) has tended to take the “everything but the kitchen sink” approach, with way more information than users attend to (as shown in the bottom sketch). With the restrictions of small screen mobile-devices, though, I suspect the appeal of simple design will become more apparent, as shown nicely in the NCSU mobile catalog search.

17c62

Sketch from: Why Apple & Google Win – And Libraries Don’t

whyapple3_601

Related articles:

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

The mobile version of MedlinePlus that was released by the National Library of Medicine last week is an elegant example of what I’ve been talking about in recents posts on libraries making their sites mobile-friendly. Mobile is a great opportunity for libraries because the overriding consideration in creating a mobile-friendly site is SIMPLE Design — Eliminate everything but the bare essentials of the information being communicated — I think NLM has done an excellent job of this with Mobile MedlinePlus. What I especially like is the efficient use of screen space, as shown in the screenshots below — In going from portrait to landscape view, the text and picture grow larger to fit the screen (and the transition between views is very smooth, which can only be appreciated using a real device). … Simple mobile-friendly design like this comes naturally, I think, to librarians. So what are we waiting for?

Malaria – Top with Picture

photo12773

Malaria – Text

photo3477

Fifth Disease – Top with Picture

photo5677

Fifth Disease – Text

photo7877

Piercing & Tattoos -  Top with Picture

photo910772

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

In Michelle Kraft‘s article yesterday, Stop the App Madness, she says librarians should resist the temptation to jump on the “App bandwagon.” We don’t have the resources to create apps for all mobile platforms, she says. Good point, especially in medical libraries, where iPhone, Blackberry, and Palm are all used. But note that Michelle is NOT saying that we should resist the trend to mobile. On the contrary — Here are her words:

The most effective way to reach ALL of your mobile users is to create a mobile friendly website.  If your website is mobile friendly then you don’t have to worry how many of your users have iPhones, Blackberrys, Androids, Pixis, or whatever the next trendy sparkly new device, THEY ALL CAN USE YOUR CONTENT if your website is mobile friendly. Creating a mobile friendly website is the biggest bang for your buck [boldface by me].  It doesn’t require as much programming knowledge as an app and you are able to target way more people more effectively rather than constantly creating different apps.

I’m getting the feeling I’m on a roll … Two days ago in my article One iPod Touch per Librarian (OITPL), I suggest that libraries need to become more involved in the world of mobile devices. Early yesterday, I found one article that I thought related closely to this idea, and wrote about it. And then a few hours later, I discovered Michelle’s Biggest Bang article that also resonates with my OITPL article. …

I think Michelle is right on target — The world is going mobile, and we need to learn how to serve it. As I say in the OITPL article, we should see this as a great opportunity to help the world to discover the best way to design information on a small device, and in the process, win over the next generation of potential library users. (Note that, although I suggest in the previous article that libraries consider providing each staff member with an iPod Touch, I’m open to considering other devices if/when they become as practical as the iTouch — The underlying point is that we need to get mobile devices.

Related articles:

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey

In a discussion of how to label the just-finished decade, some people, most notably Mike Cane, have suggested that it be called “The iPod Decade.” Brian Chen echoes this sentiment, calling the iPod the Gadget of the Decade because it “opened the doors to the always-connected, always-online, all-in-one-device world that we live in today.”

Tim Spalding, on the other hand, says this: “Resolved: The Os were the ‘Lost Decade’ for library tech—libraries made incremental advances, while others flew past them.” Having gotten an iPod Touch (aka iTouch) myself recently, I get the strong sense that much of what Spalding is talking about is the explosion in mobile, especially iPhone/iTouch, use, especially by young people, in the last few years — which has made few inroads in the library world.

So what about the next decade in libraries? How can we catch up to Spalding’s world that’s flying past us? My suggestion is that we get on the mobile wagon as quickly as we can. And the most practical way to do that right now is the iPod Touch (most of the capabilities of an iPhone without the phone and its high monthly AT&T costs).

Mobile Friendly Design: A Great Opportunity for Libraries

The premium in designing information for mobile displays is Simplicity — Dotcom sites are feeling very pinched because small mobile device screens don’t leave much room for ads and Bells&Whistles –  Popular mobile news sites, for example, have mostly the text of news stories on their pages. Likewise, blogs that are well-optimized for mobile (WordPress Rocks!) have just the essential text and accompanying pictures.

A simple, streamlined screen-environment fits us in libraries very well — We don’t have to worry about squeezing ads on our pages, and we’ve never tried to compete with dotcom Bells&Whistles. So mobile seems like a natural for us.

So why haven’t more libraries adopted mobile tools? There certainly are libraries that have developed mobile interfaces for some of their services. But a big barrier to more general of embracing of mobile in libraries is that the information that we have in the “library silo” — most notably the online catalog — is generally not in mobile format (**see below). I suspect that many users, when they see that our “mobile sites” don’t include the catalog, are going to lose interest quickly.

The cost of an iTouch is in the $150-$200 range, making it practical for most libraries to consider providing each staff member with one. The real investment, I think, is going to be learning how to integrate library services with them. It’s going to take an adventurous, visionary administration to accomodate staff time to “play around on the new toy” to learn how to use it.

In many ways, I’m finding the mobile interface on the iTouch to be “uncharted waters.” The standards for what makes a good mobile site are yet-to-be-written — Bloggers, journalists, publishers, web developers — are all hard at work looking for the best approach, competing for the users’ attention. Whoever gets it first will be the winner in the next decade — Hopefully libraries will do better than in the last one.

I’d be remiss if I didn’t mention the inspiration for the cute title of this article –  One Laptop per Child (OLPC) of course — And just in case anybody’s paying attention, I’ll the first to apply the new acronym — OITPL ;-)

**Library Catalogs in mobile format – The only ones I’ve been able to find that have what I would call a truly optimized interface, to make them readable on an iTouch, are North Carolina State Univ, Iowa City Public Library, and Univ North Carolina — Please tell me if you know of others!

Related articles:

Eric Rumsey is at: eric-rumsey AttSign uiowa dott edu and on Twitter @ericrumsey