1
From Static HTML to Interactive Drupal:Redesigning A Library Intranet that Enables Collaboration and Social Interaction
Huei-Lien (Elaine) Chen, Ph.D.November 4th, 2011Brick and Click Libraries
2
Project Overview
• What is the project about?o To redesign the library’s staff intranet, in order
to:• provide a more efficient intranet • improve communication• add a search capability• reduce e-mail overload• enhance positive user experience
• Project goalo To build a Drupal intranet that replaces the
current staff intranet
• Project scopeo In-house design and development that utilizes
staff time, tools, and resources available in the library
3
Screenshot: Current Intranet (RodNet) Homepage
4
Progress
• What has been done? 1. Usage Survey 2. Site Inventory 3. Sitemap 4. Interface design5. New Interface Survey6. Site Mockup7. Usability Test
5
Report 1: Usage Survey Results (N=23)
95.60%
47.80%39.10%
26.00%
47.80%
69.60%
47.80%39.10%
73.90%
6
Usage Survey Results (cont.)
• How many years of minutes should be available on the staff intranet?
Forever27%
5-7 years18%
3-4 years9%
1-2 years32%
None4%
Not sure9%
7
Usage Survey Results (cont.)
• What are the strengths of RodNet? Secure location
4%Easy access to RefXpert and
Track IT9%
Simple interface9%
Pull things together
57%
None4%
No response17%
8
Usage Survey Results (cont.)
• What are the weaknesses of RodNet? None4%
Pretty good4%
Trobuled login outside library
4%Not user friendly
4%Duplicated in-
formation4%
No search ca-pability
17%
Lack interactivity4%
Lack consistency4%
Organization/nagivation prob-
lem42%
No response13%
9
Usage Survey Results (cont.)
• What information do you have trouble locating on the current site?
None; 13.00%
Staff ino; 4.30%
Policy; 4.30%
Web author(s); 4.30%
Confused cat-egories; 30.40%
Almost every-thing; 17.40%
No response; 4.30%
10
Usage Survey Results (cont.)
• What features would you like to see added to RodNet to make it more useful to you?
None9%
Search engine30%
Organized staff info9%Staff events
9%
Library fact sheets
4%
Hover boxes explain each
category4%
Other26%
No response9%
11
Report 2: Site Inventory
• Information Architecture and Navigation Systemo inventory all the existing pages and associated files using a
Google Docs Spreadsheeto distinguish the characteristics of each file to determine logical
groupingso identify duplicated pages by content creators/reviewers o exclude pages that are no longer needed by content
creators/reviewers
12
Report 3: Sitemap
13
Screenshot: Current Intranet Homepage
14
Report 4: Redesigned Intranet Homepage
{ }
{ }{ }{}{ }
15
Screenshot: The Café Page
16
Now…
• Let’s see the site in action
17
Report 5: New Interface SurveyAny comments about the layout and design (Page width , header, footer, colors, images, photos, etc.)
"Rod Library" image clashes with the background and doesn't stand out at first glance.
Don't like the aqua blue background on tabs.
Don't like the informal feel of the site - dog image, bikes. Would prefer more formal.
It looks great. The main page looks very
good. I like it very much! Like the reference staff page. Love the new look!
18
New Interface Survey (cont.)Any comments about the navigations (top navigation, main navigation on the left hand side, tab navigation for committees and departments, quick links)
You have to scroll down to see the entire list.
Seemed a little slow, but it was probably my computer
Don't like the grey background for submenus on left-side in grey boxes.
We need a link to SUPPLY REQUESTS on the main RodNet page!
Also would like to see a link to the binding page for Bibliographers on the main page.
I think the navigation works very well! And the page looks very modern, which is also nice.
Like the tabs for navigating within departments and sub-content.
19
New Interface Survey (cont.)What do you like the most
The Google search bar. The menu bar that shows the links to "My Universe, Timecards,
etc." It's right on the homepage and you don't have to go looking for this information.
I like the design of the main page. It appears very attractive and functional.
I like the new subject areas on the left hand menu. A bit more intuitive.
The new picture! It's better than the current RodNet pictures of staff.
20
New Interface Survey (cont.)What do you like the least
When you click "Committees", you don't get the entire list at one glance.
Also, at first glance, the image with "Rod Library" doesn't stand out. It clashes with the background of the image. I believe "Rod Library" should stand out more.
I don't like the way the individual department pages are formatted.
A lot of black in the header- too much? I would move the RodNet Cafe down and put the GLPI and Supply
Requests link up higher....those are more widely used by staff.
21
New Interface Survey (cont.)Any additional suggestions?
Changing the image (dog with leaves) on the homepage would be nice as our season changes.
No more suggestions at this time. Thanks!
Not at present. Nice to see forward progress on this.
GREAT JOB! Thanks for all your hard work!
22
Report 6: Site Mockup
• Technology tools/application:o Adobe Fireworks- imageso Adobe Dreamweaver- webpages and navigation designo feed2js.com- RSS feed content (http://feed2js.org/)o Google Calendar- upcoming birthdayso Google Customized Search- site searcho Google Forms- surveys
• Some other resources:o Xmind.com- sitemap (http://www.xmind.net/)o Gliffy- flowchart (http://www.gliffy.com/)
23
Report 7: Web Usability Study Results
How to change CatID or password?
Look for discussions on "The Future of the Library"
Find statistics about the library Instruction Program
Who is the fire warden for the A&M Collection during weekdays?
Find PRC minutes about student orientaion
Need to report a computer problem
Need to enter hours in timecard for this week
Need to order some supplies
Look for professional development opportunities
What type of food is allowed in the building?
How to hire a new student assistant?
Look for 2011 Technical Services annual report
0 1 2 3 4
4- Easily completed3- Completed with help2- Completed with difficulty1- Not completed
24
Post-Test Survey
What is missing from the homepage that you expected to see? • “Not anything; easier to navigate now that used to layout; like
annual reports and training.”
• “Nothing; job announcements?”
25
Post-Test Survey (cont.)
What does not make sense about the site or is confusing?
• Groups – not sure what is so had to hover over it. Menu is too sensitive.”
• “Menu items; not expecting faculty and merit to be under groups, maybe under staff information instead.”
• “Nothing.”
26
Post-Test Survey (cont.)
What other things would you change about the site?
• “Logo doesn’t stand out. It clashes. Make better use of bottom white space on homepage.”
• “More color; nothing like purple; OK the way it looks; way to personalize it or customize it; way to add more frequently used places.”
• “Nothing.”
• “Color banner; intense black in banner on right side; picture too grey.”
27
Post-Test Survey (cont.)
What did you like about the site?
• “All is in front of your, click once or twice.”
• “Searched; like the horizontal links; menu good; calendar and schedules on homepage.”
• “Easier to navigate; announcements and training; Rod Tech Center; Like all the tech stuff together.”
• “Organization is better than old; likes training session.”
28
Post-Test Survey (cont.)
Is there something that you accessed on RodNet on a regular basis that is missing or hard to find?
• “Forms but I see it.”
• “Nothing.”
• “Nope.”
29
Current Status
• The project is currently delayed…
• What issues have risen?
• Difficult to categorize some groups; for example: “Library Senator”, “task force”, “Future of the Library discussion group”, “Distance Learning Services”, “Instructional Services”, etc.
• Drupal authority and learning curves
• Time management
• Other issues
30
2009• Needs assessment• Site inventory• Sitemap• Develop site mockup
2010• Survey new
interface and navigation
• Content review• Initial development
in Drupal
2011• Usability Study• Content review• Continue
developing site in Drupal
• Migration…
20112• Post survey?
Milestones
31
Looking Ahead
• When is the next milestone?o Migrate the site in late 2011 and/or early
2012o Train staff – the content providers such as
department heads, committee chairs- for using the new Drupal site
• Known risks and issueso Lack of sufficient knowledge in using Drupalo Depends mainly on one student employeeo Time management skillo Unseen reasons
32
Discussion
• Does your library have a staff intranet?
• Have you ever been through a redesigned intranet?
• What issues have risen and how were they resolved?
• What are your suggestions for this intranet? or ?
33
Works CitedBattles, Jason. "Designing and Building a Collaborative Library Intranet for All." Journal of Web Librarianship, 4.2-3 (2010): 251-263. Web. 16 Feb. 2010.
Etches-Johnson, Amanda, and Catherine Baird. "Corralling Web 2.0: Building an Intranet That Enables Individuals." Journal of Web Librarianship, 4.2-3 (2010): 265-276. Web. 16 Feb. 2010.
Foss, Stewart. “Web Redesign Boot Camp: Top Trends in Higher Ed Redesigned Websites.” higheredexperts.com. Higher Ed Experts. Web. 16 Feb. 2010.
34
Contact Information
Huei-Lien (Elaine) Chen, PhD.Instructional DesignerColorado State [email protected]
