This paper was presented at the 1997 CAUSE annual conference and is part of the conference proceedings, "The Information Profession and the Information Professional," published online by CAUSE. The paper content is the intellectual property of the author. Permission to print out copies of this paper is granted provided that the copies are not made or distributed for commercial advantage and the source is acknowledged. To copy or disseminate otherwise, or to republish in any form, print or electronic, requires written permission from the author and CAUSE. For further information, contact CAUSE at 303-449-4430 or send e-mail to [email protected].


CAUSE97

Imaging on the Web

By Carl Jacobson, University of Delaware

The Web provides a powerful tool for cross-platform delivery of photographic, document, and cartographic images merged seamlessly with administrative data. Business use of Web imaging is exemplified by applications such as campus-wide access to ID photographs, routing of admissions credential documents, and dynamic creation of campus maps. While the use of Web imaging methods augments and improves campus business processes, the understanding of imaging issues reveals new approaches to all campus Web solutions.  

 

The Web

The Web brings radical change to the way we conduct business on our campuses. Web interfaces to administrative systems reach new customers, provide higher levels of customer service, facilitate self-service and change the way our customers make fundamental business decisions.

The success of the Web is the outcome of a clever merging of multimedia and networking technologies. Much of the popularity of the Web is due to the cross-platform nature of its easy-to-use interface. However, the compelling use of graphics; images, logos, colors, photos... even animation and video, make the Web an interesting and exciting media for information exchange.

The Web is first and foremost a document-centric environment. We speak of "Web pages" and "hyper text markup language". However there are two significant characteristics that make Web documents unlike those we have used for years to conduct routine campus business. First is the Web's reliance on linking... the ability to link various information resources in a complex fashion, while allowing easy and intuitive point-and-click navigation. Our administrative systems of the past required a more structured, rigid and often hard-to-use navigation.

Secondly, but perhaps most obviously, the support of multimedia enables today's Web documents to part company with the business documents of our past. At first glance it may seem that support of graphics has little business value other than providing more compelling and colorful interfaces to attract customer attention. Web pages are filled with logos and backgrounds, colors and photographs. It is true that these capabilities allow us to package information in a more exciting and interesting manner. But do they actually help change the way we conduct business? Can images in themselves provide new or improved administrative service levels?

 

The University of Delaware

As one of the first adopters of the Web for campus business, the University of Delaware has asked... and answered, these questions time-and-again. The Web has proven to be a powerful administrative tool and its support for multimedia plays an important and useful role in its successful application. The Web provides easy, inexpensive, cross-platform delivery of photographic, document, and cartographic images merged seamlessly with administrative data. This paper examines several "case studies" to illustrate the issues associated with "business imaging on the Web". These examples include applications such as campus-wide access to ID photographs, routing of admissions credential documents, dynamic creation of campus maps and use of Webcam and kiosk technologies

While the use of Web imaging methods augments and improves campus business processes, the understanding of imaging issues reveals new approaches to all campus Web solutions. Lessons learned during the implementation of imaging projects can play a crucial role in the selection of Web tools, in the understanding of vendor claims of "Web enabled" and in the adoption of the Web as "the great resolver of disparate data".

 

Photographic Images

Like many institutions Delaware uses digital imaging in production of staff and student ID cards. Several capture stations are used in permanent and temporary locations to facilitate the "carding" of students and staff. Each station includes an inexpensive video camera attached to a PC using a video capture board. Each "photo" is digitized, printed on a color ID card and stored on a server.

A Web interface displays each ID card image, merged with biographic data from the student records system. With character-based Web interfaces already in use, the addition of the photographic images was surprisingly easy. Photos are stored as individual JPEG files. Since popular Web browsers provide native support for JPEG images, a single HTML phrase was needed to add these photographic images to existing biographic data pages. This means that existing, 'legacy' programmers did not need to learn new languages, new operating systems or new methods. Using their old, legacy languages they simply generated new HTML markup statements to merge both data sources.

 
On the surface this may seem like a trivial and insignificant use of Web multimedia. However, it is an important example of the power of the Web. It is an example of the Web as the great "resolver" of disparate data. Consider first the characteristics surrounding the biographic data; character-based, mainframe, MVS, COBOL, ADABAS, computing center location. Now consider the digital image; JPEG image, server, Unix, C, departmental location. The Web makes it easy to merge these two completely disparate resources onto a seamless page while insulating the users from all details. While this example uses a digital photograph, this principle is independent of media or data type. The Web is a great "resolver" of differences.

PHOTO DEMO

Student ID photographs are merged seamlessly with demographic data from legacy student records system.
photo 1

Photos in UDMart campus purchasing system represent catalog items available for purchase.
photo 2

Mapping

Campus maps are stored as digital images on Delaware servers. These maps are used to provide information about building and parking lot locations and characteristics. As expected these maps are a useful aid for those finding their way around campus. However, the Web's linking abilities allow simple maps to be associated with other kinds of campus information and become part of customer decision support systems. For example a student's course registration decisions might be affected by the knowledge that certain buildings are located in the same area, or near a certain parking lot, or that certain building have specific aids to accessibility. By merging campus maps and facilities information with course registration and drop/add the registration process becomes a "customer decision support system".  

Building maps at Delaware use server-side programs to dynamically "draw" building locators. In this way a single map can be used to specify the exact location of many buildings. This example provides an important reminder that an "image is data". And just as we manipulate character-based and numerical data within our administrative systems, we can also manipulate images. We can programmatically redraw or annotate or markup images to represent a variety of information.

MAPPING DEMO

Campus buildings and parking lots are identified using dynamically created maps.
mapping 1

Campus aids to accessibility are mapped using "hot cursor" Javascripting.
mapping 2

Document Imaging

Document imaging has long played a role in administrative computing. For the most part, document imaging solutions have been Windows-based, fat-client applications serving well-defined departmental audiences. Multi-platform, campus-wide applications are rare. However, the ubiquitous Web browser and its support for in-line images, helper applications, plug-ins and applets enables document delivery to the masses.

Consider the example of processing applications for admission to graduate programs. Applications to graduate programs at Delaware are received on paper and from the Web. As is done at many institutions, application information is captured in an admissions system database. At Delaware a Web-interface allows faculty decision-makers to review these applications, make comments, and accept or reject applicants. At Delaware all graduate admissions decisions are made on the Web. Fifty-four departments have faculty teams of five or six people to review each application and make subsequent decisions.

While all application information is reviewed on the Web and the actual decisions are made on the Web, associated credentials are copied and sent by campus postal service to each decision maker. These credentials include transcripts, graduate certification, letters of recommendation and additional miscellaneous correspondence. Scanning these documents as digital images allows their delivery to Web browsers across campus, linking documents with associated biographic information, much in the same manner as the Photo ID example considered earlier.

There are several alternatives for displaying document images within a Web application. An understanding of the pros and cons of each alternative has the fortunate side-effect of revealing a new understanding of "Web enabled" vendor claims.

Document images can be stored in various file formats including popular formats TIFF and PDF. "Viewers" or "helper applications" can be invoked by browsers to provide Web access to these documents. Viewers have the advantage of high functionality. However, they are executable programs that must reside on the client machine, are often not cross-platform and may require licensing or purchase. Viewers also take time to "start up" and load into memory.

Plug-ins are similar to viewers, but they are written to browser specifications so that they can be more tightly coupled to the browser. Initial program loading is often much faster than viewer start-up and browser controls are still enabled and available. Plug-ins run within the browser environment. However, plug-ins still require that program code be placed on the client machine, and may have cross-platform and licensing requirements similar to those of viewers. While plug-ins are more tightly coupled to the browser environment they often provide a lower level of functionality than their viewer counterparts.

Applets are small applications written using tools such as Java or Active-X that are delivered "just-in-time" as part of a Web page. Applets have the advantage of being cross-platform and not requiring pre-loading on the client machine. However applets take extra time to load program code across the network. Manipulation of images is a process-intensive chore and may result in sluggish applet performance on all but the largest, fastest clients.

Finally, document images may be displayed "in-line" just as any GIF or JPEG image. However to enable printing, document images are usually stored in a high-resolution format. To size an image for proper display in a Web browser this resolution often requires conversion. Various resolutions can provide zooming features. Additionally, many document image formats support multi-page storage, while in-line images display a page-at-a-time. When using in-line display of document images, resolution and paging is controlled by server-side scripts. A program on the server can strip a single page out of a multi-page document and reformat that page for properly sized web viewing.

The advantage to in-line viewing is that it requires no additional program code, no helpers, no plugins, on the client machine. It also require no program loading and with a single page of display-size image being delivered, response time is fastest. The disadvantages lie in the area of functionality. While paging and zooming and portrait/landscape orientation are easily provided functions, most viewers or plugins provide considerably more functionality.

 
While these alternatives are presented in the context of an imaging example, the issues are fundamental to any Web application.
  • Helpers and plugins can be highly functional, but require client-side loading, licensing and processing power.
  • Applets can be delivered just-in-time, are cross-platform but can tax network and desktop resources.
  • In-line presentation is fast and cheap, but provides limited functionality.

DOCUMENT DEMO

Helper application display of document.
helper
[click here to download required helper]

Plug-in display of document.
plugin
[click here to download required plug-in]

In-line display of document.
inline

The trade-offs must be weighed to determine the right solution for each business problem. When delivering services to a campus-wide audience the use of helper applications can be challenging... a variety of operating systems, licensing or loading on many machines, providing application support. However, the use of helpers apps with smaller, well defined audiences can provide a needed level of advanced functionality. Services targeting campus-wide audiences are often function-poor by design, allowing the untrained and uninitiated to be successfully served. When in-line functionality can meet these needs it can be placed in the hands of Web uses without licensing, loading, performance and supports worries.

 
An understanding of the roles of "helper", "plug-in", "applet" and "inline" also helps to unravel vendor claims of "Web enabled" products. With the clever use of applets and plug-ins, vendors can emulate legacy interfaces within Web browsers... without making any fundamental changes to the underlying product. While this approach provides wide-spread, multi-platform access to older host-terminal and fat-client applications, it does not leverage the powers of the Web browser. Beware of vendors placing closed, proprietary interfaces within Web browsers using such emulation. While the Web is used to deliver the interface to the desktop, many Web characteristics (statelessness, hyperlinking, multimedia...) may not be available to such applications. Additional support and licensing may also be needed to distribute "emulators" to a wide-spread audience.
 

Other Administrative Uses

Once we begin to think of images as data, and we start to merge image information with the more common character-based business information... new opportunities emerge. The additional examples below illustrate the impact of Web imaging on campus business and provide ideas for new kinds of information services.

Kiosks

With Web interfaces on all administrative systems, Delaware delivers a wide variety of information services to dorm rooms, labs, offices, homes and beyond. By placing Web-based kiosks in lobbies, service centers and at visitor events; controlled Web access is provided to students and staff while they are "out and about", as well as to campus visitors.

Images serve two fundamental kiosk purposes; to compel users to approach and use the service, and to allow touch-screen operation... eliminating keyboarding. Both of these kiosk characteristics are important in visitor's centers and at campus events but may not be needed for business kiosks targeting the undergraduate population. Campus visitors may need to be attracted to kiosk services, and may not be comfortable with a keyboard interface. On the other hand, undergraduates do not need to be compelled to kiosk services such as "printing grades" and certainly can be expected to use the keyboard.

 

Both kinds of kiosks are built at Delaware, but all are Web-based. Free, off-the-shelf Web browsers deliver information services under control of a kiosk "baby-sitter", a program to control and secure the browser environment.

KIOSK DEMO

Trabant University Center Kiosk home page.
kiosk 1

NetSitter controls Web-based kiosks.
kiosk 2 

Digital Video

Webcams are video or digital cameras that deliver real-time snapshots across the Web. While the purpose of many of the Internet's Webcams is "fun", they can also serve the institutional mission. At Delaware two inexpensive Webcams have been trained on campus construction sites. The buildings are the result of generous donations and the Webcams allow donors to monitor building progress and to share the experience with friends and constituents. An $800 Webcam cultivating millions of dollars of institutional donations is most certainly an effective business use of Web technologies.

VIDEO DEMO

The "GoreCam" monitors Gore Building progress.
Webcam

Architect's virtual tour of Gore Building.
Flyby

Digitally captured video clips or digitally created annimations may also support the administrative mission of the institution. Virtual reality modelling software creates architectual simulation and 3-D "fly-by" views of buildings or other objects. Campus and building tours may be captured on video or created in simulation.  

Webcasting

Web "push" technologies are rapidly gaining acceptance. "Push" allows controlled delivery of important institutional information to screen savers or "alert" screens. The nature of screen savers requires the use of graphics and pictures to successfully deliver message content in momentary screen displays. Delaware's Web-based kiosk system uses screen-saver technology to time-out unattended kiosks and protect abandoned sessions. Once kiosk screen-savers "kick in", they advertise campus events and services using clever and compelling graphics.  
Delaware's Web Alert system "pushes" emergency information (weather, crime, health) to users of the campus-wide Web; attaching pop-up windows to commonly visited pages. "Cookies" are used to ensure that each message is only delivered once to each user.

PUSH DEMO

Web-based kiosk screen savers.
Screen Saver

Web Alert for important campus announcements .
Web Alert

Representation and Visualization

"A picture tells a thousand words." Adopting the Web to deliver institutional information allows the representation of information using graphics and photographic images. This kind of representation isn't limited to a "charts and graphs" method of information presentation. A popular and successful example is found in The Weather Channel's iconic representation of weather conditions.

REPRESENTATION DEMO

Graphics help donors locate brick on Diamond Walkway.
Walkway

Five day forecast from The Weather Channel.
Weather

Summary

Web multimedia means more than colors, logos, flash and fun. Valuable business functionality can be provided through the creative use of Web imaging. In addition to improving administrative service, the adoption of Web imaging for business can in itself provide a heightened awareness of Web issues and capabilities. Your first Web imaging project will deliver useful service to campus customers... but it will also serve to reveal generic Web methods that will lead to more effective business Webs. The Web is changing the way we conduct business... because it's multi-platform, because it's easy to use, because it's popular, because it supports linking... and because it's rich in multimedia.  

Index of Links

  • Student records merged with photo ID.
    [http://crayfish.mis.udel.edu/carl/presence/found.htm]
  • Campus purchasing catalog product cut sheets.
    [http://crawdads.mis.udel.edu/april/udmart/rally.html]
  • Campus directory building information page.
    [http://crawdads.mis.udel.edu/ud/buildings/pages/memorial.html]
  • Aids to accessability locator map.
    [http://crawdads.mis.udel.edu/ud/access-old/lairdac.html]
  • Document imaging using helper application.
    [http://crawdads.mis.udel.edu/images/pptest/pptest1.tif]
  • Download TIF viewer for helper demo.
    [http://www.microsoft.com/windows95/info/wang.htm]
  • Document imaging using plugin.
    [http://crawdads.mis.udel.edu/images/pptest/pptest1.tif]
  • Download TIF pluging for plugin demo.
    [http://www.filenet.com/prods/watermark/plugin/download.html]
  • Document imaging using inline images.
    [http://crawdads.mis.udel.edu/cgis/tiff2gif.cgi?tiff_file=/usra/netsite/data/images/pptest/pptest1.tif]
  • Student Center kiosk.
    [http://crawdads.mis.udel.edu/kiosk/stuctrs/trabant]
  • "NetSitter", a Web-based kiosk.
    [http://www.udel.edu/ud/netsitter]
  • Gore Building Webcam.
    [http://www.udel.edu/UDstyle/Gore]
  • Gore Building annimated "flyby".
    [http://www.udel.edu/UDstyle/Gore/goreani.html]
  • Campus kiosk system screen savers.
    [http://crawdads.mis.udel.edu/kiosk/screen-savers/cj-cause/index.html]
  • Campus-wide "Web Alert" system announcements.
    [http://www.udel.edu/lynam/cj-alert/index.html]
  • Diamond Walkway donor brick locator.
    [http://crawdads.mis.udel.edu/april/dia]
  • The Weather Channel's Orlando forcast.
    [http://www.weather.com/weather/us/cities/FL_Orlando.html]
  • More demonstrations of campus business on the web at Delaware.
    [http://www.mis.udel.edu/admin.html]
 


[Comments] [Search] [Home]