![Page 1: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/1.jpg)
Integration Encore with WebPec for Building an
Integrated Library Web SiteYi Yu
Systems Librarian of King Abdullah University of Science and Technology (KAUST) Library
Presented for MENA 2010
![Page 2: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/2.jpg)
Outline BackgroundWhy integrate Encore and WebPecImplementation ideaBenefit of the Integration Architecture overviewSolution detailsChallengesNext stepQuestions
![Page 3: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/3.jpg)
BackgroundNew university, new library – opened in
August,2009 - started from scratch20 staff members – one director, three
managers, five professionals, other assistant staff (most of whom have no library experience)
Millennium system had been implemented module by module during the first half year. However, it does not published until this August. The online catalog had been accessed through library website which was hosted by campus relationship department.
![Page 4: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/4.jpg)
Encore enhances WebPac. However, each of them has their own advantages
Two separate interfaces cause the question: when to use what?
Three search entrances cause confusion: where should I go?
Why integrating Encore with Webpec
![Page 5: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/5.jpg)
Implementation IdeaSimple, straightforward, easy to useCombine aesthetic sense and practical
functionalitiesThe implementation idea had been evolving
during the whole process of the implementation. The result is beyond pre-conceived:
-- 1 +1 > 2-- Integration Redesign-- online catalog website => Integrated
library websitehttp://library.kaust.edu.sa
![Page 6: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/6.jpg)
Benefit of the Integration Giving our patrons more search options
without having to go back and forth between two interfaces
Keeping WebPec interface advantages - providing a complete set of tools and functions
More dynamic, safe, consistent, and easy to maintain
![Page 7: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/7.jpg)
Architecture Overview
Encore
WebPec
Applicati
on
Millennium Server
Millennium client
Database
Encor
e
http://library.kaust.edu.sa
SSO
![Page 8: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/8.jpg)
Solution DetailsDesign new library web site interface;Determine information architecture and navigation
scheme Program main_menu.html page;Generate library information pages;Modify related display files: toplogo.html,
toplogo_loggedin.html, etc;Edit styles.css files;Create necessary css files;Add javascripts;Customizing webpec pages: login page, pin reset page,
electronic resources page, etc;
![Page 9: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/9.jpg)
Solution Details-modify main_menu.html <html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> </head><body> <!--{toplogo}--> <div id="left_col">News and Events…</div> <div id="main_col"> <div id="searchbox">Search box goes here…</div> <div id="content">Image carousel goes here</div> </div>
<!--{botlogo}--> </body></html>
![Page 10: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/10.jpg)
Solution Details- Generating Library information and Instruction HTML PagesAdd navigation menu in top logo filesGenerate about 60 html pages for library and
instruction informationGenerate and edit about 80 images for the library
facilities gallery, instruction pages, staff member pages, and others.
![Page 11: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/11.jpg)
Solution Details- Add Javascripts<script type="text/javascript" src="/screens/jquery-
1.4.2.min.js"></script><script type="text/javascript"
src="/screens/jquery.jcarousel.min.js"></script><script type="text/javascript"
src="/screens/thickbox.js"></script><script type="text/JavaScript"
src="/screens/curvycorners.src.js"></script>
<link rel="stylesheet" type="text/css" href="/screens/thickbox.css" />
<link rel="stylesheet" type="text/css" href="/screens/skin.css" /><link rel="stylesheet" type="text/css"
href="/screens/styles_add.css" />
![Page 12: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/12.jpg)
Solution Details- Customizing WebPec Pages
Edit ipsso.xml, login.css, in Login App configuration; edit pinreset.html, etc;
Change labels;Add tips for input requirement and format
![Page 13: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/13.jpg)
Solution Details- Customizing WebPec PagesFor login tips, add the code in
login .css file:div.pin1:after { content: '(Note: Pin must be 6 to 30 characters
long and should be Alphanumeric. The PIN must not contain common trivial patterns. For example: a character that is repeated three or more times (eg: aaaa, ababa, bbbb); a set of up to four characters is that is repeated two or more times (eg: abab, abcabc, abcdabcd).)';
display:block; color:#555555; text-align:left; }
![Page 14: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/14.jpg)
ChallengesThe original design and layout limit the flexibility
of the customization and modification;Encore layout is totally different from WebPec
layout. It is difficult to be maintain consistency between these two platforms;
Encore can not be customized right now. The top logo and top menu sections cannot be added to it. It will affect the consistency of layout.
We tried to use advanced technology (like css, javascript) to make the site more dynamic, however, we do not have a dedicated professional web developer.
![Page 15: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/15.jpg)
Next StepStudy further about user–centered design theory, and
apply it in order to improve the library website.Involve the users - survey, statistics, etc;Work with campus web developing team to get their help.
Design
Feedback
Use
![Page 16: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/16.jpg)
![Page 17: Integration Encore with WebPec for Building an Integrated Library Web Site](https://reader036.vdocument.in/reader036/viewer/2022062501/56815f53550346895dce31a3/html5/thumbnails/17.jpg)