Oh Snap! Implementing a Responsive Indoor Map Framework

We present a project showcasing innovation and teamwork in a learn-by-doing environment: Kennedy Library’s redesign of all indoor maps and way-finding system, with the use of cutting-edge graphic techniques for the web taking that takes the user experience to the next level.

As extension of a redesigned map system, our team developed a modular web-based digital framework. Working with existing Illustrator-based SVGs, we animate interactive, resolution-independent vector graphics that comply with our responsive website via open source JavaScript library Snap.svg.

One of our top priorities is to provide Cal Poly’s 18,500 students with an easy way to find available computers on any of the library’s five floors. With more than 1.4 million annual visitors, Robert E. Kennedy Library is continuously adding new services, better labs and improved online resources.

Moving from a JavaScript based, non-responsive framework with fixed width to a streamlined interactive framework integrating dynamic, resolution-independent vector graphics was one of the biggest challenges.

The application is built on top of our general maps application, dynamically drawing each of the 300 library computers and their state of availability on the map. The back end database stores information about each computer (location, availability, type) and the front-end displays the computers in real time on the preloaded library map. The application manipulates different elements within the map implemented in Snap.svg. AngularJS allows separating logic into a Model-View-Controller structure, making it easy to maintain and expand the functionality.

The real-time calculation of the 300 computer locations on any device, while maintaining a usable and intuitive interface was a challenge that UX designer, computer graphics students and the library programmer faced together.

Participants will see our best practice in action in a hands-on presentation, become familiar with the Snap.svg library, and learn to streamline, animate, innovate and innovate. You will learn how to adapt and share the responsive, open framework.

Robert E. Kennedy Library, recently awarded with ACRL’s Excellence in Academic Libraries Award, exemplifies the California Polytechnic State University’s commitment to Learn by Doing, the application of theory to practice. Student employees are our creative and innovative partners in discovery. Our approach is to mentor and entrust students with challenging real-world assignments that immerse them fully in our organization.

View Full Agenda
Date: January 23, 2015 Time: 10:15 am - 11:00 am photo of Conny Liegl

Conny Liegl

Kenneday Library, Cal Poly