[nfais-l] NFAIS Enotes, 2013, No. 4 -- Little Boxes

Mon Aug 5 09:45:44 EDT 2013

NFAIS Enotes, 2013, No. 4
Written and Compiled by Jill O’Neill

Little Boxes: Changing the Interface and User Expectations

“Little Boxes on the Hillside, Little Boxes made of Ticky Tacky,” Does anyone remember that hit from the ‘60’s that made fun of proliferating tract housing? “There's a green one and a pink one, and a blue one and a yellow one,” You can still listen to Pete Seeger’s version on YouTube ([http://www.youtube.com/watch?v=HlSpc87Jfr0] http://www.youtube.com/watch?v=HlSpc87Jfr0).

I was reminded of that when my computer was upgraded this month -- new operating system, new interface, new 23” monitor. Suddenly everywhere I went (in a virtual sense), I was presented with many boxes on the screen. I’m sure you’ve encountered it as well during the normal course of your daily computer interactions. Windows 8 is a fine example. The design -- some call it Metro/Modern -- is well-suited to screens of multiple sizes and to touch-sensitive surfaces. It’s also aimed at encouraging the kind of apps one encounters in Google’s Chrome. Some of the principles behind the design are outlined at [http://blogs.kartographers.com/modern-ui-metro-the-new-design-interface/] http://blogs.kartographers.com/modern-ui-metro-the-new-design-interface/. The key ones to take away are “touch first” and “visual feedback” to confirm to the user that the system understood the touch command. The interface has to be simplistic and content-oriented; the user’s navigational choices are to be limited.

There’s even a Pinterest board that was created by the Microsoft designers (see [http://pinterest.com/astort/metro-modern-design-museum/] http://pinterest.com/astort/metro-modern-design-museum/).  Of course, in Microsoft speak, the boxes are referred to as “tiles.”

Its pervasiveness really struck me when I recently encountered a UK-based start-up app called Lumi.do. This site (developed by the founders of music discovery engine, Last.fm) asks the user to install an extension (found in the Google Chrome Web Store) in their browser for purposes of driving serendipitous discovery of Web-based content. That extension essentially shadows browsing behavior on the web and subsequently offers new content that it assumes the user has not yet seen. It also generates a list of categories of content that are somewhat flexible over time. Lumi came up with the following categories as matching my interests:
● Books
● Business
● Design
● Economics
● Law
● Science
● Software
● Technology.

Those seem both accurate and appropriate as general topic areas governing my browsing habits while at work. The system will occasionally drop out one category (in my case, it was “software”) in favor of picking up another (Lumi substituted “culture”).

The interface display of Lumi ([http://www.lumi.do/] http://www.lumi.do) is clearly designed for interaction on a touch-surface tablet. Each news story or web page has its headline displayed in a brightly colored square that contains an active link to the full text, along with machine-generated tags. Those tags can sometimes be surprising. A news story about the recent royal birth to the Duke and Duchess of Cambridge was tagged solely as Cambridge. Tapping on one of those tags naturally brings back all of the other news items that have been similarly tagged. The ambiguous Cambridge tag brought back a number of items that weren’t related to Kate Middleton -- one about a trendy bar in Cambridge that didn’t serve alcohol, another the web page that led me to the Microsoft Research offices in that city.

The colorful tiles periodically rearrange themselves on screen when a new item is added to the user’s display. On a very large desktop monitor, this screen refresh can be jarring visually, disconcerting the reader, but on a tablet device, it is likely less of a problem.

User interactivity is supported through social networks (bring your own) or via “Collections,” the user-curated folders that are fueled through the user’s bookmarked or starred items.  Lumi encourages social behavior so contact me directly if you want an invitation to check out the engaging application.

The Next Web offers this write-up of Lumi at [http://thenextweb.com/apps/2013/07/11/meet-lumi-the-no-effort-content-discovery-engine-from-the-founders-of-last-fm/] http://thenextweb.com/apps/2013/07/11/meet-lumi-the-no-effort-content-discovery-engine-from-the-founders-of-last-fm/.

Contrast Lumi’s visuals with those of Flipboard.  If you’re unfamiliar with Flipboard, while it bills itself as a “social magazine,” it actually started out as an iOS RSS reader, winning the iPad Application of the Year award in 2010. In March of 2013, it claimed 50 million registered users having expanded on to multiple platforms; the application is primarily engineered for use on tablets and mobile phones rather than the desktop. In a July move,  Flipboard expanded to allow access to some percentage of the curated “magazines” to be viewed on the web (see: [http://www.theverge.com/2013/7/23/4547648/flipboard-comes-to-the-browser-with-readable-online-magazines] http://www.theverge.com/2013/7/23/4547648/flipboard-comes-to-the-browser-with-readable-online-magazines).

Open up Flipboard on a tablet and the grid layout of the magazines subscribed to by the user features rectangles, boxes, photos and very little text. Flipboard’s users curate content by aggregating RSS feeds from the standard news sources of magazines, newspapers, Twitter, Facebook, etc. The emphasis is on visual appeal, and those user-created magazines that it features on the web are those that are heavily graphic. The system also allows users to rearrange the order of content included in their individual magazines, as well as setting an image or cover story that will provide the primary visual clue to the user over time. As you might expect, Walt Mossberg in the Wall Street Journal offers the clearest assessment of the company’s offerings at [http://online.wsj.com/article/SB10001424127887324105204578384512070576672.html] http://online.wsj.com/article/SB10001424127887324105204578384512070576672.html.

The surprise is not that visual expressions of content are in the ascendency. The surprise is in the lack of discussion of its impact on user experience and user interface. To paraphrase the Steve Jobs’ famous phrasing of “It just works,” in the current environment, it’s just there. Video, photographic images, infographics, even Twitter’s Vine app indicate that the interface of the future will not treat these forms as some sort of separate document type.  The future of the online interface is flexible, responsive, and visually dynamic.

See how Google in its incremental redesign of YouTube is marketing OneChannel ([http://www.youtube.com/onechannel] http://www.youtube.com/onechannel)  by emphasizing these points:

● The ability for a brand to include a trailer presented solely to non-subscribers in aid of making a good first impression. Google wants you to build your following on their platform.
● Video displays appropriately across multiple screens; Google promises that even on your refrigerator, YouTube content will be effectively and attractively displayed in an appropriate scale. The only requirement is that the user’s device has a browser.
● “Your content as a unique snowflake.” Google’s system allows you to control the presentation layout of your videos and playlists. Take that, Flipboard!

Similarly, Google’s Chrome browser gets a similar treatment. The user has an option of launching the browser in either Windows 8 mode or in the classical desktop mode. No functional difference, but a visual one. Lifehacker covers Awesome New Tab Page (ANTP) at [http://lifehacker.com/5857505/awesome-new-tab-page-is-an-information+rich-windows-metro+inspired-new-tab-page-for-chrome] http://lifehacker.com/5857505/awesome-new-tab-page-is-an-information+rich-windows-metro+inspired-new-tab-page-for-chrome,  and New Metro Tab at [http://lifehacker.com/new-metrotab-adds-live-tiles-to-chromes-new-tab-page-927562142] http://lifehacker.com/new-metrotab-adds-live-tiles-to-chromes-new-tab-page-927562142. What emerges is the newest version of the personalized home pages that we saw in both the soon-to-be-defunct iGoogle and the My Yahoo pages. Google+ (which Google presumes will take the place of iGoogle) has the same block and tile approach to display.

Even smaller organizations have gotten into the act. Blogging platform Wordpress offers 25 template versions of the Metro/Modern design (see: [http://wpbriefly.com/2013/03/wordpress-metro-themes/] http://wpbriefly.com/2013/03/wordpress-metro-themes/).  USA Today (accessed via the web) has rethought its electronic layout. No reproduction of traditional printed columns here! The user is offered three options for viewing this morning’s fast food journalism via a linked grid of photos, a primarily text list view, or what USA Today calls the Big Page. The Big Page look takes the primary photo from the day’s lead story and spreads it across what it presumes is the user’s rectangular screen. Touch-sensitive large arrows - very similar to those in use in Flipboard - appear and disappear at the edges to move the reader back and forth through the content. Going to [http://www.usatoday.com/media/latest/news/] http://www.usatoday.com/media/latest/news/ will take the user to yet another grid layout of brief video clips and photos as a guide to the day’s events. Captions run fewer than ten words.

Since its introduction with Windows 7 and extending into Windows 8, this Metro/Modern design has been hotly debated. See the comments appended to this history and analysis from Fast Company at [http://www.fastcodesign.com/1670705/microsoft-new-design-strategy#1] http://www.fastcodesign.com/1670705/microsoft-new-design-strategy#1. It’s a truly worthwhile read, but then go visit Fast Company’s Co.Design home page on the web to see how it compares. Adopting a more of a single-stream approach, that page is graphically heavy in its presentation with minimal accompanying text. Headlines are legible, but the snippets of text that accompany the visuals are sized in a miniscule 9pt font.

The challenge, of course, arises when text-oriented content providers are faced with user populations who have been trained on operating systems and devices that are primarily oriented towards graphic images and visual cues. In the same way that Google’s single search box created a user expectation that is still wreaking havoc in our own information community, this Windows 8 Metro/Modern approach coupled with tablet adoption, has potential for an equal level of disruption when it comes to interface design.

YouTube’s OneChannel referenced above featured prominently (see the second bullet) the value of a presentation that worked well across a gradient of user screens and devices. That value springs from responsive Web design, an approach that has been around for three or four years (a good short overview can be found at [http://johnpolacek.github.io/scrolldeck.js/decks/responsive/] http://johnpolacek.github.io/scrolldeck.js/decks/responsive/). Business Insider calls responsive design the gold standard in today’s content environment, but notes some drawbacks in a recently published report that can be found at [http://www.businessinsider.com/rise-of-responsive-design-pros-and-cons-2013-6] http://www.businessinsider.com/rise-of-responsive-design-pros-and-cons-2013-6.

Content providers have sensibly been developing specific apps for use in a mobile environment, while preserving other interfaces that served the needs of access via the desktop. When Google announced the 2013 Scholar Metrics in late July, the content was still presented via text and numbers (see: [http://scholar.google.com/citations?view_op=top_venues&hl=en&vq=en] http://scholar.google.com/citations?view_op=top_venues&hl=en&vq=en).  But Google Scholar is peripheral in the grand scheme of its overall product offerings and one can’t be sure if the static design remains just on that basis alone. Certainly there appears to be an emphasis on folding those older Google interfaces into something more current. Blogger, for example, may be the next one up as the current challenge is to persuade well-established tech bloggers to begin posting through the newer Google+ interface. See this challenge between two internal Google employees regarding blogging in the month of August at [https://plus.google.com/113117251731252114390/posts/9yokFFb65qe] https://plus.google.com/113117251731252114390/posts/9yokFFb65qe.

A year ago, in discussing Microsoft’s Metro/Modern approach, user interface design professional Greg Cowin commented on how tired the 40 year-old desktop metaphor has become and how ill-suited it is to current expectations (see: [http://www.pursuitofgreatdesign.com/2012/03/why-has-microsofts-metro-design.html] http://www.pursuitofgreatdesign.com/2012/03/why-has-microsofts-metro-design.html).  I suspect - no, I’m certain that the traditional interfaces found currently in library information resources appear equally tired to rising populations of users who encounter them daily. Cowin noted that Microsoft was emphasizing reductionism, simplicity, and fluidity. Are we? Some of what NFAIS members have watched occur through the adoption of discovery services in the library will have prepared them for re-thinking user interfaces, just as the experience gathered from mobile apps and user interaction will have done.  But compare Microsoft’s design philosophy with the design of the online information interface that you offer your customers and ask yourselves if something new, something more engaging couldn’t be put into place. You don’t need to mimic the little boxes on the hillside; you just need to recognize that this area of the information industry is being disrupted as well and prepare for the fall-out!

*************************************

2013 NFAIS Supporters

Access Innovations, Inc.

Accessible Archives, Inc.

American Psychological Association/PsycINFO

American Theological Library Association

Annual Reviews

CAS

CrossRef

Data Conversion Laboratory, Inc.

Defense Technical Information Center

Getty Research Institute

The H. W. Wilson Foundation

Information Today, Inc.

IFIS

Modern Language Association

OCLC

Philosopher’s Information Center

ProQuest

RSuite CMS

Scope e-Knowledge Center

TEMIS, Inc.

Thomson Reuters IP & Science

Thomson Reuters IP Solutions

Unlimited Priorities LLC

********************************

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lyralists.lyrasis.org/pipermail/nfais-l/attachments/20130805/50e71a13/attachment.html>