Redesigning the Academic Library Website
•Download as PPTX, PDF•
2 likes•772 views
This talk covers taking a user-centered approach to redesigning the academic library website. I emphasize the importance of the wireframe before HTML is written. I also explain how the Sonoma State University Library is implementing the Xerxes 2 discovery system as well as the library's mobile website. Presented at Internet Librarian 2010.
Recommended
More Related Content
Viewers also liked
Viewers also liked (6)
Similar to Redesigning the Academic Library Website
Similar to Redesigning the Academic Library Website (20)
More from Joe Marquez
More from Joe Marquez (7)
Recently uploaded
Recently uploaded (20)
Redesigning the Academic Library Website
- 1. Redesigning the Academic Library Website: When all you ever wanted was a better apple Joe Marquez, Sonoma State University
- 2. What changes need to be made? What are future needs? What needs are not being addressed? What else don’t we know that we think we might need? Previous Library website - no global navigation - no visible “end” to the page - html only - 6 software packages - no uniform branding - multiple servers
- 3. The laundry list • Friendlier interface • Global Navigation • Intuitive structure and architecture • Branding, (more) consistent across all software packages • Ease of Updating in case of Alert • Faculty Outreach • Advertising/Marketing/Getting the Word out on • Calendar • Simplified search * • More robust OPAC * • Mobile interface *
- 4. Ask the users, sometimes they know
- 5. Survey other <body>s and harvest ideas (and ask users what they want)
- 6. What is a wireframe?
- 7. What is a wireframe? A wireframe is a spatial and conceptual representation of a webpage. Its purpose is to illustrate what a webpage will look like before <html> is written. The wireframe is about site structure, not about graphic design. What isn’t a wireframe? Well…it isn’t a webpage.
- 8. Wireframe examples – v1
- 9. Wireframe examples – v2
- 10. Wireframe examples – v3
- 11. Wireframe examples – v4
- 12. Wireframe examples – v4, secondary
- 14. It’s Alive! (and permanent beta)
- 15. OPAC and Articles/Databases – Xerxes 2 Xerxes 2 Searches the catalog and Academic Search Premier (at the moment). Built on Solr which will allow for additional XML libraries to be added such as Dspace, ContentDM, and our LibGuides.
- 16. OPAC and Articles/Databases – Xerxes 2 – Book Results Book record Includes: - citation information - SMS record to your mobile - the ability to save to a folder - the ability to request materials from ARS
- 17. OPAC and Articles/Databases – Xerxes 2 – Article Results Article record Includes: - citation information - access to full-text - basic summary - the ability to save to a folder
- 18. …and another part of the future is mobile (library.sonoma.edu/m) Mobile Home Mobile Ask Us
- 19. …and now it’s live….now what? We ask more questions. We ask: - How the users like the new site? - What suggestions do you have in making this version better? - What is missing? - Do they use the site for non-school tasks? We also observe how the students actually use the site. If you are a faculty member, begin to teach instruction and become an actual user. Your instruction sessions will show you where the site can be tightened up and more user-friendly. Essentially, the web design process never ends, we just learn more about our users.
- 20. Contact Info Joe Marquez Sonoma State University Email: joe DOT marquez AT sonoma DOT edu Web: http://library.sonoma.edu Mobile: http://library.sonoma.edu/m/
Editor's Notes
- The talk is on a redesign process with the intent of looking forward to the needs of a new generation of students. Their needs and requests are what drove the redesign process. The subtitle refers to the comparison phrase, “apples to oranges”. We are never out to compare two unlike items, but rather our out to design a better version of what we already have. So, we are really comparing apples to apples, never oranges.
- The decision to change the site was based on functionality, or lack thereof, and the need for a refresh of the library’s online presence. The redesign took place from October 2009 to July 2010.
- The laundry list based on an initial assessment of the site. This would be incorporated along with user feedback.
- In preparing for the design phase, user interviews were performed along with a card sort. This is a picture of labels for the site being organized based on card sorting. The comment “sometimes they know” is in reference to some of the users knowing what they want in a future site. Sometimes the user isn’t aware of all possible tools available from the library. One of the goals of the redesign was to market some of the lesser known resources the library has. One such area has been maps. By creating a regional geologic and topographic map mashup, our map usage has gone up.
- A great source for ideas on working with a UI is to look around at like institutions and beyond. A survey was done of other California State schools as well as other institutions, and some non-academic institutions. Harvest ideas, don’t steal them.
- What is a wireframe? It is one of the most important tools in your toolkit. The wireframe should always be employed before one line of HTML is typed. The wireframe can come in various varieties from lo-fi to hi-fi, some with functioning links. The main purpose is to display the architecture of a page or a site prior to coding.
- Wireframe examples. The next few slides demonstrate an evolution in the redesign of the Library’s homepage.
- Color is used to emphasize areas. The various wireframe examples are taken from the various files used during the design process. V2
- Color is used to emphasize areas. The various wireframe examples are taken from the various files used during the design process. V3
- Color is used to emphasize areas. The various wireframe examples are taken from the various files used during the design process. V4 This would be the final version.
- Final wireframe for the secondary pages.
- Testing the various editions is essential. Part of the testing was done online using a free service from Usabilla.com. The purpose of testing to ensure that all possible users were able to navigate the site. The reason for using an online testing service was twofold: 1) testers could test at their leisure, 2) I sent out the interface to fellow librarians who perform virtual reference. Their feedback on the interface was invaluable.
- The final version of the site went live in July, 2010. The site is “live” but nothing is ever set in stone. Minor tweaking is a constant task. I am planning post-launch usability sessions and focus groups to get feedback on how the site is working for students and faculty.
- One of the features I wanted to implement with this new design is added functionality with regards to searching the catalog and the subscription databases. Xerxes 2 (X2) performs just that task. We will be implementing a beta link in November, 2010 with the hopes of going live with X2 as our main catalog and discovery search in Spring, 2011. X2 is mobile ready. It is built on Solr and has the ability to index XML libraries such as Dspace, ContentDM, and LibGuides. Our goal is to add our institutional repository, special collections, and research guides to the discovery layer.
- Screenshot, book results. Some features include citation information, SMS record to your mobile, the ability to save searches to a folder, and requesting items from our ARS (automated retrieval system). Facets allow for ease of narrowing results.
- Screenshot, article results. Some features for the article results include citation information, access to full text, basic summary information, a service that suggests additional articles, the ability to save to a folder.
- Mobile. The library went mobile in August, 2010. The site was built in HTML and tested to work across mobile platforms. The decision to build a site rather than a proprietary app was to attract a wide-range of mobile users.
- What do we do now? We ask more questions. Rather than sitting back, we test again after the site has been in use to see where we can tighten up the design or add functionality. As I move forward to integrating the discovery layer, the next round of post-launch usability studies and focus groups will help. Also, I can’t stress the importance of getting into an instruction situation so that the designer can be the user. User-centered design is not to be done from the armchair but rather is a hands-on activity.
- Contact information.