The Remaking of

www.bibsocamer.org The website of The Bibliographical Society of America

Contents
I Introduction II The Original Website Original Site Map III Competitive Analysis IV User Research Slide 3 Slides 4-8 Slide 7 Slides 9-13 Slides 14-27

New Site Map

V The Redesign Sketches Wireframes

Slide 27
Slides 28-34 Slides 29-32 Slides 33-34

VI The Prototype

Slides 35-36

I. Introduction
ReinhalterHudsonBrown (RHB) is a boutique design agency managed by partners Lauren Reinhalter, Rob Hudson and Laura Brown. RHB was approached by the Bibliographical Society of America (BSA) with a request for proposal for the redesign of their website. RHBs goal in the redesign was to create a highly functional website that would represent BSAs professionalism and purpose while meeting its users expectations and information needs. This document sets out the process undertaken by RHB and the resulting prototype.

II. The Original Website

RHBs first step was to collect information from BSAs website that would provide a complete understanding of its current content, navigation and organization. Two deliverables were created: A Content Inventory, which hierarchically sets out each item of content of the site including pages, links, etc. A Sitemap, which visually depicts the navigation/organization of the site, including hierarchical relationships, etc.

Know from whence you came. If you know whence you came, there are absolutely no limitations to where you can go.
James Baldwin
4

Original Homepage

Content Inventory

Original Sitemap

Initial Observations
Purpose The website provides information regarding the activities and publications of the BSA, although there is no statement of the societys mission on the homepage.

Content
Design

The Content Inventory shows that there are approximately 20 pages and 30 documents in HTML, PDF and Word formats.
The visual design is unsophisticated and primarily uses the colors blue, beige and white, as illustrated on the homepage. The design is inconsistent from page to page within the website. Navigation of the website is accomplished through a left-hand navigation bar, as seen on the homepage, which contains 16 higher category menu items and limited second and third level hierarchy. In the absence of grouped related content, the site structure is unintuitive as illustrated by the explosive Site Map. The navigation is also inconsistent from page to page within the website. The website was built some time ago and is not professionally maintained. 8

Organization/ Structure

Maintenance

III. Competitive Analysis

In the next stage, RHB conducted a competitive analysis in order to build a strategy for the redesign. The goals of the competitive analysis were:

to see how BSA compares to its competitors in terms of content, design, structure and navigation to learn about websites maintained by scholarly societies and find any industry norms to gain design insights which might aid the redesign.

The Criteria RHB selected three competitor websites with comparable purpose and/or desirable functionality and compared them on the following dimensions:
Homepage
Does the homepage look professional? Does the homepage convey the purpose of the site? How many content items are on the homepage? Is the homepage layout pleasing in terms of design, formatting ,etc.? Is multimedia used? Is there a search capability? What is the main navigation tool? Is the global navigation and page templates consistent from page to page? Are links indicated obviously and consistently? Is it clear to the user where he/she is located on the website at any given point? Is content grouped together logically (like with like)? Is the site structure intuitive? How many menu items are listed on the navigation tool?

Navigation

Site Organization

Content

Is content appropriate to needs of the audience? Is news and/or new content presented in a way that indicates how current it is? How are publications handled? How are forms formatted? Is there a way for users to connect through social media?

10

The Competitors

The Music Library Association

New York Library Club

11

Results of the Analysis Similar content among all competitors (including BSA), but BSAs homepage, organization, structure, and navigation compared poorly and thus appeared less professional. BSAs site lacked many consistent norms for websites of scholarly societies, such as consistent global formatting, navigation and user location indicators; top placement of navigation bar; a search option, etc. Each competitor utilized unique methods for presentation of publications and forms.

12

Design Directions and Recommendations Based on the competitive analysis, RHB devised several design directions and recommendations for BSAs redesigned website: informative, uncluttered homepage (up to 3-4 pieces of content and up to 10 links) statement of purpose on the homepage no more than 8 menu items in the primary navigation tool secondary navigation tool follow content grouping of competitors, e.g. About Us, Publications, Awards blog or news feed to handle current content links to social media
13

IV. User Research

RHB identified three main user groups:

Academics

Students

Information Professionals
14

A User-Centered Approach RHB follows a user-centered approach to design and in the next stage of the process, they sought a better understanding of these three user groups. In particular, the goals were to understand these users: backgrounds, including their education, technical capabilities etc. information needs from scholarly and professional websites information behaviors, such as how they interact with and what they expect of these websites

15

Qualitative Research Methods - Questionnaire RHB chose to use a questionnaire because it was convenient to: reach a broad audience work within the time-constraints allow for direct comparison of results Particular attention was paid to: order and flow of questions construction and explanation of questions format options for answers pilot-testing

RHB created the questionnaire as a group using Google Forms. The partners distributed it individually to their allocated user groups.
16

Qualitative Research Methods - Questionnaire

demographic questions at beginning

range answer

check-box answers

similar questions grouped together to maintain flow

answer clarification sliding-scale answer

answers ordered alphabetically to avoid bias

17

Qualitative Research Methods - Interview RHB chose to use interviews because the method: allowed for comparison of results allowed for flexibility with restructuring/rephrasing of questions provided deeper insights with follow-up questions Particular attention was paid to: the order and flow of the interview/conversation a neutral setting the use of open and closed questions when necessary RHB created the interview protocol as a group, following a similar pattern of questions to the questionnaire and with attention paid to the context of the users. The partners interviewed individuals from their respective user groups independently, following a semi-structured approach.
18

Qualitative Research Methods - Findings

Academics
Users are internet savvy and use the internet to do research Users are members of a Professional/Scholarly organization

Students
Users are internet savvy with strong research skills and conduct/read their research mostly digitally Users expect certain items, such as about us, news, events, to appear on a homepage There is a student community that provides a basis for information sharing, including social media Users expect to be able to navigate websites through the navigation menu

Information Professionals
News, information on events are primary reasons to visit scholarly/professional websites Online forms are preferred method for applications

Users participate in social media

Users utilize a site search or browse a navigation menu to find information on a website

Social media not considered very important as means of staying current

Most users prefer browsing navigation menu to find what they need

19

Personas and Scenarios

Taking the findings of its user research, RHB created three personas and three corresponding scenarios to bring the user groups to life...

20

Personas and Scenarios - The Academic

During weekly office hours between classes at the University of North Carolina, Dr. Denise Latham is working on her laptop making a PowerPoint presentation for an upcoming class on 19th century book history. Since her students are in their first year of school, she wants to give them advice about how to get more involved in the field and start networking with other professionals. She decides she will give a short presentation on professional organizations related to the topic of the class. She wants to encourage her students to attend events and conferences, and perhaps become members of organizations that interest them so she begins to compile a resource list with organizational websites. To complete the presentation, Dr. Latham also needs information on scholarship or fellowships for which her students can apply in order to fund their membership and event fees.

21

Personas and Scenarios - The Student

Sarah just arrived home to her shared apartment in Brooklyn. She had a long day interning at the Morgan Librarys Conservation Center followed by an evening class. Her phone ran out of battery in the afternoon and she is feeling a little irritated and fatigued. Not in the mood to socialize, she goes to her room. Sarah heads over to her desk, sits down and turns on her laptop. A couple of friends in class had mentioned the Bibliographical Society of Americas upcoming Annual General Meeting. Apparently, esteemed professionals, including a Morgan Library historian, would be speaking there. She sees an opportunity to demonstrate her interest in her profession and mingle with co-workers. As she couldnt use her phone on the way home, she now goes to Google on her laptop and searches for the society. She is interested in finding information about the event and student memberships. 22

Personas and Scenarios - The Information Professional

John had joined the Bibliographical Society of America as a graduate student studying English literature, but during the busy time of going to library school and making a career shift, he allowed his BSA membership to lapse. Now that he has settled into his new job at Huxley University, having spent several years immersed in libraries and special collections, John would like to become involved once again in the world of 18th century literary scholarship. Since Huxley has an excellent collection of first editions of Jonathan Swift, he wants to renew his BSA membership and propose a panel discussion on 18th Century Political Writing for the next annual meeting. John sits down at the computer in his office and searches for the BSA website, so he can apply for membership online and find location, schedule, and other information about the annual meeting.

23

Further User Research - Card Sorting Based on the user research, it was decided that Academics were the primary users of BSAs website, with students and professionals as secondary users. RHB conducted a second stage of user research with Card Sorting. RHBs partners each held two face-to-face open card sorts of 45 cards using OptimalSort. The goals were to:

gain a deeper understanding of users mental models when handling websites identify patterns in users' expectations for the grouping and labelling of content gain insights regarding overall structure and organization of the BSA website to inform RHBs redesign
24

Further User Research - Card Sorting Findings Several findings became apparent after collecting and analyzing the six responses to the card sort exercise: Participants created similar category labels 4-7 logical navigation labels were sufficient A multi-level hierarchy emerged

25

Further User Research - Card Sorting Design Directions The results of this card sort exercise provide clear instruction for improving the sites organization and depth: Homepage navigational menu items can be reduced from 16 to five The original flat organization can be reorganized into a four-level hierarchy Clearer and more consistent labelling can be created based on sort data Based on its complete user research findings, RHB was able to propose a redesigned sitemap for BSA.

26

Redesigned Site Map

27

V. The Redesign
Armed with an understanding of the content of BSAs current website and its users information needs, behaviours and contexts, RHB progressed to redesigning the website. Starting with rough sketches, the partners gradually narrowed their ideas to refined sketches, then digital sketches then wireframes. When they had decided upon the final design as a group, they produced a working prototype.

Design is a plan for arranging elements in such a way as best to accomplish a particular purpose.
Charles Eames
28

Rough Sketches In order to produce as many ideas as possible, RHBs partners worked independently to hand-sketch designs following the 6-8-5 method.

29

Refined Sketches

RBHs partners then each chose the best of their initial 6-8 rough sketches and created 2-3 more refined handsketched designs.

30

Digital Sketches
RHBs partners each transferred their sketches to digital form (using Balsamiq) to refine their best ideas and easily communicate the design. They met and critiqued each others designs and together decided upon a direction for the prototype.
31

Wireframes
Based on the agreed design direction, RHBs partners individually created wireframes, the visual representation of the skeleton of the site, for select pages.

32

Wireframes
Using OmniGraffle and Balsamiq RHBs partners created refined designs for the paths that would be tested in the prototype.

33

Wireframes

34

VI. The Prototype

Task 1 Learn about the BSA, read about bibliography and apply for a BSA membership. Task 2 Read about the types of Events held by the BSA. Find the date of the next Annual Meeting and look at the program of the Annual Event held in 2013. Task 3 Search publications with keyword incunabula. Explore search results through tabs and facets and view two full publications in Biblioshare.

35

Live prototype available at: http://share.axure.com/41NOWC

36