userslib.com » interface design

NCSU Library Mobile

Suzanne — Fri, 04 Dec 2009 14:31:25 +0000

NCSU recently launched a new mobile website – and it’s very impressive!

It offers standard features like catalog search, locations & hours, etc., but also allows you to view a map of where available computers are and webcams of the libraries including the line at the coffee shop. Love it.

Read about the interface: www.lib.ncsu.edu/m/about.html
View a demo of the site: www.lib.ncsu.edu/m/home/?browse=iphone

They also made a fun video to promote it:

Web Color Tools Round-up

Suzanne — Sun, 14 Sep 2008 20:13:07 +0000

A friend recently asked me for my favorite color picker tool so I thought I’d go ahead and compile them here plus some sites I use for color inspiration. Want more? Check out my delicious collection of webcolor links.

Adobe’s Kuler Browse color pallets or make your own from flickr photos!
Kris’s Color Stripes This blog is completely dedicated to making color palettes out of beautiful photographs and is great for anyone seeking inspiration or eye candy.
Color Blender This tool that lets you set a color and it suggests complementary colors to fill out your palette.
Color Jack I just discovered this one and I think it’s super. Choose a point on the color wheel and it will show you different color combinations (complementary, analogous, etc.) to go with it.

The Daily Slurp Enter a couple of colors to view a showcase of other websites sporting those colors.

Resources for iPhone development

Suzanne — Tue, 09 Sep 2008 01:07:43 +0000

Tutorial blog put together a nice list of tutorials, graphics, and code to help with developing for the iPhone.

http://tutorialblog.org/designing-for-the-iphone-resources/

I’d also add 2 nice omnigraffle stencils: Ultimate iPhone Stencil and Mobile – iPhone.

Mobile Mania – Library Websites

Suzanne — Thu, 24 Jul 2008 01:26:05 +0000

Ok, so I just got an iPhone (yay me!) and now I’m totally obsessed with mobile interface design. I’ve been looking at a variety of mobile interfaces so I thought I’d share some here.

I started with libraries that offer mobile versions of their library website. I’m also collecting Mobile OPACs, databases and non-library interfaces – so I’ll share those another time. Thanks to Superpatron for gathering a list of mobile versions of library web sites that I used as my starting point.

I’ve noticed that many of the mobile versions of library websites are basically lists of links (a few allow searching) that have no applied style. This seems to work most of the time. However, on the iPhone at least, some were a little difficult to use. Most of the interfaces required that I zoom in to read, click links, enter a search, etc. Ideally a mobile interface should actually be designed specifically for mobile devices… and when possible, designed specifically for various types of mobile devices. Now, as a quick disclaimer, I’ve only looked at these on the iPhone so they may function and look completely different on other devices.

My favorite interface I found was from the Yale Medical Library because it has obviously been designed with the specific needs of the mobile user in mind. I didn’t have to zoom, the search box and each link is styled to be easily clickable and it fit my screen perfectly.

Here are screen shots of more or less all the ones I’ve found so far (I found a few more but they were fairly identical to another one I already had). Let me know if there are others I missed!

Yahoo design pattern stencils

Suzanne — Tue, 10 Jun 2008 00:40:56 +0000

Yahoo recently released a great set of design stencils based on their design patterns. Even if you aren’t an interface designer, you might find these helpful for planning out your web form or site navigation. Omnigraffle is my tool of choice but they also have Visio and other image formats. If you’re in the market for more of the same – also try Graffletopia.

Footer mullet

Suzanne — Fri, 11 Apr 2008 13:22:59 +0000

I was talking to some folks today about our library website redesign plans and various web design trends…

One of the topics of conversation was the big footer trend. Our web designer described it as kind of a “mullet” (you know, business in front, party in back) because it lets you devote all the main screen real estate to serious content and then put all the fun stuff (like news & events, flickr images, featured/spotlight content, etc.) hanging out at the bottom.

The University of Louisville has a nice example of a big footer:
http://louisville.edu/

The group had mixed feelings about this web trend. What do ya’ll think?

What do you think about big web site footers?

Powerhouse Museum joins the Commons on Flickr

Suzanne — Mon, 07 Apr 2008 22:46:39 +0000

The Powerhouse Museum in Australia has just joined the Library of Congress to be the second member of the Commons on Flickr.

And BTW – Seb Chan’s Powerhouse blog Fresh + New(er) is one of my favorites and a fantastic source for interesting discussions about digital media, access systems, interface design, tagging and web2.0. I also love their opac/online collections site (really, it’s super cool, go play with it).

More info here:

Library Web Design – Search Box Round-up

Suzanne — Thu, 27 Mar 2008 00:12:31 +0000

If you could only have one single feature on your library web page… what would it be?

Search, right? Except library searches don’t usually work like Google (yet)… That doesn’t mean library websites should hide their search boxes, all tucked away in the corner.

Here are a few lovelies I thought I’d highlight. I tried to stick mostly to search boxes that let the user choose which “silo” to search (so, more than just a web page search or catalog search) but a few single searches were worth including.

University of Virginia Library
Now that’s a dedication to giving up some screen real estate! It won’t even fit in my blog template. I bet this one doesn’t get missed. It also has a fresh “2.0″ feeling (as does the rest of the site). Oh, and one of the tabs is for Google Scholar… interesting!

British Library
The search box is in a very prominent location, and it’s very clear about what is being searched. The little descriptions of what each search option includes is a fantastic idea and I bet does a lot to solve those pesky terminology problems.

Free Library of Philadelphia
I’m not actually sure I like how you have to select the box to do a site search only… (I’d prefer it not have the message above about what’s being searched and instead have select boxes below that say “catalog,” “databases,” and “site search” and all are selected by default). However, I find their overall design irresistible and I appreciate that the “FIND” area is a good 1/3 of the main body content!

University of North Carolina Libraries
When you select a different tab – the options under the text box change. Nicely designed and seems easy enough to use.

Vancouver Public Library
Catalog search only, but I really like how well it’s integrated into the overall site design. Very simple, yet still stands out.

Yale University Library
This is the most simple example but simple is sometimes hard to do. It has a good amount of white space around it that helps set it out from the rest of the site.

I found a few more nice onces – All are in my Search Box flickr set.

Any suggestions for other sites that have a nice, big search box?

Giant prototyping

Suzanne — Sat, 23 Feb 2008 22:17:29 +0000

Paper prototpying dramatization

Suzanne — Sun, 18 Nov 2007 17:35:02 +0000

Here’s a cool video of paper prototyping in action (minus the tedious bits). The device being tested is a PDA for meeting new people.

{ found via www.guuui.com }