WU Library Website Redesign


Published on

Published in: Technology, Education
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Introduce, briefly describe what I’m talking about…website redesign in a small academic library – via contracting it out.
  • Old site only had an image on the home page and on the page about the history of the library…. Otherwise no graphics other than in the header. Could not show off our collection, services, or interact with our patrons meaningfully.
    Only one person with any html/css/javascript/website creation experience. Makes for a complete lack of collaboration. Changes had to be handed up to director and then out to me. Time-consuming, dificult – result was that content became static. Website more of a historical document with links to resources. Old site hand-coded using css, html, and tables. Made any kind of radical change or introduction of significant new material next to impossible without a total overhaul.

    Not only interactions between librarians was desired – but also ways to interact with our patrons. Looking at chat reference for a couple of years,
  • Old site – perfectly adequate for our needs. Launched in 2003 – before that, site was a simple image map with 5 or 6 links that each went to one page with no further links. We had also moved over to ezproxy and away from individual username/password for each database. So this was a big improvement over the former situation.
    What we liked: simple, easy to navigate, all content above the fold.
  • Databases page – got increasingly unpleasant to navigate as more resources were added. Couldn’t offer too much description because of table layout easily looking too “busy.” No branding or logos to help students remember and make connections about databases.
    So…what WAS important to us as we thought about a new site?
  • This is Woodbury. The library was a church built in 1950 with the stain glass, tile, and original light fixtures all retained. The university has a large number of programs in design fields, and we felt our website should reflect that and also take more of a cutting edge design approach to more easily appeal to and appear relevant to our students.
  • When we sat down to look at the issue, we knew what we wanted… but unfortunately, we also knew (or, er, I knew) that we couldn’t do it effectively in-house. I’d be on my own completely with the redesign – as we had 3 full-time and one half-time librarian at the time we began the process (now up to 4 FT and 1 half-time). In addition to systems activities, I teach 2 classes per semester (info lit – credit-bearing course), work about 25% of my hours on the reference desk, collection development for animation, anthro, psych, communication, graphic design, fashion design, and communication; and handle instructional requests for those departments as well, serve on 5 faculty committees, etc. I had to be up-front with the library director and tell her immediately that I didn’t feel capable of handling the redesign myself and that I thought we should contract it out. – but budget was an issue….
  • What did we find? After exploring some going rates in the market with independent contractors, we heard about a webinar through Califa being put on by Craftyspace/yourLibrarySite. They were building sites (mostly public libs at that point) in Drupal 6. (Content management system – allows for site to be updated and maintained and have content created via a straightforward interface that does not require knowledge of html). The site could have been done much more quickly….probably at least 4 months faster – but we were slow. Difficult to get times for all to meet – particularly as work began over summer of 2009 and everyone takes vacations in summer.
    Worked with CS via Skype and conference calls. Periodically we involved all librarians, but many were just with me or just with the director and I and CS.
    Initially, we signed on for a package subscription (where we were going to have them adapt one of 3 basic site designs to fit our needs – which would have cost just under $9000 at the time).
    However, it eventually became apparent that we needed to move to a custom design – getting all to understand that we couldn’t just find some websites online we liked and say, “we want you to do THIS like university ABC, and THIS like university DEF, and we like this other functionality from university ZZZ” was difficult. So, we moved out of the package idea and into custom development – which we normally would not have been able to afford, but they were finishing up a design with their first academic library client, who agreed to let us reap the rewards of the research and development done by CS programmers. So, we had a custom site…sort of. The price break did enable us to explore some additional functionality that required extra programming time – which I’ll show you when you see the site….
  • As for the process…once all contracts had been signed, we started with a design questionnaire. Here are a few sample questions from it.
    3 top values: Academic excellence; quality resources; friendly, helpful customer service
    Top 3 things target audience will probably want: 1 - library online catalog access; 2- database (article research) access; 3 - information
    about services such as hours, borrowing, FAQ.
    3 words to describe look/feel: clean, friendly, good sense of design
  • We didn’t really have a logo, but it was requested by YLS, so we commissioned a member of the graphic design faculty to design a logo for us in summer of 2009. After some feedback on our part, we had these 4 logos to choose from (only colors differed). We went with #3. The W is part of the Woodbury logo on signage on campus, and the colors reflected the idea of environmental sustainability to us, which is an important principle on our campus and in our curriculum.
  • Our initial planning involved librarian meetings where we all viewed other library websites and made decisions about how we might want to structure our navigation. We took a stab at some ideas for extra, more interactive content we’d also be interested in adding to the home page.
  • YLS set up some spreadsheets in Google Docs which were shared between their programmers, me, and the project manager. It was a great way to clearly communicate changes to everyone at once. This is just one part of the larger sheet…describing part of how we wanted our searchbox widget to work – which is a hard-coded widget on the home page allowing for direct catalog searching, easy navigation to databases, subject research guides, google scholar, and a site search. There are also spreadsheets for the horizontal and left navigation bars, the lefthand “how do I?” drop down menus, and links placed in the header and footer. As I made changes, I highlighted them in various colors. We were also able to ask and answer questions of each other directly in these documents.
  • Once the basic navigation and additional functionality of the home page was somewhat decided upon, the user interface designer worked with us to develop a wireframe for the home page. We reviewed this and revised it during an all-librarian and Craftyspace Skype meeting – complete with file sharing. At this point, not all programming or content decisions were worked out at ALL – but this allowed YLS to generate enough info for the project to be referred to the graphic designer….. Who, in consult with us (and images we sent along), developed 3 possible designs…
  • These are the three designs. At this stage, we were able to pick and choose elements from different designs, but we essentially went with the one in the middle. Now it was starting to come together…. In the meantime, we wanted to work on some additional content and services to have ready to go when our new website was completed… and to get our collective feet wet in terms of Web 2.0 functionality.
  • One of the best decisions we made was to purchase an instance of libguides in November of 2009. We did staff training via a dedicated webinar in December, right before break, and then we went off and worked on libguides sort of at leisure, since we didn’t really plan on a widespread launch of them until our new site launched. Everyone was able to experience using a CMS at his/her own pace. The results were empowering. I also did some short training sessions with individual librarians who wanted to get a bit fancier.
    We also launched library facebook and twitter sites (which, I’ll admit, I need to work a bit harder with), and we planned for an ipad project – which came to fruition at the beginning of this past summer. – wanted something to search stacks, provide autonomy and interactivity for students – and not take up precious space. We had to have engineers design a prototype mount, because when we started this project, no such product existed – as ipads were not being used by anyone else in this way. All of these new services and products helped prepare us as we started changing our image towards the more cutting edge – and got librarians more comfortable with new technology in advance of the website launch. We started editing and adding content in April, 2010 – and went live on july 19, 2010.
  • We launched on July 19, 2010 – hosted by CS/YLS. Initially we thought we’d host ourselves, but Drupal requires a server capable of running MySQL So, our IT department got involved with a site redirect from the old site to the new address – which redirects to the YLS servers.
    Show site! Spotlight a few things: chat widget, carousel (required programming expense), database page (with a custom interface..ditto), rss feeds, twitter (yahoo pipes), map, hours php script in header.
    What didn’t’ we get? Additional page templates beyond basic, the home page, and the database page; carousel not all the way to where we want it, staff directory page had to be done in html and css by us – as did the style guides because the wysiwyg editor would not retain formatting correctly.
  • A note about the search widget and SIRSI… this was challenging. Initially we built what we thought were durable URLs for building catalog searches, but they only worked when there was a good match. We would get a #cs not defined error sometimes, and it was off-putting to patrons. So, we did a little more sleuthing, and got a little more help from sirsi, and discovered we needed to pass along information about the names of the indexed fields used in each search. These longer links correctly communicate how the search should behave, and have been working with no errors now.
  • How did it go? It was simple to edit and create content. YLS provided us with screencasts – links embedded in the admin interface, but also accessible via a youtube channel. The site is very flexible – allowing for easy additions of not just simple text and image content, but also mashups, and special promo boxes that allow for insertion of javascript and html .
    Show back end.
  • What did people think? Here’s a wordle based on all of their feedback via email and our feedback form on the new site.
  • WU Library Website Redesign

    1. 1. Designing for Collaboration: Woodbury University Library Website Redesign in Drupal Jenny Rosenfeld Systems Librarian Woodbury University
    2. 2. Why a site redesign? • Getting dated • Increase visual elements • Not a collaborative space • Content becoming static • Opportunities for interaction
    3. 3. Wishes and Limitations • More graphics! • New book spotlight • Get all involved • Build community • Lack of tech knowledge • Small, SMALL staff • Budget • Time
    4. 4. Solution? • YourLibrarySite.com – Eugene, OR • Site built in Drupal 6 • 15 months start to finish • Work done via Skype • Move from package -> Custom Design
    5. 5. Do you have a mission statement? If so, what is it? How well does this mission statement reflect what your company is all about? What are the top 3 values that you deliver or stand for? Please briefly explain what your organization does to deliver or represent those values. What are the top 3 things your target audience will likely want to do when visiting your website? Imagine your new website. What three words best describe the look and feel? Design Questionnaire
    6. 6. Logo Design
    7. 7. Initial Planning
    8. 8. Google Docs for Communication
    9. 9. Wireframe
    10. 10. Graphic Design Options
    11. 11. Pre-launch Library Updates
    12. 12. Site Launch!!!! • July 19, 2010 • Hosted by YourLibrarySite
    13. 13. Deep Links to Catalog for Search Widget Links need to follow this format: Title search for “Steven Holl”
    14. 14. Drupal…it’s simple • Screencast tutorials from admin interface • Ease of editing/creating by ALL • Flexible – “promos” and mashups Image: freedigitalphotos.net
    15. 15. Thank you! • Email: